@litigiovirtual/ius-design-components 1.0.238 → 1.0.239
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.
- package/esm2022/lib/avatar-business/avatar-business.component.mjs +3 -3
- package/esm2022/lib/avatar-v2/avatar-v2.component.mjs +3 -3
- package/esm2022/lib/card-etapa-subetapa/card-etapa-subetapa.component.mjs +3 -3
- package/esm2022/lib/card-impulso-procesal/card-impulso-procesal.component.mjs +3 -3
- package/esm2022/lib/card-vigilancia-judicial/card-vigilancia-judicial.component.mjs +3 -3
- package/esm2022/lib/chip-user/chip-user.component.mjs +6 -5
- package/esm2022/lib/create-ticket/create-ticket.component.mjs +3 -3
- package/esm2022/lib/create-ticket/index.mjs +1 -1
- package/esm2022/lib/input-password/input-password.component.mjs +8 -3
- package/esm2022/lib/slide-toggle/slide-toggle.component.mjs +2 -2
- package/fesm2022/litigiovirtual-ius-design-components.mjs +87 -81
- package/fesm2022/litigiovirtual-ius-design-components.mjs.map +1 -1
- package/lib/chip-user/chip-user.component.d.ts +3 -2
- package/lib/input-password/input-password.component.d.ts +3 -1
- package/package.json +1 -1
|
@@ -3269,11 +3269,11 @@ class SlideToggleComponent {
|
|
|
3269
3269
|
this.onCheckedChangeEvent.emit(this.checked);
|
|
3270
3270
|
}
|
|
3271
3271
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SlideToggleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3272
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SlideToggleComponent, isStandalone: true, selector: "ius-slide-toggle", inputs: { label: "label", checked: "checked" }, outputs: { onCheckedChangeEvent: "onCheckedChangeEvent" }, ngImport: i0, template: "<div class=\"ius-toggle-container\" (click)=\"toggle()\">\r\n <span class=\"label\">{{ label }}</span>\r\n <div class=\"switch\" [class.checked]=\"checked\">\r\n <div class=\"thumb\"></div>\r\n </div>\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.ius-toggle-container{display:flex;align-items:center;justify-content:space-between;width:100%;cursor:pointer;-webkit-user-select:none;user-select:none}.ius-toggle-container .label{letter-spacing:.28px;color:#333;font-family:Rubik,sans-serif;font-size:.875rem;line-height:20px}.ius-toggle-container .switch{width:34px;height:14px;background-color:#
|
|
3272
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SlideToggleComponent, isStandalone: true, selector: "ius-slide-toggle", inputs: { label: "label", checked: "checked" }, outputs: { onCheckedChangeEvent: "onCheckedChangeEvent" }, ngImport: i0, template: "<div class=\"ius-toggle-container\" (click)=\"toggle()\">\r\n <span class=\"label\">{{ label }}</span>\r\n <div class=\"switch\" [class.checked]=\"checked\">\r\n <div class=\"thumb\"></div>\r\n </div>\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.ius-toggle-container{display:flex;align-items:center;justify-content:space-between;width:100%;cursor:pointer;-webkit-user-select:none;user-select:none}.ius-toggle-container .label{letter-spacing:.28px;font-weight:500;color:#333;font-family:Rubik,sans-serif;font-size:.875rem;line-height:20px}.ius-toggle-container .switch{width:34px;height:14px;background-color:#adf5ff;border-radius:34px;position:relative;transition:background-color .3s}.ius-toggle-container .switch.checked .thumb{transform:translate(20px);background-color:#08a6db}.ius-toggle-container .switch .thumb{width:20px;height:20px;background-color:#fff;border-radius:50%;position:absolute;top:-3px;left:-3px;box-shadow:0 1px 3px #0000004d;transition:all .3s ease}\n"] }); }
|
|
3273
3273
|
}
|
|
3274
3274
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SlideToggleComponent, decorators: [{
|
|
3275
3275
|
type: Component,
|
|
3276
|
-
args: [{ selector: 'ius-slide-toggle', standalone: true, imports: [], template: "<div class=\"ius-toggle-container\" (click)=\"toggle()\">\r\n <span class=\"label\">{{ label }}</span>\r\n <div class=\"switch\" [class.checked]=\"checked\">\r\n <div class=\"thumb\"></div>\r\n </div>\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.ius-toggle-container{display:flex;align-items:center;justify-content:space-between;width:100%;cursor:pointer;-webkit-user-select:none;user-select:none}.ius-toggle-container .label{letter-spacing:.28px;color:#333;font-family:Rubik,sans-serif;font-size:.875rem;line-height:20px}.ius-toggle-container .switch{width:34px;height:14px;background-color:#
|
|
3276
|
+
args: [{ selector: 'ius-slide-toggle', standalone: true, imports: [], template: "<div class=\"ius-toggle-container\" (click)=\"toggle()\">\r\n <span class=\"label\">{{ label }}</span>\r\n <div class=\"switch\" [class.checked]=\"checked\">\r\n <div class=\"thumb\"></div>\r\n </div>\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.ius-toggle-container{display:flex;align-items:center;justify-content:space-between;width:100%;cursor:pointer;-webkit-user-select:none;user-select:none}.ius-toggle-container .label{letter-spacing:.28px;font-weight:500;color:#333;font-family:Rubik,sans-serif;font-size:.875rem;line-height:20px}.ius-toggle-container .switch{width:34px;height:14px;background-color:#adf5ff;border-radius:34px;position:relative;transition:background-color .3s}.ius-toggle-container .switch.checked .thumb{transform:translate(20px);background-color:#08a6db}.ius-toggle-container .switch .thumb{width:20px;height:20px;background-color:#fff;border-radius:50%;position:absolute;top:-3px;left:-3px;box-shadow:0 1px 3px #0000004d;transition:all .3s ease}\n"] }]
|
|
3277
3277
|
}], propDecorators: { label: [{
|
|
3278
3278
|
type: Input
|
|
3279
3279
|
}], checked: [{
|
|
@@ -3757,22 +3757,87 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
3757
3757
|
args: ['document:click', ['$event']]
|
|
3758
3758
|
}] } });
|
|
3759
3759
|
|
|
3760
|
+
class AvatarV2Component {
|
|
3761
|
+
constructor() {
|
|
3762
|
+
this.size = 'md';
|
|
3763
|
+
this.shape = 'circle';
|
|
3764
|
+
this.showEditButton = false;
|
|
3765
|
+
this.fallbackIconName = 'icon-account-circle';
|
|
3766
|
+
this.editClicked = new EventEmitter();
|
|
3767
|
+
this.initials = '';
|
|
3768
|
+
}
|
|
3769
|
+
get containerStyle() {
|
|
3770
|
+
if (!this.imageUrl && this.backgroundColor) {
|
|
3771
|
+
return { 'background-color': this.backgroundColor };
|
|
3772
|
+
}
|
|
3773
|
+
return {};
|
|
3774
|
+
}
|
|
3775
|
+
ngOnChanges(changes) {
|
|
3776
|
+
if (changes['name']) {
|
|
3777
|
+
this.initials = this.extractInitials(this.name);
|
|
3778
|
+
}
|
|
3779
|
+
}
|
|
3780
|
+
onEditClick(event) {
|
|
3781
|
+
event.stopPropagation();
|
|
3782
|
+
this.editClicked.emit();
|
|
3783
|
+
}
|
|
3784
|
+
extractInitials(name) {
|
|
3785
|
+
if (!name?.trim())
|
|
3786
|
+
return '';
|
|
3787
|
+
const parts = name.trim().split(/\s+/);
|
|
3788
|
+
if (parts.length === 1)
|
|
3789
|
+
return parts[0].charAt(0).toUpperCase();
|
|
3790
|
+
return (parts[0].charAt(0) + parts[parts.length - 1].charAt(0)).toUpperCase();
|
|
3791
|
+
}
|
|
3792
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AvatarV2Component, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3793
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: AvatarV2Component, isStandalone: true, selector: "ius-avatar-v2", inputs: { imageUrl: "imageUrl", name: "name", size: "size", shape: "shape", showEditButton: "showEditButton", backgroundColor: "backgroundColor", fallbackIconName: "fallbackIconName" }, outputs: { editClicked: "editClicked" }, usesOnChanges: true, ngImport: i0, template: "<div\r\n class=\"avatar\"\r\n [ngClass]=\"[size, shape]\"\r\n [ngStyle]=\"containerStyle\"\r\n>\r\n @if (imageUrl) {\r\n <img [src]=\"imageUrl\" [alt]=\"name || 'avatar'\" class=\"avatar__image\" />\r\n } @else if (initials) {\r\n <span class=\"body-large\" style=\"color: var(--ColorText-colorTextPrimary, #333);\">{{ initials }}</span>\r\n } @else {\r\n @switch (size) {\r\n @case ('xs') {\r\n <ius-icon-xs [iconName]=\"fallbackIconName\"></ius-icon-xs>\r\n }\r\n @case ('sm') {\r\n <ius-icon-sm [iconName]=\"fallbackIconName\"></ius-icon-sm>\r\n }\r\n @case ('md') {\r\n <ius-icon-md [iconName]=\"fallbackIconName\"></ius-icon-md>\r\n }\r\n @case ('lg') {\r\n <ius-icon-lg [iconName]=\"fallbackIconName\"></ius-icon-lg>\r\n }\r\n @case ('xl') {\r\n <ius-icon-xl [iconName]=\"fallbackIconName\"></ius-icon-xl>\r\n }\r\n @case ('xxl') {\r\n <ius-icon-xxl [iconName]=\"fallbackIconName\"></ius-icon-xxl>\r\n }\r\n }\r\n }\r\n\r\n @if (showEditButton) {\r\n <div class=\"avatar__edit-overlay\" (click)=\"onEditClick($event)\">\r\n <div class=\"avatar__edit-btn\">\r\n <ius-icon-sm iconName=\"icon-edit\"></ius-icon-sm>\r\n </div>\r\n </div>\r\n }\r\n</div>\r\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}:host{display:inline-block}.avatar{position:relative;display:flex;justify-content:center;align-items:center;background-color:#e6fdff;overflow:hidden;flex-shrink:0}.avatar.circle{border-radius:50%}.avatar.square{border-radius:8px}.avatar.xs{width:14px;height:14px}.avatar.sm{width:24px;height:24px}.avatar.md{width:32px;height:32px}.avatar.lg{width:40px;height:40px}.avatar.xl{width:64px;height:64px}.avatar.xxl{width:96px;height:96px}.avatar__image{width:100%;height:100%;object-fit:cover;display:block}.avatar__edit-overlay{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;background-color:var(--Info-Color-Info-200, #C4DFFF);opacity:0;transition:opacity .2s ease;cursor:pointer}.avatar__edit-btn{display:flex;justify-content:center;align-items:center;width:28px;height:28px;border-radius:50%;background-color:#fff;color:#333;pointer-events:none}.avatar:hover .avatar__edit-overlay{opacity:1}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: IconXsComponent, selector: "ius-icon-xs", inputs: ["iconName", "color"] }, { kind: "component", type: IconSmComponent, selector: "ius-icon-sm", inputs: ["iconName", "color"] }, { kind: "component", type: IconMdComponent, selector: "ius-icon-md", inputs: ["iconName", "color"] }, { kind: "component", type: IconXlComponent, selector: "ius-icon-xl", inputs: ["iconName", "color"] }, { kind: "component", type: IconXxlComponent, selector: "ius-icon-xxl", inputs: ["iconName", "color"] }, { kind: "component", type: IconLgComponent, selector: "ius-icon-lg", inputs: ["iconName", "color"] }] }); }
|
|
3794
|
+
}
|
|
3795
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AvatarV2Component, decorators: [{
|
|
3796
|
+
type: Component,
|
|
3797
|
+
args: [{ selector: 'ius-avatar-v2', standalone: true, imports: [
|
|
3798
|
+
CommonModule,
|
|
3799
|
+
IconXsComponent,
|
|
3800
|
+
IconSmComponent,
|
|
3801
|
+
IconMdComponent,
|
|
3802
|
+
IconXlComponent,
|
|
3803
|
+
IconXxlComponent,
|
|
3804
|
+
IconLgComponent
|
|
3805
|
+
], template: "<div\r\n class=\"avatar\"\r\n [ngClass]=\"[size, shape]\"\r\n [ngStyle]=\"containerStyle\"\r\n>\r\n @if (imageUrl) {\r\n <img [src]=\"imageUrl\" [alt]=\"name || 'avatar'\" class=\"avatar__image\" />\r\n } @else if (initials) {\r\n <span class=\"body-large\" style=\"color: var(--ColorText-colorTextPrimary, #333);\">{{ initials }}</span>\r\n } @else {\r\n @switch (size) {\r\n @case ('xs') {\r\n <ius-icon-xs [iconName]=\"fallbackIconName\"></ius-icon-xs>\r\n }\r\n @case ('sm') {\r\n <ius-icon-sm [iconName]=\"fallbackIconName\"></ius-icon-sm>\r\n }\r\n @case ('md') {\r\n <ius-icon-md [iconName]=\"fallbackIconName\"></ius-icon-md>\r\n }\r\n @case ('lg') {\r\n <ius-icon-lg [iconName]=\"fallbackIconName\"></ius-icon-lg>\r\n }\r\n @case ('xl') {\r\n <ius-icon-xl [iconName]=\"fallbackIconName\"></ius-icon-xl>\r\n }\r\n @case ('xxl') {\r\n <ius-icon-xxl [iconName]=\"fallbackIconName\"></ius-icon-xxl>\r\n }\r\n }\r\n }\r\n\r\n @if (showEditButton) {\r\n <div class=\"avatar__edit-overlay\" (click)=\"onEditClick($event)\">\r\n <div class=\"avatar__edit-btn\">\r\n <ius-icon-sm iconName=\"icon-edit\"></ius-icon-sm>\r\n </div>\r\n </div>\r\n }\r\n</div>\r\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}:host{display:inline-block}.avatar{position:relative;display:flex;justify-content:center;align-items:center;background-color:#e6fdff;overflow:hidden;flex-shrink:0}.avatar.circle{border-radius:50%}.avatar.square{border-radius:8px}.avatar.xs{width:14px;height:14px}.avatar.sm{width:24px;height:24px}.avatar.md{width:32px;height:32px}.avatar.lg{width:40px;height:40px}.avatar.xl{width:64px;height:64px}.avatar.xxl{width:96px;height:96px}.avatar__image{width:100%;height:100%;object-fit:cover;display:block}.avatar__edit-overlay{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;background-color:var(--Info-Color-Info-200, #C4DFFF);opacity:0;transition:opacity .2s ease;cursor:pointer}.avatar__edit-btn{display:flex;justify-content:center;align-items:center;width:28px;height:28px;border-radius:50%;background-color:#fff;color:#333;pointer-events:none}.avatar:hover .avatar__edit-overlay{opacity:1}\n"] }]
|
|
3806
|
+
}], propDecorators: { imageUrl: [{
|
|
3807
|
+
type: Input
|
|
3808
|
+
}], name: [{
|
|
3809
|
+
type: Input
|
|
3810
|
+
}], size: [{
|
|
3811
|
+
type: Input
|
|
3812
|
+
}], shape: [{
|
|
3813
|
+
type: Input
|
|
3814
|
+
}], showEditButton: [{
|
|
3815
|
+
type: Input
|
|
3816
|
+
}], backgroundColor: [{
|
|
3817
|
+
type: Input
|
|
3818
|
+
}], fallbackIconName: [{
|
|
3819
|
+
type: Input
|
|
3820
|
+
}], editClicked: [{
|
|
3821
|
+
type: Output
|
|
3822
|
+
}] } });
|
|
3823
|
+
|
|
3760
3824
|
class ChipUserComponent {
|
|
3761
3825
|
constructor() {
|
|
3762
|
-
this.imageUrl = 'https://media.istockphoto.com/id/1389348844/es/foto/foto-de-estudio-de-una-hermosa-joven-sonriendo-mientras-est%C3%A1-de-pie-sobre-un-fondo-gris.jpg?s=612x612&w=0&k=20&c=kUufmNoTnDcRbyeHhU1wRiip-fNjTWP9owjHf75frFQ=';
|
|
3763
3826
|
this.onRemoveEvent = new EventEmitter();
|
|
3764
3827
|
}
|
|
3765
3828
|
remove() {
|
|
3766
3829
|
this.onRemoveEvent.emit(null);
|
|
3767
3830
|
}
|
|
3768
3831
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ChipUserComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3769
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: ChipUserComponent, isStandalone: true, selector: "ius-chip-user", inputs: { imageUrl: "imageUrl", text: "text" }, outputs: { onRemoveEvent: "onRemoveEvent" }, ngImport: i0, template: "<div class=\"container-general\">\r\n <div class=\"content\">\r\n <ius-avatar-
|
|
3832
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: ChipUserComponent, isStandalone: true, selector: "ius-chip-user", inputs: { imageUrl: "imageUrl", name: "name", text: "text" }, outputs: { onRemoveEvent: "onRemoveEvent" }, ngImport: i0, template: "<div class=\"container-general\">\r\n <div class=\"content\">\r\n <ius-avatar-v2 [imageUrl]=\"imageUrl\" [name]=\"name\" size=\"md\" shape=\"circle\"></ius-avatar-v2>\r\n <span class=\"text-name\">{{text}}</span>\r\n <div class=\"actions\">\r\n <button (click)=\"remove()\" class=\"button-remove\">\r\n <ius-icon-md iconName=\"icon-cancel\"></ius-icon-md>\r\n </button>\r\n </div>\r\n </div>\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.container-general{position:relative;height:100%}.content{display:flex;height:30px;padding:8px;align-items:center;gap:10px;border-radius:8px;border:.5px solid #bfbfbf}.content:hover{background:transparent!important}.content:hover .actions{display:block;right:0}.text-name{color:#000;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:block;text-align:left;flex:1 0 0;min-width:0}.actions{display:none}.button-remove{border:none;cursor:pointer;height:32px;width:32px;display:flex;justify-content:center;align-items:center;border-radius:100px;background:#f5f5f5}.button-remove:hover{background:#eaeaea}\n"], dependencies: [{ kind: "component", type: AvatarV2Component, selector: "ius-avatar-v2", inputs: ["imageUrl", "name", "size", "shape", "showEditButton", "backgroundColor", "fallbackIconName"], outputs: ["editClicked"] }, { kind: "component", type: IconMdComponent, selector: "ius-icon-md", inputs: ["iconName", "color"] }] }); }
|
|
3770
3833
|
}
|
|
3771
3834
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ChipUserComponent, decorators: [{
|
|
3772
3835
|
type: Component,
|
|
3773
|
-
args: [{ selector: 'ius-chip-user', standalone: true, imports: [
|
|
3836
|
+
args: [{ selector: 'ius-chip-user', standalone: true, imports: [AvatarV2Component, IconMdComponent], template: "<div class=\"container-general\">\r\n <div class=\"content\">\r\n <ius-avatar-v2 [imageUrl]=\"imageUrl\" [name]=\"name\" size=\"md\" shape=\"circle\"></ius-avatar-v2>\r\n <span class=\"text-name\">{{text}}</span>\r\n <div class=\"actions\">\r\n <button (click)=\"remove()\" class=\"button-remove\">\r\n <ius-icon-md iconName=\"icon-cancel\"></ius-icon-md>\r\n </button>\r\n </div>\r\n </div>\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.container-general{position:relative;height:100%}.content{display:flex;height:30px;padding:8px;align-items:center;gap:10px;border-radius:8px;border:.5px solid #bfbfbf}.content:hover{background:transparent!important}.content:hover .actions{display:block;right:0}.text-name{color:#000;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:block;text-align:left;flex:1 0 0;min-width:0}.actions{display:none}.button-remove{border:none;cursor:pointer;height:32px;width:32px;display:flex;justify-content:center;align-items:center;border-radius:100px;background:#f5f5f5}.button-remove:hover{background:#eaeaea}\n"] }]
|
|
3774
3837
|
}], propDecorators: { imageUrl: [{
|
|
3775
3838
|
type: Input
|
|
3839
|
+
}], name: [{
|
|
3840
|
+
type: Input
|
|
3776
3841
|
}], text: [{
|
|
3777
3842
|
type: Input
|
|
3778
3843
|
}], onRemoveEvent: [{
|
|
@@ -4656,6 +4721,7 @@ class InputPasswordComponent {
|
|
|
4656
4721
|
this.disabled = false;
|
|
4657
4722
|
this.showHelpText = false;
|
|
4658
4723
|
this.labelInput = '';
|
|
4724
|
+
this.error = false;
|
|
4659
4725
|
this.onChangesValueEvent = new EventEmitter();
|
|
4660
4726
|
this.onKeyPressEvent = new EventEmitter();
|
|
4661
4727
|
}
|
|
@@ -4683,11 +4749,11 @@ class InputPasswordComponent {
|
|
|
4683
4749
|
this.onKeyPressEvent.next(this.textInput);
|
|
4684
4750
|
}
|
|
4685
4751
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: InputPasswordComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
4686
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: InputPasswordComponent, isStandalone: true, selector: "ius-input-password", inputs: { textInput: "textInput", required: "required", disabled: "disabled", showHelpText: "showHelpText", labelSuperior: "labelSuperior", labelInferior: "labelInferior", labelInput: "labelInput", iconInput: "iconInput" }, outputs: { onChangesValueEvent: "onChangesValueEvent", onKeyPressEvent: "onKeyPressEvent" }, ngImport: i0, template: "<div class=\"container-general\">\r\n @if (labelSuperior) {\r\n <div class=\"container-label-sup\" [ngClass]=\"{\r\n 'disabled': disabled\r\n }\">\r\n @if(!disabled && required){\r\n <div class=\"icon-dot\"></div>\r\n }\r\n <span class=\"\">{{labelSuperior}}</span>\r\n @if(!disabled && showHelpText){\r\n <ius-icon-md iconName=\"icon-help\" class=\"icon-color-help\"></ius-icon-md>\r\n }\r\n <span>:</span>\r\n </div>\r\n }\r\n <div class=\"container-textfield\" [ngClass]=\"{\r\n 'disabled': disabled,\r\n 'focused': isFocused,\r\n 'alert': !isFocused && isAlertText && !disabled\r\n }\">\r\n @if (iconInput) {\r\n <ius-icon-md [iconName]=\"iconInput\" class=\"icon-color\"></ius-icon-md>\r\n }\r\n <input [type]=\"passwordVisible ? 'text' : 'password'\" [(ngModel)]=\"textInput\" [placeholder]=\"labelInput\" [disabled]=\"disabled\" (input)=\"onInput()\"\r\n (focus)=\"onFocus()\" (blur)=\"onBlur()\" (keypress)=\"onKeyPress($event)\">\r\n @if (!disabled && textInput) {\r\n <button class=\"button-delete\" (click)=\"togglePasswordVisibility()\">\r\n @if (passwordVisible) {\r\n <ius-icon-md iconName=\"icon-visibility\" class=\"icon-color-cancel\"></ius-icon-md>\r\n }@else{\r\n <ius-icon-md iconName=\"icon-visibility\" class=\"icon-color-cancel\"></ius-icon-md>\r\n }\r\n </button>\r\n }\r\n </div>\r\n @if (labelInferior && isFocused) {\r\n <span class=\"label-inf\">{{labelInferior}}</span>\r\n }
|
|
4752
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: InputPasswordComponent, isStandalone: true, selector: "ius-input-password", inputs: { textInput: "textInput", required: "required", disabled: "disabled", showHelpText: "showHelpText", labelSuperior: "labelSuperior", labelInferior: "labelInferior", errorText: "errorText", labelInput: "labelInput", iconInput: "iconInput", error: "error" }, outputs: { onChangesValueEvent: "onChangesValueEvent", onKeyPressEvent: "onKeyPressEvent" }, ngImport: i0, template: "<div class=\"container-general\">\r\n @if (labelSuperior) {\r\n <div class=\"container-label-sup\" [ngClass]=\"{\r\n 'disabled': disabled\r\n }\">\r\n @if(!disabled && required){\r\n <div class=\"icon-dot\"></div>\r\n }\r\n <span class=\"\">{{labelSuperior}}</span>\r\n @if(!disabled && showHelpText){\r\n <ius-icon-md iconName=\"icon-help\" class=\"icon-color-help\"></ius-icon-md>\r\n }\r\n <span>:</span>\r\n </div>\r\n }\r\n <div class=\"container-textfield\" [ngClass]=\"{\r\n 'disabled': disabled,\r\n 'focused': isFocused,\r\n 'alert': (!isFocused && isAlertText && !disabled) || (error && !disabled)\r\n }\">\r\n @if (iconInput) {\r\n <ius-icon-md [iconName]=\"iconInput\" class=\"icon-color\"></ius-icon-md>\r\n }\r\n <input [type]=\"passwordVisible ? 'text' : 'password'\" [(ngModel)]=\"textInput\" [placeholder]=\"labelInput\" [disabled]=\"disabled\" (input)=\"onInput()\"\r\n (focus)=\"onFocus()\" (blur)=\"onBlur()\" (keypress)=\"onKeyPress($event)\">\r\n @if (!disabled && textInput) {\r\n <button class=\"button-delete\" (click)=\"togglePasswordVisibility()\">\r\n @if (passwordVisible) {\r\n <ius-icon-md iconName=\"icon-visibility\" class=\"icon-color-cancel\"></ius-icon-md>\r\n }@else{\r\n <ius-icon-md iconName=\"icon-visibility\" class=\"icon-color-cancel\"></ius-icon-md>\r\n }\r\n </button>\r\n }\r\n </div>\r\n @if (labelInferior && isFocused && !error) {\r\n <span class=\"label-inf\">{{labelInferior}}</span>\r\n } @if ((errorText || labelInferior) && ((!isFocused && isAlertText && !disabled) || (error && !disabled))) {\r\n <span class=\"label-inf alert\">{{ errorText ?? labelInferior }}</span>\r\n }\r\n\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.container-general{position:relative;height:100%}.container-textfield{display:flex;padding:10px 12px;justify-content:center;align-items:flex-start;gap:4px;border:1px solid #f5f5f5;border-radius:8px;background:#f5f5f5;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px;transition:all .2s ease-in-out}.container-textfield:hover:not(.disabled):not(.focused):not(.alert){background:#edf6ff}.container-textfield.focused{border:1px solid #0581BC;background:#edf6ff}.container-textfield.disabled{background:#f5f5f5}.container-textfield.disabled .icon-color{color:#bfbfbf}.container-textfield.disabled input::placeholder{color:#bfbfbf;opacity:1}.container-textfield.alert{border:1px solid #DB2E2A;background:#fff4f0}.icon-color{color:#595959}.icon-color-cancel{color:#013169}input{display:flex;align-items:center;flex:1 0 0;border:none;outline:none;background-color:transparent;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.button-delete{display:flex;align-items:center;justify-content:center;background:none;border:none;cursor:pointer;padding:0;color:#595959}.button-delete:hover{color:#013169}.container-label-sup{display:flex;align-items:center;gap:4px;margin-bottom:8px;color:#333;font-family:Roboto,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.container-label-sup.disabled{color:#bfbfbf}.icon-dot{display:flex;align-items:center;width:4px;height:4px;aspect-ratio:1/1;background-color:#db2e2a;border-radius:100px}.icon-color-help{color:#8c8c8c}.label-inf{display:flex;position:absolute;margin-top:4px;color:#595959;font-family:Roboto,sans-serif;font-size:.75rem;font-style:italic;font-weight:500;line-height:16px;letter-spacing:.24px}.label-inf.alert{color:#931224}\n"], dependencies: [{ kind: "component", type: IconMdComponent, selector: "ius-icon-md", inputs: ["iconName", "color"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$3.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: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
|
|
4687
4753
|
}
|
|
4688
4754
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: InputPasswordComponent, decorators: [{
|
|
4689
4755
|
type: Component,
|
|
4690
|
-
args: [{ selector: 'ius-input-password', standalone: true, imports: [IconMdComponent, FormsModule, CommonModule], template: "<div class=\"container-general\">\r\n @if (labelSuperior) {\r\n <div class=\"container-label-sup\" [ngClass]=\"{\r\n 'disabled': disabled\r\n }\">\r\n @if(!disabled && required){\r\n <div class=\"icon-dot\"></div>\r\n }\r\n <span class=\"\">{{labelSuperior}}</span>\r\n @if(!disabled && showHelpText){\r\n <ius-icon-md iconName=\"icon-help\" class=\"icon-color-help\"></ius-icon-md>\r\n }\r\n <span>:</span>\r\n </div>\r\n }\r\n <div class=\"container-textfield\" [ngClass]=\"{\r\n 'disabled': disabled,\r\n 'focused': isFocused,\r\n 'alert': !isFocused && isAlertText && !disabled\r\n }\">\r\n @if (iconInput) {\r\n <ius-icon-md [iconName]=\"iconInput\" class=\"icon-color\"></ius-icon-md>\r\n }\r\n <input [type]=\"passwordVisible ? 'text' : 'password'\" [(ngModel)]=\"textInput\" [placeholder]=\"labelInput\" [disabled]=\"disabled\" (input)=\"onInput()\"\r\n (focus)=\"onFocus()\" (blur)=\"onBlur()\" (keypress)=\"onKeyPress($event)\">\r\n @if (!disabled && textInput) {\r\n <button class=\"button-delete\" (click)=\"togglePasswordVisibility()\">\r\n @if (passwordVisible) {\r\n <ius-icon-md iconName=\"icon-visibility\" class=\"icon-color-cancel\"></ius-icon-md>\r\n }@else{\r\n <ius-icon-md iconName=\"icon-visibility\" class=\"icon-color-cancel\"></ius-icon-md>\r\n }\r\n </button>\r\n }\r\n </div>\r\n @if (labelInferior && isFocused) {\r\n <span class=\"label-inf\">{{labelInferior}}</span>\r\n }
|
|
4756
|
+
args: [{ selector: 'ius-input-password', standalone: true, imports: [IconMdComponent, FormsModule, CommonModule], template: "<div class=\"container-general\">\r\n @if (labelSuperior) {\r\n <div class=\"container-label-sup\" [ngClass]=\"{\r\n 'disabled': disabled\r\n }\">\r\n @if(!disabled && required){\r\n <div class=\"icon-dot\"></div>\r\n }\r\n <span class=\"\">{{labelSuperior}}</span>\r\n @if(!disabled && showHelpText){\r\n <ius-icon-md iconName=\"icon-help\" class=\"icon-color-help\"></ius-icon-md>\r\n }\r\n <span>:</span>\r\n </div>\r\n }\r\n <div class=\"container-textfield\" [ngClass]=\"{\r\n 'disabled': disabled,\r\n 'focused': isFocused,\r\n 'alert': (!isFocused && isAlertText && !disabled) || (error && !disabled)\r\n }\">\r\n @if (iconInput) {\r\n <ius-icon-md [iconName]=\"iconInput\" class=\"icon-color\"></ius-icon-md>\r\n }\r\n <input [type]=\"passwordVisible ? 'text' : 'password'\" [(ngModel)]=\"textInput\" [placeholder]=\"labelInput\" [disabled]=\"disabled\" (input)=\"onInput()\"\r\n (focus)=\"onFocus()\" (blur)=\"onBlur()\" (keypress)=\"onKeyPress($event)\">\r\n @if (!disabled && textInput) {\r\n <button class=\"button-delete\" (click)=\"togglePasswordVisibility()\">\r\n @if (passwordVisible) {\r\n <ius-icon-md iconName=\"icon-visibility\" class=\"icon-color-cancel\"></ius-icon-md>\r\n }@else{\r\n <ius-icon-md iconName=\"icon-visibility\" class=\"icon-color-cancel\"></ius-icon-md>\r\n }\r\n </button>\r\n }\r\n </div>\r\n @if (labelInferior && isFocused && !error) {\r\n <span class=\"label-inf\">{{labelInferior}}</span>\r\n } @if ((errorText || labelInferior) && ((!isFocused && isAlertText && !disabled) || (error && !disabled))) {\r\n <span class=\"label-inf alert\">{{ errorText ?? labelInferior }}</span>\r\n }\r\n\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.container-general{position:relative;height:100%}.container-textfield{display:flex;padding:10px 12px;justify-content:center;align-items:flex-start;gap:4px;border:1px solid #f5f5f5;border-radius:8px;background:#f5f5f5;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px;transition:all .2s ease-in-out}.container-textfield:hover:not(.disabled):not(.focused):not(.alert){background:#edf6ff}.container-textfield.focused{border:1px solid #0581BC;background:#edf6ff}.container-textfield.disabled{background:#f5f5f5}.container-textfield.disabled .icon-color{color:#bfbfbf}.container-textfield.disabled input::placeholder{color:#bfbfbf;opacity:1}.container-textfield.alert{border:1px solid #DB2E2A;background:#fff4f0}.icon-color{color:#595959}.icon-color-cancel{color:#013169}input{display:flex;align-items:center;flex:1 0 0;border:none;outline:none;background-color:transparent;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.button-delete{display:flex;align-items:center;justify-content:center;background:none;border:none;cursor:pointer;padding:0;color:#595959}.button-delete:hover{color:#013169}.container-label-sup{display:flex;align-items:center;gap:4px;margin-bottom:8px;color:#333;font-family:Roboto,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.container-label-sup.disabled{color:#bfbfbf}.icon-dot{display:flex;align-items:center;width:4px;height:4px;aspect-ratio:1/1;background-color:#db2e2a;border-radius:100px}.icon-color-help{color:#8c8c8c}.label-inf{display:flex;position:absolute;margin-top:4px;color:#595959;font-family:Roboto,sans-serif;font-size:.75rem;font-style:italic;font-weight:500;line-height:16px;letter-spacing:.24px}.label-inf.alert{color:#931224}\n"] }]
|
|
4691
4757
|
}], propDecorators: { textInput: [{
|
|
4692
4758
|
type: Input
|
|
4693
4759
|
}], required: [{
|
|
@@ -4700,10 +4766,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
4700
4766
|
type: Input
|
|
4701
4767
|
}], labelInferior: [{
|
|
4702
4768
|
type: Input
|
|
4769
|
+
}], errorText: [{
|
|
4770
|
+
type: Input
|
|
4703
4771
|
}], labelInput: [{
|
|
4704
4772
|
type: Input
|
|
4705
4773
|
}], iconInput: [{
|
|
4706
4774
|
type: Input
|
|
4775
|
+
}], error: [{
|
|
4776
|
+
type: Input
|
|
4707
4777
|
}], onChangesValueEvent: [{
|
|
4708
4778
|
type: Output
|
|
4709
4779
|
}], onKeyPressEvent: [{
|
|
@@ -6835,14 +6905,14 @@ class CardVigilanciaJudicialComponent {
|
|
|
6835
6905
|
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: CardVigilanciaJudicialComponent, isStandalone: true, selector: "ius-card-vigilancia-judicial", inputs: { collapse: "collapse", hasNotificacion: "hasNotificacion", hasAuto: "hasAuto", read: "read", titulo: "titulo", juzgado: "juzgado", fechaPrincipal: "fechaPrincipal", actuaciones: "actuaciones" }, outputs: { onClickButtonCopy: "onClickButtonCopy", onClickButtonRead: "onClickButtonRead", onClickButtonNotificacion: "onClickButtonNotificacion", onClickButtonAuto: "onClickButtonAuto" }, providers: [
|
|
6836
6906
|
{ provide: LOCALE_ID, useValue: 'es' },
|
|
6837
6907
|
DatePipe
|
|
6838
|
-
], ngImport: i0, template: "<div class=\"ctn-gnrl\" (click)=\"toggleCollapse()\">\
|
|
6908
|
+
], ngImport: i0, template: "<div class=\"ctn-gnrl\" (click)=\"toggleCollapse()\">\n <div class=\"ctn-card\">\n <div class=\"ctn-inf\">\n <ius-icon-sm iconName=\"icon-account-balance\" class=\"icon-account\"\n [ngClass]=\"{'priority-tx': hasNotificacion || hasAuto }\"></ius-icon-sm>\n <div class=\"info\">\n <span class=\"caption-sm txt-ter\">Vigilancia Judicial</span>\n <span class=\"body-base-1 txt-pry\" [ngClass]=\"{'title-no-read': read === false}\">{{titulo}}</span>\n <span class=\"body-base-1 txt-sec\">{{juzgado}}</span>\n </div>\n </div>\n <div class=\"ctn-icons\">\n @if (hasNotificacion || hasAuto) {\n <div class=\"row-text-1\">\n @if (hasNotificacion) {\n <ius-icon-sm iconName=\"icon-notification-2\" class=\"txt-sec\"></ius-icon-sm>\n }\n @if (hasAuto) {\n <ius-icon-sm iconName=\"icon-docs-2\" class=\"txt-sec\"></ius-icon-sm>\n }\n </div>\n }\n <div class=\"row-text-2\">\n <div class=\"icon-dot\" [ngClass]=\"{'icon-dot-f': read === true}\"></div>\n <span class=\"body-sm txt-ter fecha\">{{fechaPrincipal | date: 'd MMM y'}}</span>\n <span class=\"buttons-hove\">\n <ius-button-circle-tertiary iconName=\"icon-mark-chat-read\"\n [iusPopoverContent]=\"read ? 'Marcar como no le\u00EDdo' : 'Marcar como le\u00EDdo'\"\n (buttonClicked)=\"clickButtonRead($event)\"></ius-button-circle-tertiary>\n <ius-button-circle-tertiary iconName=\"icon-content-copy\"\n iusPopoverContent=\"Copiar informaci\u00F3n\"\n (buttonClicked)=\"clickButtonCopy($event)\"></ius-button-circle-tertiary>\n </span>\n </div>\n <ius-icon-sm [iconName]=\"collapse ? 'icon-keyboard-arrow-down' : 'icon-keyboard-arrow-up'\"\n class=\"txt-pry\"></ius-icon-sm>\n </div>\n </div>\n <div class=\"ctn-collapse-card\" [ngClass]=\"{'collapsed': collapse}\">\n <ius-simple-divider></ius-simple-divider>\n <div class=\"ctn-clp\">\n <div class=\"ctn-info-clp\">\n @for (act of actuaciones; track $index) {\n <div class=\"text-info\">\n <div class=\"row-text-1 body-sm txt-ter\">\n @if (act.fechaIniciaTermino) {\n <span>Inicia t\u00E9rmino: {{act.fechaIniciaTermino | date: 'd MMM y'}}</span>\n } @else {\n <span>Fecha registro: {{act.fechaActuacion | date: 'd MMM y'}}</span>\n }\n @if (act.fechaFinalizaTermino) {\n <span>-</span>\n <span>Finaliza t\u00E9rmino: {{act.fechaFinalizaTermino | date: 'd MMM y'}}</span>\n }\n </div>\n <span class=\"label-base txt-ter\">{{act.actuacion}}</span>\n <span class=\"body-base-1 txt-sec\">{{act.anotacion}}</span>\n </div>\n }\n </div>\n <div class=\"buttons-clp\">\n @if (hasNotificacion) {\n <ius-button-menu-link iconName=\"icon-notificacion\" iconColor=\"#184FDB\"\n iusPopoverContent=\"Ver notificaci\u00F3n\"\n (buttonClicked)=\"clickButtonNotificacion($event)\"></ius-button-menu-link>\n <ius-simple-divider></ius-simple-divider>\n }\n @if (hasAuto) {\n <ius-button-menu-link iconName=\"icon-docs\" iconColor=\"#184FDB\" iusPopoverContent=\"Ver auto\"\n (buttonClicked)=\"clickButtonAuto($event)\"></ius-button-menu-link>\n <ius-simple-divider></ius-simple-divider>\n }\n </div>\n </div>\n </div>\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.ctn-gnrl{position:relative;display:flex;flex-direction:column;cursor:pointer;padding:8px 12px;box-sizing:border-box;border-radius:4px;border:1px solid #eaeaea}.ctn-gnrl:hover{border:1px solid #C4DFFF;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ctn-gnrl:hover .fecha{display:none;pointer-events:none}.ctn-gnrl:hover .buttons-hove{display:flex;pointer-events:auto}.ctn-card{position:relative;display:flex;align-items:center;gap:24px;min-height:40px;justify-content:center}.ctn-inf{display:flex;flex:1 0 0;align-items:center;gap:16px}.title-no-read{font-weight:500}.icon-account{color:#8c8c8c}.priority-tx{color:#497610}.info{display:flex;flex:1 0 0;flex-direction:column;align-items:flex-start}.ctn-icons{display:flex;align-items:center;gap:16px}.icon-dot{display:flex;align-items:center;width:8px;height:8px;aspect-ratio:1/1;background-color:#2167ff;border-radius:100px}.icon-dot-f{background-color:transparent}.fecha{width:76px}.buttons-hove{display:none;pointer-events:none;gap:4px;width:76px}.ctn-collapse-card{max-height:1000px;overflow:hidden;transition:max-height .3s ease-in-out}.ctn-collapse-card.collapsed{max-height:0px}.ctn-clp{display:flex;gap:8px}.buttons-clp{display:flex;padding:4px;flex-direction:column;gap:4px}.ctn-info-clp{display:flex;padding:4px 8px;flex-direction:column;gap:12px;flex:1 0 0}.text-info{display:flex;flex-direction:column;align-items:flex-start;flex:1 0 0}ius-simple-divider{margin:8px 0}.row-text-1{display:flex;align-items:center;gap:8px}.row-text-2{display:flex;align-items:center;gap:4px}.txt-pry{color:#333}.txt-sec{color:#595959}.txt-ter{color:#8c8c8c}\n"], dependencies: [{ kind: "component", type: IconSmComponent, selector: "ius-icon-sm", inputs: ["iconName", "color"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ButtonCircleTertiaryComponent, selector: "ius-button-circle-tertiary", inputs: ["disabled", "iconName"], outputs: ["buttonClicked"] }, { kind: "component", type: SimpleDividerComponent, selector: "ius-simple-divider" }, { kind: "component", type: ButtonMenuLinkComponent, selector: "ius-button-menu-link", inputs: ["disabled", "iconColor", "iconName"], outputs: ["buttonClicked"] }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "directive", type: PopoverDirective, selector: "[iusPopover], [iusPopoverTitle], [iusPopoverContent]", inputs: ["iusPopover", "iusPopoverTitle", "iusPopoverContent", "iusPopoverPosition", "iusPopoverOpenDelay", "iusPopoverCloseDelay"] }] }); }
|
|
6839
6909
|
}
|
|
6840
6910
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CardVigilanciaJudicialComponent, decorators: [{
|
|
6841
6911
|
type: Component,
|
|
6842
6912
|
args: [{ selector: 'ius-card-vigilancia-judicial', standalone: true, imports: [IconSmComponent, NgClass, ButtonCircleTertiaryComponent, SimpleDividerComponent, ButtonMenuLinkComponent, DatePipe, PopoverDirective], providers: [
|
|
6843
6913
|
{ provide: LOCALE_ID, useValue: 'es' },
|
|
6844
6914
|
DatePipe
|
|
6845
|
-
], template: "<div class=\"ctn-gnrl\" (click)=\"toggleCollapse()\">\
|
|
6915
|
+
], template: "<div class=\"ctn-gnrl\" (click)=\"toggleCollapse()\">\n <div class=\"ctn-card\">\n <div class=\"ctn-inf\">\n <ius-icon-sm iconName=\"icon-account-balance\" class=\"icon-account\"\n [ngClass]=\"{'priority-tx': hasNotificacion || hasAuto }\"></ius-icon-sm>\n <div class=\"info\">\n <span class=\"caption-sm txt-ter\">Vigilancia Judicial</span>\n <span class=\"body-base-1 txt-pry\" [ngClass]=\"{'title-no-read': read === false}\">{{titulo}}</span>\n <span class=\"body-base-1 txt-sec\">{{juzgado}}</span>\n </div>\n </div>\n <div class=\"ctn-icons\">\n @if (hasNotificacion || hasAuto) {\n <div class=\"row-text-1\">\n @if (hasNotificacion) {\n <ius-icon-sm iconName=\"icon-notification-2\" class=\"txt-sec\"></ius-icon-sm>\n }\n @if (hasAuto) {\n <ius-icon-sm iconName=\"icon-docs-2\" class=\"txt-sec\"></ius-icon-sm>\n }\n </div>\n }\n <div class=\"row-text-2\">\n <div class=\"icon-dot\" [ngClass]=\"{'icon-dot-f': read === true}\"></div>\n <span class=\"body-sm txt-ter fecha\">{{fechaPrincipal | date: 'd MMM y'}}</span>\n <span class=\"buttons-hove\">\n <ius-button-circle-tertiary iconName=\"icon-mark-chat-read\"\n [iusPopoverContent]=\"read ? 'Marcar como no le\u00EDdo' : 'Marcar como le\u00EDdo'\"\n (buttonClicked)=\"clickButtonRead($event)\"></ius-button-circle-tertiary>\n <ius-button-circle-tertiary iconName=\"icon-content-copy\"\n iusPopoverContent=\"Copiar informaci\u00F3n\"\n (buttonClicked)=\"clickButtonCopy($event)\"></ius-button-circle-tertiary>\n </span>\n </div>\n <ius-icon-sm [iconName]=\"collapse ? 'icon-keyboard-arrow-down' : 'icon-keyboard-arrow-up'\"\n class=\"txt-pry\"></ius-icon-sm>\n </div>\n </div>\n <div class=\"ctn-collapse-card\" [ngClass]=\"{'collapsed': collapse}\">\n <ius-simple-divider></ius-simple-divider>\n <div class=\"ctn-clp\">\n <div class=\"ctn-info-clp\">\n @for (act of actuaciones; track $index) {\n <div class=\"text-info\">\n <div class=\"row-text-1 body-sm txt-ter\">\n @if (act.fechaIniciaTermino) {\n <span>Inicia t\u00E9rmino: {{act.fechaIniciaTermino | date: 'd MMM y'}}</span>\n } @else {\n <span>Fecha registro: {{act.fechaActuacion | date: 'd MMM y'}}</span>\n }\n @if (act.fechaFinalizaTermino) {\n <span>-</span>\n <span>Finaliza t\u00E9rmino: {{act.fechaFinalizaTermino | date: 'd MMM y'}}</span>\n }\n </div>\n <span class=\"label-base txt-ter\">{{act.actuacion}}</span>\n <span class=\"body-base-1 txt-sec\">{{act.anotacion}}</span>\n </div>\n }\n </div>\n <div class=\"buttons-clp\">\n @if (hasNotificacion) {\n <ius-button-menu-link iconName=\"icon-notificacion\" iconColor=\"#184FDB\"\n iusPopoverContent=\"Ver notificaci\u00F3n\"\n (buttonClicked)=\"clickButtonNotificacion($event)\"></ius-button-menu-link>\n <ius-simple-divider></ius-simple-divider>\n }\n @if (hasAuto) {\n <ius-button-menu-link iconName=\"icon-docs\" iconColor=\"#184FDB\" iusPopoverContent=\"Ver auto\"\n (buttonClicked)=\"clickButtonAuto($event)\"></ius-button-menu-link>\n <ius-simple-divider></ius-simple-divider>\n }\n </div>\n </div>\n </div>\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.ctn-gnrl{position:relative;display:flex;flex-direction:column;cursor:pointer;padding:8px 12px;box-sizing:border-box;border-radius:4px;border:1px solid #eaeaea}.ctn-gnrl:hover{border:1px solid #C4DFFF;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ctn-gnrl:hover .fecha{display:none;pointer-events:none}.ctn-gnrl:hover .buttons-hove{display:flex;pointer-events:auto}.ctn-card{position:relative;display:flex;align-items:center;gap:24px;min-height:40px;justify-content:center}.ctn-inf{display:flex;flex:1 0 0;align-items:center;gap:16px}.title-no-read{font-weight:500}.icon-account{color:#8c8c8c}.priority-tx{color:#497610}.info{display:flex;flex:1 0 0;flex-direction:column;align-items:flex-start}.ctn-icons{display:flex;align-items:center;gap:16px}.icon-dot{display:flex;align-items:center;width:8px;height:8px;aspect-ratio:1/1;background-color:#2167ff;border-radius:100px}.icon-dot-f{background-color:transparent}.fecha{width:76px}.buttons-hove{display:none;pointer-events:none;gap:4px;width:76px}.ctn-collapse-card{max-height:1000px;overflow:hidden;transition:max-height .3s ease-in-out}.ctn-collapse-card.collapsed{max-height:0px}.ctn-clp{display:flex;gap:8px}.buttons-clp{display:flex;padding:4px;flex-direction:column;gap:4px}.ctn-info-clp{display:flex;padding:4px 8px;flex-direction:column;gap:12px;flex:1 0 0}.text-info{display:flex;flex-direction:column;align-items:flex-start;flex:1 0 0}ius-simple-divider{margin:8px 0}.row-text-1{display:flex;align-items:center;gap:8px}.row-text-2{display:flex;align-items:center;gap:4px}.txt-pry{color:#333}.txt-sec{color:#595959}.txt-ter{color:#8c8c8c}\n"] }]
|
|
6846
6916
|
}], ctorParameters: () => [{ type: i1$1.DatePipe }], propDecorators: { collapse: [{
|
|
6847
6917
|
type: Input
|
|
6848
6918
|
}], hasNotificacion: [{
|
|
@@ -7078,14 +7148,14 @@ class CardEtapaSubetapaComponent {
|
|
|
7078
7148
|
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: CardEtapaSubetapaComponent, isStandalone: true, selector: "ius-card-etapa-subetapa", inputs: { priority: "priority", hasDocuments: "hasDocuments", read: "read", collapse: "collapse", etapa: "etapa", subEtapa: "subEtapa", text1: "text1", origen: "origen", fechaPrincipal: "fechaPrincipal", descripcion: "descripcion" }, outputs: { onClickButtonCopy: "onClickButtonCopy", onClickButtonRead: "onClickButtonRead", onClickButtonEdit: "onClickButtonEdit", onClickButtonDelete: "onClickButtonDelete", onClickButtonDocs: "onClickButtonDocs" }, providers: [
|
|
7079
7149
|
{ provide: LOCALE_ID, useValue: 'es' },
|
|
7080
7150
|
DatePipe
|
|
7081
|
-
], ngImport: i0, template: "<div class=\"ctn-gnrl\" (click)=\"toggleCollapse()\">\
|
|
7151
|
+
], ngImport: i0, template: "<div class=\"ctn-gnrl\" (click)=\"toggleCollapse()\">\n <div class=\"ctn-card\">\n <div class=\"ctn-inf\">\n <ius-icon-sm iconName=\"icon-book-5\" class=\"icon-book-5\"></ius-icon-sm>\n <div class=\"info\">\n <span class=\"caption-sm txt-ter\">Etapas Procesales</span>\n <div class=\"body-base-1 row-text-1 txt-pry\" [ngClass]=\"{'title-no-read': read === false}\">\n <span>{{etapa}}</span>\n <span>-</span>\n <span>{{subEtapa}}</span>\n </div>\n <div class=\"body-base-1 txt-sec row-text-1\">\n <span>{{text1}}</span>\n @if (origen) {\n <span>-</span>\n <span>{{origen}}</span>\n }\n </div>\n </div>\n </div>\n <div class=\"ctn-icons\">\n @if (hasDocuments) {\n <div class=\"row-text-1\">\n <ius-icon-sm iconName=\"icon-attach-file\" class=\"txt-sec\"></ius-icon-sm>\n </div>\n }\n <div class=\"row-text-2\">\n <div class=\"icon-dot\" [ngClass]=\"{'icon-dot-f': read === false}\"></div>\n <span class=\"body-sm txt-ter fecha\">{{fechaPrincipal | date: 'd MMM yyyy'}}</span>\n <span class=\"buttons-hove\">\n <ius-button-circle-tertiary iconName=\"icon-mark-chat-read\"\n [iusPopoverContent]=\"read ? 'Marcar como no le\u00EDdo' : 'Marcar como le\u00EDdo'\"\n (buttonClicked)=\"clickButtonRead($event)\"></ius-button-circle-tertiary>\n <ius-button-circle-tertiary iconName=\"icon-content-copy\"\n iusPopoverContent=\"Copiar informaci\u00F3n\"\n (buttonClicked)=\"clickButtonCopy($event)\"></ius-button-circle-tertiary>\n <ius-button-circle-tertiary iconName=\"icon-edit\"\n iusPopoverContent=\"Editar\"\n (buttonClicked)=\"clickButtonEdit($event)\"></ius-button-circle-tertiary>\n <ius-button-circle-tertiary iconName=\"icon-delete\"\n iusPopoverContent=\"Eliminar\"\n (buttonClicked)=\"clickButtonDelete($event)\"></ius-button-circle-tertiary>\n </span>\n </div>\n <ius-icon-sm [iconName]=\"collapse ? 'icon-keyboard-arrow-down' : 'icon-keyboard-arrow-up'\"\n class=\"txt-pry\"></ius-icon-sm>\n </div>\n </div>\n <div class=\"ctn-collapse-card\" [ngClass]=\"{'collapsed': collapse}\">\n <ius-simple-divider></ius-simple-divider>\n <div class=\"ctn-clp\">\n <div class=\"ctn-info-clp\">\n <div class=\"text-info\">\n <span class=\"body-base-1 txt-pry\">{{descripcion}}</span>\n </div>\n </div>\n <div class=\"buttons-clp\">\n @if (hasDocuments) {\n <ius-button-menu-link iconName=\"icon-attach-file\" iconColor=\"#184FDB\"\n iusPopoverContent=\"Ver documentos\"\n (buttonClicked)=\"clickButtonDocs($event)\"></ius-button-menu-link>\n }\n </div>\n </div>\n </div>\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.ctn-gnrl{position:relative;display:flex;flex-direction:column;cursor:pointer;padding:8px 12px;box-sizing:border-box;border-radius:4px;border:1px solid #eaeaea}.ctn-gnrl:hover{border:1px solid #C4DFFF;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ctn-gnrl:hover .fecha{display:none;pointer-events:none}.ctn-gnrl:hover .buttons-hove{display:flex;pointer-events:auto}.ctn-card{position:relative;display:flex;align-items:center;gap:24px}.ctn-inf{display:flex;flex:1 0 0;align-items:center;gap:16px}.icon-book-5{color:#7caf25}.info{display:flex;flex:1 0 0;flex-direction:column;align-items:flex-start}.ctn-icons{display:flex;align-items:center;gap:16px}.icon-dot{background-color:transparent;display:none;align-items:center;width:8px;height:8px;aspect-ratio:1/1;border-radius:100px}.icon-dot-f{display:flex;background-color:#2167ff}.fecha{width:76px}.buttons-hove{display:none;pointer-events:none;gap:4px}.ctn-collapse-card{max-height:1000px;overflow:hidden;transition:max-height .3s ease-in-out}.ctn-collapse-card.collapsed{max-height:0px}.ctn-clp{display:flex;gap:8px}.buttons-clp{display:flex;padding:4px;flex-direction:column;width:44px;box-sizing:border-box;gap:4px;justify-content:center}.ctn-info-clp{display:flex;padding:4px 8px;flex-direction:column;gap:12px;flex:1 0 0}.text-info{display:flex;flex-direction:column;align-items:flex-start;flex:1 0 0}ius-simple-divider{margin:8px 0}.row-text-1{display:flex;align-items:center;gap:8px}.title-no-read{font-weight:500}.row-text-2{display:flex;align-items:center;gap:4px}.txt-pry{color:#333}.txt-sec{color:#595959}.txt-ter{color:#8c8c8c}\n"], dependencies: [{ kind: "component", type: IconSmComponent, selector: "ius-icon-sm", inputs: ["iconName", "color"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ButtonCircleTertiaryComponent, selector: "ius-button-circle-tertiary", inputs: ["disabled", "iconName"], outputs: ["buttonClicked"] }, { kind: "component", type: SimpleDividerComponent, selector: "ius-simple-divider" }, { kind: "component", type: ButtonMenuLinkComponent, selector: "ius-button-menu-link", inputs: ["disabled", "iconColor", "iconName"], outputs: ["buttonClicked"] }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "directive", type: PopoverDirective, selector: "[iusPopover], [iusPopoverTitle], [iusPopoverContent]", inputs: ["iusPopover", "iusPopoverTitle", "iusPopoverContent", "iusPopoverPosition", "iusPopoverOpenDelay", "iusPopoverCloseDelay"] }] }); }
|
|
7082
7152
|
}
|
|
7083
7153
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CardEtapaSubetapaComponent, decorators: [{
|
|
7084
7154
|
type: Component,
|
|
7085
7155
|
args: [{ selector: 'ius-card-etapa-subetapa', standalone: true, imports: [IconSmComponent, NgClass, ButtonCircleTertiaryComponent, SimpleDividerComponent, ButtonMenuLinkComponent, DatePipe, PopoverDirective], providers: [
|
|
7086
7156
|
{ provide: LOCALE_ID, useValue: 'es' },
|
|
7087
7157
|
DatePipe
|
|
7088
|
-
], template: "<div class=\"ctn-gnrl\" (click)=\"toggleCollapse()\">\
|
|
7158
|
+
], template: "<div class=\"ctn-gnrl\" (click)=\"toggleCollapse()\">\n <div class=\"ctn-card\">\n <div class=\"ctn-inf\">\n <ius-icon-sm iconName=\"icon-book-5\" class=\"icon-book-5\"></ius-icon-sm>\n <div class=\"info\">\n <span class=\"caption-sm txt-ter\">Etapas Procesales</span>\n <div class=\"body-base-1 row-text-1 txt-pry\" [ngClass]=\"{'title-no-read': read === false}\">\n <span>{{etapa}}</span>\n <span>-</span>\n <span>{{subEtapa}}</span>\n </div>\n <div class=\"body-base-1 txt-sec row-text-1\">\n <span>{{text1}}</span>\n @if (origen) {\n <span>-</span>\n <span>{{origen}}</span>\n }\n </div>\n </div>\n </div>\n <div class=\"ctn-icons\">\n @if (hasDocuments) {\n <div class=\"row-text-1\">\n <ius-icon-sm iconName=\"icon-attach-file\" class=\"txt-sec\"></ius-icon-sm>\n </div>\n }\n <div class=\"row-text-2\">\n <div class=\"icon-dot\" [ngClass]=\"{'icon-dot-f': read === false}\"></div>\n <span class=\"body-sm txt-ter fecha\">{{fechaPrincipal | date: 'd MMM yyyy'}}</span>\n <span class=\"buttons-hove\">\n <ius-button-circle-tertiary iconName=\"icon-mark-chat-read\"\n [iusPopoverContent]=\"read ? 'Marcar como no le\u00EDdo' : 'Marcar como le\u00EDdo'\"\n (buttonClicked)=\"clickButtonRead($event)\"></ius-button-circle-tertiary>\n <ius-button-circle-tertiary iconName=\"icon-content-copy\"\n iusPopoverContent=\"Copiar informaci\u00F3n\"\n (buttonClicked)=\"clickButtonCopy($event)\"></ius-button-circle-tertiary>\n <ius-button-circle-tertiary iconName=\"icon-edit\"\n iusPopoverContent=\"Editar\"\n (buttonClicked)=\"clickButtonEdit($event)\"></ius-button-circle-tertiary>\n <ius-button-circle-tertiary iconName=\"icon-delete\"\n iusPopoverContent=\"Eliminar\"\n (buttonClicked)=\"clickButtonDelete($event)\"></ius-button-circle-tertiary>\n </span>\n </div>\n <ius-icon-sm [iconName]=\"collapse ? 'icon-keyboard-arrow-down' : 'icon-keyboard-arrow-up'\"\n class=\"txt-pry\"></ius-icon-sm>\n </div>\n </div>\n <div class=\"ctn-collapse-card\" [ngClass]=\"{'collapsed': collapse}\">\n <ius-simple-divider></ius-simple-divider>\n <div class=\"ctn-clp\">\n <div class=\"ctn-info-clp\">\n <div class=\"text-info\">\n <span class=\"body-base-1 txt-pry\">{{descripcion}}</span>\n </div>\n </div>\n <div class=\"buttons-clp\">\n @if (hasDocuments) {\n <ius-button-menu-link iconName=\"icon-attach-file\" iconColor=\"#184FDB\"\n iusPopoverContent=\"Ver documentos\"\n (buttonClicked)=\"clickButtonDocs($event)\"></ius-button-menu-link>\n }\n </div>\n </div>\n </div>\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.ctn-gnrl{position:relative;display:flex;flex-direction:column;cursor:pointer;padding:8px 12px;box-sizing:border-box;border-radius:4px;border:1px solid #eaeaea}.ctn-gnrl:hover{border:1px solid #C4DFFF;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ctn-gnrl:hover .fecha{display:none;pointer-events:none}.ctn-gnrl:hover .buttons-hove{display:flex;pointer-events:auto}.ctn-card{position:relative;display:flex;align-items:center;gap:24px}.ctn-inf{display:flex;flex:1 0 0;align-items:center;gap:16px}.icon-book-5{color:#7caf25}.info{display:flex;flex:1 0 0;flex-direction:column;align-items:flex-start}.ctn-icons{display:flex;align-items:center;gap:16px}.icon-dot{background-color:transparent;display:none;align-items:center;width:8px;height:8px;aspect-ratio:1/1;border-radius:100px}.icon-dot-f{display:flex;background-color:#2167ff}.fecha{width:76px}.buttons-hove{display:none;pointer-events:none;gap:4px}.ctn-collapse-card{max-height:1000px;overflow:hidden;transition:max-height .3s ease-in-out}.ctn-collapse-card.collapsed{max-height:0px}.ctn-clp{display:flex;gap:8px}.buttons-clp{display:flex;padding:4px;flex-direction:column;width:44px;box-sizing:border-box;gap:4px;justify-content:center}.ctn-info-clp{display:flex;padding:4px 8px;flex-direction:column;gap:12px;flex:1 0 0}.text-info{display:flex;flex-direction:column;align-items:flex-start;flex:1 0 0}ius-simple-divider{margin:8px 0}.row-text-1{display:flex;align-items:center;gap:8px}.title-no-read{font-weight:500}.row-text-2{display:flex;align-items:center;gap:4px}.txt-pry{color:#333}.txt-sec{color:#595959}.txt-ter{color:#8c8c8c}\n"] }]
|
|
7089
7159
|
}], ctorParameters: () => [{ type: i1$1.DatePipe }], propDecorators: { priority: [{
|
|
7090
7160
|
type: Input
|
|
7091
7161
|
}], hasDocuments: [{
|
|
@@ -7190,14 +7260,14 @@ class CardImpulsoProcesalComponent {
|
|
|
7190
7260
|
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: CardImpulsoProcesalComponent, isStandalone: true, selector: "ius-card-impulso-procesal", inputs: { priority: "priority", hasDocuments: "hasDocuments", read: "read", collapse: "collapse", titulo: "titulo", text1: "text1", origen: "origen", fechaPrincipal: "fechaPrincipal", descripcion: "descripcion" }, outputs: { onClickButtonCopy: "onClickButtonCopy", onClickButtonRead: "onClickButtonRead", onClickButtonEdit: "onClickButtonEdit", onClickButtonDelete: "onClickButtonDelete", onClickButtonDocs: "onClickButtonDocs" }, providers: [
|
|
7191
7261
|
{ provide: LOCALE_ID, useValue: 'es' },
|
|
7192
7262
|
DatePipe
|
|
7193
|
-
], ngImport: i0, template: "<div class=\"ctn-gnrl\" (click)=\"toggleCollapse()\">\
|
|
7263
|
+
], ngImport: i0, template: "<div class=\"ctn-gnrl\" (click)=\"toggleCollapse()\">\n <div class=\"ctn-card\">\n <div class=\"ctn-inf\">\n <ius-icon-sm iconName=\"icon-article-person\" class=\"icon-article-person\"></ius-icon-sm>\n <div class=\"info\">\n <span class=\"caption-sm txt-ter\">Gesti\u00F3n - Impulso Procesal</span>\n <span class=\"body-base-1\" [ngClass]=\"{'title-no-read': read === false}\">{{titulo}}</span>\n <div class=\"body-base-1 txt-sec row-text-1\">\n <span>{{text1}}</span>\n @if (origen) {\n <span>-</span>\n <span>{{origen}}</span>\n }\n </div>\n </div>\n </div>\n <div class=\"ctn-icons\">\n @if (hasDocuments) {\n <div class=\"row-text-1\">\n <ius-icon-sm iconName=\"icon-attach-file\" class=\"txt-sec\"></ius-icon-sm>\n </div>\n }\n <div class=\"row-text-2\">\n <div class=\"icon-dot\" [ngClass]=\"{'icon-dot-f': read === false}\"></div>\n <span class=\"body-sm txt-ter fecha\">{{fechaPrincipal | date: 'd MMM yyyy'}}</span>\n <span class=\"buttons-hove\">\n <ius-button-circle-tertiary iconName=\"icon-mark-chat-read\"\n [iusPopoverContent]=\"read ? 'Marcar como no le\u00EDdo' : 'Marcar como le\u00EDdo'\"\n (buttonClicked)=\"clickButtonRead($event)\"></ius-button-circle-tertiary>\n <ius-button-circle-tertiary iconName=\"icon-content-copy\"\n iusPopoverContent=\"Copiar informaci\u00F3n\"\n (buttonClicked)=\"clickButtonCopy($event)\"></ius-button-circle-tertiary>\n <ius-button-circle-tertiary iconName=\"icon-edit\"\n iusPopoverContent=\"Editar\"\n (buttonClicked)=\"clickButtonEdit($event)\"></ius-button-circle-tertiary>\n <ius-button-circle-tertiary iconName=\"icon-delete\"\n iusPopoverContent=\"Eliminar\"\n (buttonClicked)=\"clickButtonDelete($event)\"></ius-button-circle-tertiary>\n </span>\n </div>\n <ius-icon-sm [iconName]=\"collapse ? 'icon-keyboard-arrow-down' : 'icon-keyboard-arrow-up'\"\n class=\"txt-pry\"></ius-icon-sm>\n </div>\n </div>\n <div class=\"ctn-collapse-card\" [ngClass]=\"{'collapsed': collapse}\">\n <ius-simple-divider></ius-simple-divider>\n <div class=\"ctn-clp\">\n <div class=\"ctn-info-clp\">\n <div class=\"text-info\">\n <span class=\"body-base-1 txt-pry\">{{descripcion}}</span>\n </div>\n </div>\n <div class=\"buttons-clp\">\n @if (hasDocuments) {\n <ius-button-menu-link iconName=\"icon-attach-file\" iconColor=\"#184FDB\"\n iusPopoverContent=\"Ver documentos\"\n (buttonClicked)=\"clickButtonDocs($event)\"></ius-button-menu-link>\n }\n </div>\n </div>\n </div>\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.ctn-gnrl{position:relative;display:flex;flex-direction:column;cursor:pointer;padding:8px 12px;box-sizing:border-box;border-radius:4px;border:1px solid #eaeaea}.ctn-gnrl:hover{border:1px solid #C4DFFF;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ctn-gnrl:hover .fecha{display:none;pointer-events:none}.ctn-gnrl:hover .buttons-hove{display:flex;pointer-events:auto}.ctn-card{position:relative;display:flex;align-items:center;gap:24px}.ctn-inf{display:flex;flex:1 0 0;align-items:center;gap:16px}.icon-article-person{color:#434343}.info{display:flex;flex:1 0 0;flex-direction:column;align-items:flex-start}.title-no-read{font-weight:500}.ctn-icons{display:flex;align-items:center;gap:16px}.icon-dot{background-color:transparent;display:none;align-items:center;width:8px;height:8px;aspect-ratio:1/1;border-radius:100px}.icon-dot-f{display:flex;background-color:#2167ff}.fecha{width:76px}.buttons-hove{display:none;pointer-events:none;gap:4px}.ctn-collapse-card{max-height:1000px;overflow:hidden;transition:max-height .3s ease-in-out}.ctn-collapse-card.collapsed{max-height:0px}.ctn-clp{display:flex;gap:8px}.buttons-clp{display:flex;padding:4px;flex-direction:column;width:44px;box-sizing:border-box;gap:4px;justify-content:center}.ctn-info-clp{display:flex;padding:4px 8px;flex-direction:column;gap:12px;flex:1 0 0}.text-info{display:flex;flex-direction:column;align-items:flex-start;flex:1 0 0}ius-simple-divider{margin:8px 0}.row-text-1{display:flex;align-items:center;gap:8px}.row-text-2{display:flex;align-items:center;gap:4px}.txt-pry{color:#333}.txt-sec{color:#595959}.txt-ter{color:#8c8c8c}\n"], dependencies: [{ kind: "component", type: IconSmComponent, selector: "ius-icon-sm", inputs: ["iconName", "color"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ButtonCircleTertiaryComponent, selector: "ius-button-circle-tertiary", inputs: ["disabled", "iconName"], outputs: ["buttonClicked"] }, { kind: "component", type: SimpleDividerComponent, selector: "ius-simple-divider" }, { kind: "component", type: ButtonMenuLinkComponent, selector: "ius-button-menu-link", inputs: ["disabled", "iconColor", "iconName"], outputs: ["buttonClicked"] }, { kind: "pipe", type: DatePipe, name: "date" }, { kind: "directive", type: PopoverDirective, selector: "[iusPopover], [iusPopoverTitle], [iusPopoverContent]", inputs: ["iusPopover", "iusPopoverTitle", "iusPopoverContent", "iusPopoverPosition", "iusPopoverOpenDelay", "iusPopoverCloseDelay"] }] }); }
|
|
7194
7264
|
}
|
|
7195
7265
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CardImpulsoProcesalComponent, decorators: [{
|
|
7196
7266
|
type: Component,
|
|
7197
7267
|
args: [{ selector: 'ius-card-impulso-procesal', standalone: true, imports: [IconSmComponent, NgClass, ButtonCircleTertiaryComponent, SimpleDividerComponent, ButtonMenuLinkComponent, DatePipe, PopoverDirective], providers: [
|
|
7198
7268
|
{ provide: LOCALE_ID, useValue: 'es' },
|
|
7199
7269
|
DatePipe
|
|
7200
|
-
], template: "<div class=\"ctn-gnrl\" (click)=\"toggleCollapse()\">\
|
|
7270
|
+
], template: "<div class=\"ctn-gnrl\" (click)=\"toggleCollapse()\">\n <div class=\"ctn-card\">\n <div class=\"ctn-inf\">\n <ius-icon-sm iconName=\"icon-article-person\" class=\"icon-article-person\"></ius-icon-sm>\n <div class=\"info\">\n <span class=\"caption-sm txt-ter\">Gesti\u00F3n - Impulso Procesal</span>\n <span class=\"body-base-1\" [ngClass]=\"{'title-no-read': read === false}\">{{titulo}}</span>\n <div class=\"body-base-1 txt-sec row-text-1\">\n <span>{{text1}}</span>\n @if (origen) {\n <span>-</span>\n <span>{{origen}}</span>\n }\n </div>\n </div>\n </div>\n <div class=\"ctn-icons\">\n @if (hasDocuments) {\n <div class=\"row-text-1\">\n <ius-icon-sm iconName=\"icon-attach-file\" class=\"txt-sec\"></ius-icon-sm>\n </div>\n }\n <div class=\"row-text-2\">\n <div class=\"icon-dot\" [ngClass]=\"{'icon-dot-f': read === false}\"></div>\n <span class=\"body-sm txt-ter fecha\">{{fechaPrincipal | date: 'd MMM yyyy'}}</span>\n <span class=\"buttons-hove\">\n <ius-button-circle-tertiary iconName=\"icon-mark-chat-read\"\n [iusPopoverContent]=\"read ? 'Marcar como no le\u00EDdo' : 'Marcar como le\u00EDdo'\"\n (buttonClicked)=\"clickButtonRead($event)\"></ius-button-circle-tertiary>\n <ius-button-circle-tertiary iconName=\"icon-content-copy\"\n iusPopoverContent=\"Copiar informaci\u00F3n\"\n (buttonClicked)=\"clickButtonCopy($event)\"></ius-button-circle-tertiary>\n <ius-button-circle-tertiary iconName=\"icon-edit\"\n iusPopoverContent=\"Editar\"\n (buttonClicked)=\"clickButtonEdit($event)\"></ius-button-circle-tertiary>\n <ius-button-circle-tertiary iconName=\"icon-delete\"\n iusPopoverContent=\"Eliminar\"\n (buttonClicked)=\"clickButtonDelete($event)\"></ius-button-circle-tertiary>\n </span>\n </div>\n <ius-icon-sm [iconName]=\"collapse ? 'icon-keyboard-arrow-down' : 'icon-keyboard-arrow-up'\"\n class=\"txt-pry\"></ius-icon-sm>\n </div>\n </div>\n <div class=\"ctn-collapse-card\" [ngClass]=\"{'collapsed': collapse}\">\n <ius-simple-divider></ius-simple-divider>\n <div class=\"ctn-clp\">\n <div class=\"ctn-info-clp\">\n <div class=\"text-info\">\n <span class=\"body-base-1 txt-pry\">{{descripcion}}</span>\n </div>\n </div>\n <div class=\"buttons-clp\">\n @if (hasDocuments) {\n <ius-button-menu-link iconName=\"icon-attach-file\" iconColor=\"#184FDB\"\n iusPopoverContent=\"Ver documentos\"\n (buttonClicked)=\"clickButtonDocs($event)\"></ius-button-menu-link>\n }\n </div>\n </div>\n </div>\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.ctn-gnrl{position:relative;display:flex;flex-direction:column;cursor:pointer;padding:8px 12px;box-sizing:border-box;border-radius:4px;border:1px solid #eaeaea}.ctn-gnrl:hover{border:1px solid #C4DFFF;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ctn-gnrl:hover .fecha{display:none;pointer-events:none}.ctn-gnrl:hover .buttons-hove{display:flex;pointer-events:auto}.ctn-card{position:relative;display:flex;align-items:center;gap:24px}.ctn-inf{display:flex;flex:1 0 0;align-items:center;gap:16px}.icon-article-person{color:#434343}.info{display:flex;flex:1 0 0;flex-direction:column;align-items:flex-start}.title-no-read{font-weight:500}.ctn-icons{display:flex;align-items:center;gap:16px}.icon-dot{background-color:transparent;display:none;align-items:center;width:8px;height:8px;aspect-ratio:1/1;border-radius:100px}.icon-dot-f{display:flex;background-color:#2167ff}.fecha{width:76px}.buttons-hove{display:none;pointer-events:none;gap:4px}.ctn-collapse-card{max-height:1000px;overflow:hidden;transition:max-height .3s ease-in-out}.ctn-collapse-card.collapsed{max-height:0px}.ctn-clp{display:flex;gap:8px}.buttons-clp{display:flex;padding:4px;flex-direction:column;width:44px;box-sizing:border-box;gap:4px;justify-content:center}.ctn-info-clp{display:flex;padding:4px 8px;flex-direction:column;gap:12px;flex:1 0 0}.text-info{display:flex;flex-direction:column;align-items:flex-start;flex:1 0 0}ius-simple-divider{margin:8px 0}.row-text-1{display:flex;align-items:center;gap:8px}.row-text-2{display:flex;align-items:center;gap:4px}.txt-pry{color:#333}.txt-sec{color:#595959}.txt-ter{color:#8c8c8c}\n"] }]
|
|
7201
7271
|
}], ctorParameters: () => [{ type: i1$1.DatePipe }], propDecorators: { priority: [{
|
|
7202
7272
|
type: Input
|
|
7203
7273
|
}], hasDocuments: [{
|
|
@@ -7645,7 +7715,7 @@ class CreateTicketComponent {
|
|
|
7645
7715
|
});
|
|
7646
7716
|
}
|
|
7647
7717
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CreateTicketComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7648
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: CreateTicketComponent, isStandalone: true, selector: "ius-create-ticket", inputs: { tipos: "tipos", razones: "razones", loading: "loading", lastResult: "lastResult" }, outputs: { submitTicket: "submitTicket", closeForm: "closeForm" }, ngImport: i0, template: "<ius-drawer-container-right [titleDrawer]=\"'Crear Ticket'\" (onDrawerClosed)=\"onClose()\"\
|
|
7718
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: CreateTicketComponent, isStandalone: true, selector: "ius-create-ticket", inputs: { tipos: "tipos", razones: "razones", loading: "loading", lastResult: "lastResult" }, outputs: { submitTicket: "submitTicket", closeForm: "closeForm" }, ngImport: i0, template: "<ius-drawer-container-right [titleDrawer]=\"'Crear Ticket'\" (onDrawerClosed)=\"onClose()\"\n [percentProgressBar]=\"percentProgressBar\">\n <div class=\"form between-xs\">\n <div class=\"content\">\n <ius-section-collapse-drawer-parent textTitle=\"Informaci\u00F3n general\" [disabled]=\"false\"\n [isActive]=\"isExpandGeneralInformation\" (buttonClicked)=\"onExpandGeneralInformation()\">\n <div class=\"section\">\n <div class=\"select\">\n <ius-input-select componentId=\"ticketType\" [required]=\"true\" [showHelpText]=\"true\" labelSuperior=\"Tipo de ticket\"\n labelInput=\"Selecciona una opci\u00F3n\" [textInput]=\"typeSelected?.tipo\">\n @for (type of tipos; track type) {\n <ius-option (optionClick)=\"onSetValueType(type)\">\n {{ type.tipo }}\n </ius-option>\n }\n </ius-input-select>\n </div>\n <div class=\"select\">\n <ius-input-select componentId=\"ticketReason\" [required]=\"true\" [showHelpText]=\"true\" labelSuperior=\"Raz\u00F3n del ticket\"\n labelInput=\"Selecciona una opci\u00F3n\" [textInput]=\"reasonSelected?.razon\">\n @for (reason of razones; track reason) {\n <ius-option (optionClick)=\"onSetValueReason(reason)\">\n {{ reason.razon }}\n </ius-option>\n }\n </ius-input-select>\n </div>\n <div class=\"select\">\n <ius-input-textfield componentId=\"tituloTicket\" [initialText]=\"tituloTicket\" [required]=\"true\" [showHelpText]=\"true\"\n labelSuperior=\"Titulo o asunto para el ticket\" labelInput=\"Defina brevemente un asunto o titulo\"\n (onChangesValueEvent)=\"onSetValueTituloTicket($event)\">\n </ius-input-textfield>\n </div>\n <div class=\"select\">\n <ius-input-large componentId=\"descripcionTicket\" [initialText]=\"descripcionTicket\" [required]=\"true\" [showHelpText]=\"true\"\n labelSuperior=\"Descripcion del ticket\" labelInput=\"Describe tu idea o petici\u00F3n para el ticket\"\n (onChangesValueEvent)=\"onSetValueDescripcionTicket($event)\">\n </ius-input-large>\n </div>\n </div>\n </ius-section-collapse-drawer-parent>\n </div>\n\n <div class=\"footer\">\n <div class=\"toolbar\">\n <div class=\"toolbar-btn\">\n <ius-button-dynamic [labelDefault]=\"'Crear ticket'\" [labelSuccess]=\"'Agregando'\" [labelError]=\"'Error'\"\n [loading]=\"loading\" [result]=\"lastResult\" (buttonClicked)=\"createTicket()\">\n </ius-button-dynamic>\n </div>\n <div class=\"toolbar-btn\">\n <ius-button-standard-secondary (buttonClicked)=\"onClose()\">Cancelar</ius-button-standard-secondary>\n </div>\n </div>\n </div>\n </div>\n</ius-drawer-container-right>\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.form{display:flex;height:100%;flex-direction:column}.section{display:flex;padding:0 8px;flex-direction:column}.content{display:flex;flex-direction:column}.select{display:flex;padding:8px 16px;flex-direction:column;justify-content:center;gap:8px;align-self:stretch}.footer{display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:10px;flex:1 0 0;align-self:stretch}.toolbar{display:flex;padding:12px 16px;flex-direction:column;justify-content:flex-end;align-items:center;gap:8px;align-self:stretch}.toolbar-btn{width:100%}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ButtonDynamicComponent, selector: "ius-button-dynamic", inputs: ["labelDefault", "labelSuccess", "labelError", "disabled", "loading", "result", "autoReset", "autoResetDelay"], outputs: ["buttonClicked"] }, { kind: "component", type: ButtonStandardSecondaryComponent, selector: "ius-button-standard-secondary", inputs: ["disabled"], outputs: ["buttonClicked"] }, { kind: "component", type: DrawerContainerRightComponent, selector: "ius-drawer-container-right", inputs: ["titleDrawer", "percentProgressBar"], outputs: ["onPressedBackEvent", "onDrawerClosed"] }, { kind: "component", type: SectionCollapseDrawerParentComponent, selector: "ius-section-collapse-drawer-parent", inputs: ["isActive", "disabled", "textTitle", "iconName"], outputs: ["buttonClicked"] }, { kind: "component", type: InputSelectComponent, selector: "ius-input-select", inputs: ["componentId", "required", "disabled", "showHelpText", "error", "labelSuperior", "labelInferior", "errorText", "labelInput", "iconInput", "textInput", "maxlenght", "inputType"], outputs: ["onChangesValueEvent", "onEnterKey", "onBlurEvent"] }, { kind: "component", type: InputTextfieldComponent, selector: "ius-input-textfield", inputs: ["textInput", "required", "disabled", "isEnableClearText", "showHelpText", "error", "labelSuperior", "labelInferior", "errorText", "labelInput", "iconInput", "inputType", "maxlenght", "initialText"], outputs: ["onChangesValueEvent", "onEnterKey", "onBlurEvent"] }, { kind: "component", type: OptionComponent, selector: "ius-option", inputs: ["disabled", "checked"], outputs: ["optionClick"] }, { kind: "component", type: InputLargeComponent, selector: "ius-input-large", inputs: ["textInput", "required", "disabled", "showHelpText", "rows", "labelSuperior", "labelInferior", "labelInput", "maxlenght", "initialText"], outputs: ["onChangesValueEvent", "onEnterKey"] }] }); }
|
|
7649
7719
|
}
|
|
7650
7720
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: CreateTicketComponent, decorators: [{
|
|
7651
7721
|
type: Component,
|
|
@@ -7659,7 +7729,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
7659
7729
|
InputTextfieldComponent,
|
|
7660
7730
|
OptionComponent,
|
|
7661
7731
|
InputLargeComponent,
|
|
7662
|
-
], template: "<ius-drawer-container-right [titleDrawer]=\"'Crear Ticket'\" (onDrawerClosed)=\"onClose()\"\
|
|
7732
|
+
], template: "<ius-drawer-container-right [titleDrawer]=\"'Crear Ticket'\" (onDrawerClosed)=\"onClose()\"\n [percentProgressBar]=\"percentProgressBar\">\n <div class=\"form between-xs\">\n <div class=\"content\">\n <ius-section-collapse-drawer-parent textTitle=\"Informaci\u00F3n general\" [disabled]=\"false\"\n [isActive]=\"isExpandGeneralInformation\" (buttonClicked)=\"onExpandGeneralInformation()\">\n <div class=\"section\">\n <div class=\"select\">\n <ius-input-select componentId=\"ticketType\" [required]=\"true\" [showHelpText]=\"true\" labelSuperior=\"Tipo de ticket\"\n labelInput=\"Selecciona una opci\u00F3n\" [textInput]=\"typeSelected?.tipo\">\n @for (type of tipos; track type) {\n <ius-option (optionClick)=\"onSetValueType(type)\">\n {{ type.tipo }}\n </ius-option>\n }\n </ius-input-select>\n </div>\n <div class=\"select\">\n <ius-input-select componentId=\"ticketReason\" [required]=\"true\" [showHelpText]=\"true\" labelSuperior=\"Raz\u00F3n del ticket\"\n labelInput=\"Selecciona una opci\u00F3n\" [textInput]=\"reasonSelected?.razon\">\n @for (reason of razones; track reason) {\n <ius-option (optionClick)=\"onSetValueReason(reason)\">\n {{ reason.razon }}\n </ius-option>\n }\n </ius-input-select>\n </div>\n <div class=\"select\">\n <ius-input-textfield componentId=\"tituloTicket\" [initialText]=\"tituloTicket\" [required]=\"true\" [showHelpText]=\"true\"\n labelSuperior=\"Titulo o asunto para el ticket\" labelInput=\"Defina brevemente un asunto o titulo\"\n (onChangesValueEvent)=\"onSetValueTituloTicket($event)\">\n </ius-input-textfield>\n </div>\n <div class=\"select\">\n <ius-input-large componentId=\"descripcionTicket\" [initialText]=\"descripcionTicket\" [required]=\"true\" [showHelpText]=\"true\"\n labelSuperior=\"Descripcion del ticket\" labelInput=\"Describe tu idea o petici\u00F3n para el ticket\"\n (onChangesValueEvent)=\"onSetValueDescripcionTicket($event)\">\n </ius-input-large>\n </div>\n </div>\n </ius-section-collapse-drawer-parent>\n </div>\n\n <div class=\"footer\">\n <div class=\"toolbar\">\n <div class=\"toolbar-btn\">\n <ius-button-dynamic [labelDefault]=\"'Crear ticket'\" [labelSuccess]=\"'Agregando'\" [labelError]=\"'Error'\"\n [loading]=\"loading\" [result]=\"lastResult\" (buttonClicked)=\"createTicket()\">\n </ius-button-dynamic>\n </div>\n <div class=\"toolbar-btn\">\n <ius-button-standard-secondary (buttonClicked)=\"onClose()\">Cancelar</ius-button-standard-secondary>\n </div>\n </div>\n </div>\n </div>\n</ius-drawer-container-right>\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.form{display:flex;height:100%;flex-direction:column}.section{display:flex;padding:0 8px;flex-direction:column}.content{display:flex;flex-direction:column}.select{display:flex;padding:8px 16px;flex-direction:column;justify-content:center;gap:8px;align-self:stretch}.footer{display:flex;flex-direction:column;justify-content:flex-end;align-items:center;gap:10px;flex:1 0 0;align-self:stretch}.toolbar{display:flex;padding:12px 16px;flex-direction:column;justify-content:flex-end;align-items:center;gap:8px;align-self:stretch}.toolbar-btn{width:100%}\n"] }]
|
|
7663
7733
|
}], propDecorators: { tipos: [{
|
|
7664
7734
|
type: Input
|
|
7665
7735
|
}], razones: [{
|
|
@@ -7674,70 +7744,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
7674
7744
|
type: Output
|
|
7675
7745
|
}] } });
|
|
7676
7746
|
|
|
7677
|
-
class AvatarV2Component {
|
|
7678
|
-
constructor() {
|
|
7679
|
-
this.size = 'md';
|
|
7680
|
-
this.shape = 'circle';
|
|
7681
|
-
this.showEditButton = false;
|
|
7682
|
-
this.fallbackIconName = 'icon-account-circle';
|
|
7683
|
-
this.editClicked = new EventEmitter();
|
|
7684
|
-
this.initials = '';
|
|
7685
|
-
}
|
|
7686
|
-
get containerStyle() {
|
|
7687
|
-
if (!this.imageUrl && this.backgroundColor) {
|
|
7688
|
-
return { 'background-color': this.backgroundColor };
|
|
7689
|
-
}
|
|
7690
|
-
return {};
|
|
7691
|
-
}
|
|
7692
|
-
ngOnChanges(changes) {
|
|
7693
|
-
if (changes['name']) {
|
|
7694
|
-
this.initials = this.extractInitials(this.name);
|
|
7695
|
-
}
|
|
7696
|
-
}
|
|
7697
|
-
onEditClick(event) {
|
|
7698
|
-
event.stopPropagation();
|
|
7699
|
-
this.editClicked.emit();
|
|
7700
|
-
}
|
|
7701
|
-
extractInitials(name) {
|
|
7702
|
-
if (!name?.trim())
|
|
7703
|
-
return '';
|
|
7704
|
-
const parts = name.trim().split(/\s+/);
|
|
7705
|
-
if (parts.length === 1)
|
|
7706
|
-
return parts[0].charAt(0).toUpperCase();
|
|
7707
|
-
return (parts[0].charAt(0) + parts[parts.length - 1].charAt(0)).toUpperCase();
|
|
7708
|
-
}
|
|
7709
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AvatarV2Component, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7710
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: AvatarV2Component, isStandalone: true, selector: "ius-avatar-v2", inputs: { imageUrl: "imageUrl", name: "name", size: "size", shape: "shape", showEditButton: "showEditButton", backgroundColor: "backgroundColor", fallbackIconName: "fallbackIconName" }, outputs: { editClicked: "editClicked" }, usesOnChanges: true, ngImport: i0, template: "<div\n class=\"avatar\"\n [ngClass]=\"[size, shape]\"\n [ngStyle]=\"containerStyle\"\n>\n @if (imageUrl) {\n <img [src]=\"imageUrl\" [alt]=\"name || 'avatar'\" class=\"avatar__image\" />\n } @else if (initials) {\n <span class=\"body-large\" style=\"color: var(--ColorText-colorTextPrimary, #333);\">{{ initials }}</span>\n } @else {\n @switch (size) {\n @case ('xs') {\n <ius-icon-xs [iconName]=\"fallbackIconName\"></ius-icon-xs>\n }\n @case ('sm') {\n <ius-icon-sm [iconName]=\"fallbackIconName\"></ius-icon-sm>\n }\n @case ('md') {\n <ius-icon-md [iconName]=\"fallbackIconName\"></ius-icon-md>\n }\n @case ('lg') {\n <ius-icon-lg [iconName]=\"fallbackIconName\"></ius-icon-lg>\n }\n @case ('xl') {\n <ius-icon-xl [iconName]=\"fallbackIconName\"></ius-icon-xl>\n }\n @case ('xxl') {\n <ius-icon-xxl [iconName]=\"fallbackIconName\"></ius-icon-xxl>\n }\n }\n }\n\n @if (showEditButton) {\n <div class=\"avatar__edit-overlay\" (click)=\"onEditClick($event)\">\n <div class=\"avatar__edit-btn\">\n <ius-icon-sm iconName=\"icon-edit\"></ius-icon-sm>\n </div>\n </div>\n }\n</div>\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}:host{display:inline-block}.avatar{position:relative;display:flex;justify-content:center;align-items:center;background-color:#e6fdff;overflow:hidden;flex-shrink:0}.avatar.circle{border-radius:50%}.avatar.square{border-radius:8px}.avatar.xs{width:14px;height:14px}.avatar.sm{width:24px;height:24px}.avatar.md{width:32px;height:32px}.avatar.lg{width:40px;height:40px}.avatar.xl{width:64px;height:64px}.avatar.xxl{width:96px;height:96px}.avatar__image{width:100%;height:100%;object-fit:cover;display:block}.avatar__edit-overlay{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;background-color:var(--Info-Color-Info-200, #C4DFFF);opacity:0;transition:opacity .2s ease;cursor:pointer}.avatar__edit-btn{display:flex;justify-content:center;align-items:center;width:28px;height:28px;border-radius:50%;background-color:#fff;color:#333;pointer-events:none}.avatar:hover .avatar__edit-overlay{opacity:1}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: IconXsComponent, selector: "ius-icon-xs", inputs: ["iconName", "color"] }, { kind: "component", type: IconSmComponent, selector: "ius-icon-sm", inputs: ["iconName", "color"] }, { kind: "component", type: IconMdComponent, selector: "ius-icon-md", inputs: ["iconName", "color"] }, { kind: "component", type: IconXlComponent, selector: "ius-icon-xl", inputs: ["iconName", "color"] }, { kind: "component", type: IconXxlComponent, selector: "ius-icon-xxl", inputs: ["iconName", "color"] }, { kind: "component", type: IconLgComponent, selector: "ius-icon-lg", inputs: ["iconName", "color"] }] }); }
|
|
7711
|
-
}
|
|
7712
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AvatarV2Component, decorators: [{
|
|
7713
|
-
type: Component,
|
|
7714
|
-
args: [{ selector: 'ius-avatar-v2', standalone: true, imports: [
|
|
7715
|
-
CommonModule,
|
|
7716
|
-
IconXsComponent,
|
|
7717
|
-
IconSmComponent,
|
|
7718
|
-
IconMdComponent,
|
|
7719
|
-
IconXlComponent,
|
|
7720
|
-
IconXxlComponent,
|
|
7721
|
-
IconLgComponent
|
|
7722
|
-
], template: "<div\n class=\"avatar\"\n [ngClass]=\"[size, shape]\"\n [ngStyle]=\"containerStyle\"\n>\n @if (imageUrl) {\n <img [src]=\"imageUrl\" [alt]=\"name || 'avatar'\" class=\"avatar__image\" />\n } @else if (initials) {\n <span class=\"body-large\" style=\"color: var(--ColorText-colorTextPrimary, #333);\">{{ initials }}</span>\n } @else {\n @switch (size) {\n @case ('xs') {\n <ius-icon-xs [iconName]=\"fallbackIconName\"></ius-icon-xs>\n }\n @case ('sm') {\n <ius-icon-sm [iconName]=\"fallbackIconName\"></ius-icon-sm>\n }\n @case ('md') {\n <ius-icon-md [iconName]=\"fallbackIconName\"></ius-icon-md>\n }\n @case ('lg') {\n <ius-icon-lg [iconName]=\"fallbackIconName\"></ius-icon-lg>\n }\n @case ('xl') {\n <ius-icon-xl [iconName]=\"fallbackIconName\"></ius-icon-xl>\n }\n @case ('xxl') {\n <ius-icon-xxl [iconName]=\"fallbackIconName\"></ius-icon-xxl>\n }\n }\n }\n\n @if (showEditButton) {\n <div class=\"avatar__edit-overlay\" (click)=\"onEditClick($event)\">\n <div class=\"avatar__edit-btn\">\n <ius-icon-sm iconName=\"icon-edit\"></ius-icon-sm>\n </div>\n </div>\n }\n</div>\n", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}:host{display:inline-block}.avatar{position:relative;display:flex;justify-content:center;align-items:center;background-color:#e6fdff;overflow:hidden;flex-shrink:0}.avatar.circle{border-radius:50%}.avatar.square{border-radius:8px}.avatar.xs{width:14px;height:14px}.avatar.sm{width:24px;height:24px}.avatar.md{width:32px;height:32px}.avatar.lg{width:40px;height:40px}.avatar.xl{width:64px;height:64px}.avatar.xxl{width:96px;height:96px}.avatar__image{width:100%;height:100%;object-fit:cover;display:block}.avatar__edit-overlay{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;background-color:var(--Info-Color-Info-200, #C4DFFF);opacity:0;transition:opacity .2s ease;cursor:pointer}.avatar__edit-btn{display:flex;justify-content:center;align-items:center;width:28px;height:28px;border-radius:50%;background-color:#fff;color:#333;pointer-events:none}.avatar:hover .avatar__edit-overlay{opacity:1}\n"] }]
|
|
7723
|
-
}], propDecorators: { imageUrl: [{
|
|
7724
|
-
type: Input
|
|
7725
|
-
}], name: [{
|
|
7726
|
-
type: Input
|
|
7727
|
-
}], size: [{
|
|
7728
|
-
type: Input
|
|
7729
|
-
}], shape: [{
|
|
7730
|
-
type: Input
|
|
7731
|
-
}], showEditButton: [{
|
|
7732
|
-
type: Input
|
|
7733
|
-
}], backgroundColor: [{
|
|
7734
|
-
type: Input
|
|
7735
|
-
}], fallbackIconName: [{
|
|
7736
|
-
type: Input
|
|
7737
|
-
}], editClicked: [{
|
|
7738
|
-
type: Output
|
|
7739
|
-
}] } });
|
|
7740
|
-
|
|
7741
7747
|
class AvatarBusinessComponent {
|
|
7742
7748
|
constructor() {
|
|
7743
7749
|
this.size = 'md';
|
|
@@ -7751,7 +7757,7 @@ class AvatarBusinessComponent {
|
|
|
7751
7757
|
this.editClicked.emit();
|
|
7752
7758
|
}
|
|
7753
7759
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AvatarBusinessComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7754
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: AvatarBusinessComponent, isStandalone: true, selector: "ius-avatar-business", inputs: { imageUrl: "imageUrl", label: "label", size: "size", shape: "shape", showEditButton: "showEditButton", fallbackIconName: "fallbackIconName" }, outputs: { editClicked: "editClicked" }, ngImport: i0, template: "<div\n class=\"avatar-business\"\n [ngClass]=\"[size, shape]\"\n>\n @if (imageUrl) {\n <img [src]=\"imageUrl\" [alt]=\"label || 'avatar'\" class=\"avatar-business__image\" />\n } @else if (label) {\n <span class=\"body-large avatar-business__label\">{{ label }}</span>\n } @else {\n @switch (size) {\n @case ('xs') {\n <ius-icon-xs class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-xs>\n }\n @case ('sm') {\n <ius-icon-sm class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-sm>\n }\n @case ('md') {\n <ius-icon-md class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-md>\n }\n @case ('lg') {\n <ius-icon-lg class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-lg>\n }\n @case ('xl') {\n <ius-icon-xl class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-xl>\n }\n @case ('xxl') {\n <ius-icon-xxl class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-xxl>\n }\n }\n }\n\n @if (showEditButton) {\n <div class=\"avatar-business__edit-overlay\" (click)=\"onEditClick($event)\">\n <div class=\"avatar-business__edit-btn\">\n <ius-icon-sm iconName=\"icon-edit\"></ius-icon-sm>\n </div>\n </div>\n }\n</div>\n", styles: [":host{display:inline-block}.avatar-business{position:relative;display:flex;justify-content:center;align-items:center;background-color:#edf6ff;overflow:hidden;flex-shrink:0}.avatar-business.circle{border-radius:50%}.avatar-business.square{border-radius:8px}.avatar-business.xs{width:14px;height:14px}.avatar-business.sm{width:24px;height:24px}.avatar-business.md{width:32px;height:32px}.avatar-business.lg{width:40px;height:40px}.avatar-business.xl{width:64px;height:64px}.avatar-business.xxl{width:96px;height:96px}.avatar-business__image{width:100%;height:100%;object-fit:cover;display:block}.avatar-business__label{color:var(--ColorText-colorTextPrimary, #333);-webkit-user-select:none;user-select:none}.avatar-business__edit-overlay{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;background-color:#f5f5f5;border:.5px solid var(--Stroke, #EAEAEA);opacity:0;transition:opacity .2s ease;cursor:pointer}.avatar-business__edit-overlay:active{background-color:#fafafa}.avatar-business__edit-btn{display:flex;justify-content:center;align-items:center;width:38px;height:38px;border-radius:50%;background-color:#fff;color:#333;pointer-events:none}.avatar-business:hover .avatar-business__edit-overlay{opacity:1}.icon{color:#c4dfff}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: IconXsComponent, selector: "ius-icon-xs", inputs: ["iconName", "color"] }, { kind: "component", type: IconSmComponent, selector: "ius-icon-sm", inputs: ["iconName", "color"] }, { kind: "component", type: IconMdComponent, selector: "ius-icon-md", inputs: ["iconName", "color"] }, { kind: "component", type: IconLgComponent, selector: "ius-icon-lg", inputs: ["iconName", "color"] }, { kind: "component", type: IconXlComponent, selector: "ius-icon-xl", inputs: ["iconName", "color"] }, { kind: "component", type: IconXxlComponent, selector: "ius-icon-xxl", inputs: ["iconName", "color"] }] }); }
|
|
7760
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: AvatarBusinessComponent, isStandalone: true, selector: "ius-avatar-business", inputs: { imageUrl: "imageUrl", label: "label", size: "size", shape: "shape", showEditButton: "showEditButton", fallbackIconName: "fallbackIconName" }, outputs: { editClicked: "editClicked" }, ngImport: i0, template: "<div\r\n class=\"avatar-business\"\r\n [ngClass]=\"[size, shape]\"\r\n>\r\n @if (imageUrl) {\r\n <img [src]=\"imageUrl\" [alt]=\"label || 'avatar'\" class=\"avatar-business__image\" />\r\n } @else if (label) {\r\n <span class=\"body-large avatar-business__label\">{{ label }}</span>\r\n } @else {\r\n @switch (size) {\r\n @case ('xs') {\r\n <ius-icon-xs class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-xs>\r\n }\r\n @case ('sm') {\r\n <ius-icon-sm class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-sm>\r\n }\r\n @case ('md') {\r\n <ius-icon-md class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-md>\r\n }\r\n @case ('lg') {\r\n <ius-icon-lg class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-lg>\r\n }\r\n @case ('xl') {\r\n <ius-icon-xl class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-xl>\r\n }\r\n @case ('xxl') {\r\n <ius-icon-xxl class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-xxl>\r\n }\r\n }\r\n }\r\n\r\n @if (showEditButton) {\r\n <div class=\"avatar-business__edit-overlay\" (click)=\"onEditClick($event)\">\r\n <div class=\"avatar-business__edit-btn\">\r\n <ius-icon-sm iconName=\"icon-edit\"></ius-icon-sm>\r\n </div>\r\n </div>\r\n }\r\n</div>\r\n", styles: [":host{display:inline-block}.avatar-business{position:relative;display:flex;justify-content:center;align-items:center;background-color:#edf6ff;overflow:hidden;flex-shrink:0}.avatar-business.circle{border-radius:50%}.avatar-business.square{border-radius:8px}.avatar-business.xs{width:14px;height:14px}.avatar-business.sm{width:24px;height:24px}.avatar-business.md{width:32px;height:32px}.avatar-business.lg{width:40px;height:40px}.avatar-business.xl{width:64px;height:64px}.avatar-business.xxl{width:96px;height:96px}.avatar-business__image{width:100%;height:100%;object-fit:cover;display:block}.avatar-business__label{color:var(--ColorText-colorTextPrimary, #333);-webkit-user-select:none;user-select:none}.avatar-business__edit-overlay{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;background-color:#f5f5f5;border:.5px solid var(--Stroke, #EAEAEA);opacity:0;transition:opacity .2s ease;cursor:pointer}.avatar-business__edit-overlay:active{background-color:#fafafa}.avatar-business__edit-btn{display:flex;justify-content:center;align-items:center;width:38px;height:38px;border-radius:50%;background-color:#fff;color:#333;pointer-events:none}.avatar-business:hover .avatar-business__edit-overlay{opacity:1}.icon{color:#c4dfff}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: IconXsComponent, selector: "ius-icon-xs", inputs: ["iconName", "color"] }, { kind: "component", type: IconSmComponent, selector: "ius-icon-sm", inputs: ["iconName", "color"] }, { kind: "component", type: IconMdComponent, selector: "ius-icon-md", inputs: ["iconName", "color"] }, { kind: "component", type: IconLgComponent, selector: "ius-icon-lg", inputs: ["iconName", "color"] }, { kind: "component", type: IconXlComponent, selector: "ius-icon-xl", inputs: ["iconName", "color"] }, { kind: "component", type: IconXxlComponent, selector: "ius-icon-xxl", inputs: ["iconName", "color"] }] }); }
|
|
7755
7761
|
}
|
|
7756
7762
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AvatarBusinessComponent, decorators: [{
|
|
7757
7763
|
type: Component,
|
|
@@ -7763,7 +7769,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
7763
7769
|
IconLgComponent,
|
|
7764
7770
|
IconXlComponent,
|
|
7765
7771
|
IconXxlComponent,
|
|
7766
|
-
], template: "<div\n class=\"avatar-business\"\n [ngClass]=\"[size, shape]\"\n>\n @if (imageUrl) {\n <img [src]=\"imageUrl\" [alt]=\"label || 'avatar'\" class=\"avatar-business__image\" />\n } @else if (label) {\n <span class=\"body-large avatar-business__label\">{{ label }}</span>\n } @else {\n @switch (size) {\n @case ('xs') {\n <ius-icon-xs class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-xs>\n }\n @case ('sm') {\n <ius-icon-sm class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-sm>\n }\n @case ('md') {\n <ius-icon-md class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-md>\n }\n @case ('lg') {\n <ius-icon-lg class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-lg>\n }\n @case ('xl') {\n <ius-icon-xl class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-xl>\n }\n @case ('xxl') {\n <ius-icon-xxl class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-xxl>\n }\n }\n }\n\n @if (showEditButton) {\n <div class=\"avatar-business__edit-overlay\" (click)=\"onEditClick($event)\">\n <div class=\"avatar-business__edit-btn\">\n <ius-icon-sm iconName=\"icon-edit\"></ius-icon-sm>\n </div>\n </div>\n }\n</div>\n", styles: [":host{display:inline-block}.avatar-business{position:relative;display:flex;justify-content:center;align-items:center;background-color:#edf6ff;overflow:hidden;flex-shrink:0}.avatar-business.circle{border-radius:50%}.avatar-business.square{border-radius:8px}.avatar-business.xs{width:14px;height:14px}.avatar-business.sm{width:24px;height:24px}.avatar-business.md{width:32px;height:32px}.avatar-business.lg{width:40px;height:40px}.avatar-business.xl{width:64px;height:64px}.avatar-business.xxl{width:96px;height:96px}.avatar-business__image{width:100%;height:100%;object-fit:cover;display:block}.avatar-business__label{color:var(--ColorText-colorTextPrimary, #333);-webkit-user-select:none;user-select:none}.avatar-business__edit-overlay{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;background-color:#f5f5f5;border:.5px solid var(--Stroke, #EAEAEA);opacity:0;transition:opacity .2s ease;cursor:pointer}.avatar-business__edit-overlay:active{background-color:#fafafa}.avatar-business__edit-btn{display:flex;justify-content:center;align-items:center;width:38px;height:38px;border-radius:50%;background-color:#fff;color:#333;pointer-events:none}.avatar-business:hover .avatar-business__edit-overlay{opacity:1}.icon{color:#c4dfff}\n"] }]
|
|
7772
|
+
], template: "<div\r\n class=\"avatar-business\"\r\n [ngClass]=\"[size, shape]\"\r\n>\r\n @if (imageUrl) {\r\n <img [src]=\"imageUrl\" [alt]=\"label || 'avatar'\" class=\"avatar-business__image\" />\r\n } @else if (label) {\r\n <span class=\"body-large avatar-business__label\">{{ label }}</span>\r\n } @else {\r\n @switch (size) {\r\n @case ('xs') {\r\n <ius-icon-xs class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-xs>\r\n }\r\n @case ('sm') {\r\n <ius-icon-sm class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-sm>\r\n }\r\n @case ('md') {\r\n <ius-icon-md class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-md>\r\n }\r\n @case ('lg') {\r\n <ius-icon-lg class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-lg>\r\n }\r\n @case ('xl') {\r\n <ius-icon-xl class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-xl>\r\n }\r\n @case ('xxl') {\r\n <ius-icon-xxl class=\"icon\" [iconName]=\"fallbackIconName\"></ius-icon-xxl>\r\n }\r\n }\r\n }\r\n\r\n @if (showEditButton) {\r\n <div class=\"avatar-business__edit-overlay\" (click)=\"onEditClick($event)\">\r\n <div class=\"avatar-business__edit-btn\">\r\n <ius-icon-sm iconName=\"icon-edit\"></ius-icon-sm>\r\n </div>\r\n </div>\r\n }\r\n</div>\r\n", styles: [":host{display:inline-block}.avatar-business{position:relative;display:flex;justify-content:center;align-items:center;background-color:#edf6ff;overflow:hidden;flex-shrink:0}.avatar-business.circle{border-radius:50%}.avatar-business.square{border-radius:8px}.avatar-business.xs{width:14px;height:14px}.avatar-business.sm{width:24px;height:24px}.avatar-business.md{width:32px;height:32px}.avatar-business.lg{width:40px;height:40px}.avatar-business.xl{width:64px;height:64px}.avatar-business.xxl{width:96px;height:96px}.avatar-business__image{width:100%;height:100%;object-fit:cover;display:block}.avatar-business__label{color:var(--ColorText-colorTextPrimary, #333);-webkit-user-select:none;user-select:none}.avatar-business__edit-overlay{position:absolute;inset:0;display:flex;justify-content:center;align-items:center;background-color:#f5f5f5;border:.5px solid var(--Stroke, #EAEAEA);opacity:0;transition:opacity .2s ease;cursor:pointer}.avatar-business__edit-overlay:active{background-color:#fafafa}.avatar-business__edit-btn{display:flex;justify-content:center;align-items:center;width:38px;height:38px;border-radius:50%;background-color:#fff;color:#333;pointer-events:none}.avatar-business:hover .avatar-business__edit-overlay{opacity:1}.icon{color:#c4dfff}\n"] }]
|
|
7767
7773
|
}], propDecorators: { imageUrl: [{
|
|
7768
7774
|
type: Input
|
|
7769
7775
|
}], label: [{
|