@litigiovirtual/ius-design-components 1.0.212 → 1.0.214
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-icon/avatar-icon.component.mjs +4 -3
- package/esm2022/lib/loading-component-dynamic/loading-component-dynamic.component.mjs +51 -4
- package/fesm2022/litigiovirtual-ius-design-components.mjs +51 -5
- package/fesm2022/litigiovirtual-ius-design-components.mjs.map +1 -1
- package/lib/avatar-icon/avatar-icon.component.d.ts +1 -1
- package/lib/loading-component-dynamic/loading-component-dynamic.component.d.ts +18 -2
- package/package.json +1 -1
|
@@ -3,6 +3,7 @@ import { Component, Input } from '@angular/core';
|
|
|
3
3
|
import { IconXsComponent } from "../icon-xs";
|
|
4
4
|
import { IconSmComponent } from '../icon-sm';
|
|
5
5
|
import { IconMdComponent } from "../icon-md";
|
|
6
|
+
import { IconXlComponent } from "../icon-xl";
|
|
6
7
|
import * as i0 from "@angular/core";
|
|
7
8
|
import * as i1 from "@angular/common";
|
|
8
9
|
export class AvatarIconComponent {
|
|
@@ -13,11 +14,11 @@ export class AvatarIconComponent {
|
|
|
13
14
|
this.iconColor = 'grey';
|
|
14
15
|
}
|
|
15
16
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AvatarIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
16
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: AvatarIconComponent, isStandalone: true, selector: "ius-avatar-icon", inputs: { size: "size", imageUrl: "imageUrl", backgroundColor: "backgroundColor", iconName: "iconName", iconColor: "iconColor" }, ngImport: i0, template: "<div class=\"avatar\" [ngClass]=\"size\" [ngStyle]=\"{'background-color': backgroundColor}\">\r\n @if (imageUrl) {\r\n <img [src]=\"imageUrl\" alt=\"avatar\" />\r\n } @else {\r\n @switch (size) {\r\n @case('sm') {\r\n <ius-icon-xs [iconName]=\"iconName\" [color]=\"iconColor\"></ius-icon-xs>\r\n }\r\n @case('md') {\r\n <ius-icon-sm [iconName]=\"iconName\" [color]=\"iconColor\"></ius-icon-sm>\r\n }\r\n @case('lg') {\r\n <ius-icon-md [iconName]=\"iconName\" [color]=\"iconColor\"></ius-icon-md>\r\n }\r\n }\r\n }\r\n</div>", styles: [".avatar{border-radius:50%;display:flex;justify-content:center;align-items:center}.avatar img{border-radius:50%;width:100%;height:100%;object-fit:cover;display:block}.avatar.sm{width:24px;height:24px}.avatar.md{width:32px;height:32px}.avatar.lg{width:40px;height:40px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.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"] }] }); }
|
|
17
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: AvatarIconComponent, isStandalone: true, selector: "ius-avatar-icon", inputs: { size: "size", imageUrl: "imageUrl", backgroundColor: "backgroundColor", iconName: "iconName", iconColor: "iconColor" }, ngImport: i0, template: "<div class=\"avatar\" [ngClass]=\"size\" [ngStyle]=\"{'background-color': backgroundColor}\">\r\n @if (imageUrl) {\r\n <img [src]=\"imageUrl\" alt=\"avatar\" />\r\n } @else {\r\n @switch (size) {\r\n @case('sm') {\r\n <ius-icon-xs [iconName]=\"iconName\" [color]=\"iconColor\"></ius-icon-xs>\r\n }\r\n @case('md') {\r\n <ius-icon-sm [iconName]=\"iconName\" [color]=\"iconColor\"></ius-icon-sm>\r\n }\r\n @case('lg') {\r\n <ius-icon-md [iconName]=\"iconName\" [color]=\"iconColor\"></ius-icon-md>\r\n }\r\n @case('xl') {\r\n <ius-icon-xl [iconName]=\"iconName\" [color]=\"iconColor\"></ius-icon-xl>\r\n }\r\n }\r\n }\r\n</div>", styles: [".avatar{border-radius:50%;display:flex;justify-content:center;align-items:center}.avatar img{border-radius:50%;width:100%;height:100%;object-fit:cover;display:block}.avatar.sm{width:24px;height:24px}.avatar.md{width:32px;height:32px}.avatar.lg{width:40px;height:40px}.avatar.xl{width:64px;height:64px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.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"] }] }); }
|
|
17
18
|
}
|
|
18
19
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AvatarIconComponent, decorators: [{
|
|
19
20
|
type: Component,
|
|
20
|
-
args: [{ selector: 'ius-avatar-icon', standalone: true, imports: [CommonModule, IconXsComponent, IconSmComponent, IconMdComponent], template: "<div class=\"avatar\" [ngClass]=\"size\" [ngStyle]=\"{'background-color': backgroundColor}\">\r\n @if (imageUrl) {\r\n <img [src]=\"imageUrl\" alt=\"avatar\" />\r\n } @else {\r\n @switch (size) {\r\n @case('sm') {\r\n <ius-icon-xs [iconName]=\"iconName\" [color]=\"iconColor\"></ius-icon-xs>\r\n }\r\n @case('md') {\r\n <ius-icon-sm [iconName]=\"iconName\" [color]=\"iconColor\"></ius-icon-sm>\r\n }\r\n @case('lg') {\r\n <ius-icon-md [iconName]=\"iconName\" [color]=\"iconColor\"></ius-icon-md>\r\n }\r\n }\r\n }\r\n</div>", styles: [".avatar{border-radius:50%;display:flex;justify-content:center;align-items:center}.avatar img{border-radius:50%;width:100%;height:100%;object-fit:cover;display:block}.avatar.sm{width:24px;height:24px}.avatar.md{width:32px;height:32px}.avatar.lg{width:40px;height:40px}\n"] }]
|
|
21
|
+
args: [{ selector: 'ius-avatar-icon', standalone: true, imports: [CommonModule, IconXsComponent, IconSmComponent, IconMdComponent, IconXlComponent], template: "<div class=\"avatar\" [ngClass]=\"size\" [ngStyle]=\"{'background-color': backgroundColor}\">\r\n @if (imageUrl) {\r\n <img [src]=\"imageUrl\" alt=\"avatar\" />\r\n } @else {\r\n @switch (size) {\r\n @case('sm') {\r\n <ius-icon-xs [iconName]=\"iconName\" [color]=\"iconColor\"></ius-icon-xs>\r\n }\r\n @case('md') {\r\n <ius-icon-sm [iconName]=\"iconName\" [color]=\"iconColor\"></ius-icon-sm>\r\n }\r\n @case('lg') {\r\n <ius-icon-md [iconName]=\"iconName\" [color]=\"iconColor\"></ius-icon-md>\r\n }\r\n @case('xl') {\r\n <ius-icon-xl [iconName]=\"iconName\" [color]=\"iconColor\"></ius-icon-xl>\r\n }\r\n }\r\n }\r\n</div>", styles: [".avatar{border-radius:50%;display:flex;justify-content:center;align-items:center}.avatar img{border-radius:50%;width:100%;height:100%;object-fit:cover;display:block}.avatar.sm{width:24px;height:24px}.avatar.md{width:32px;height:32px}.avatar.lg{width:40px;height:40px}.avatar.xl{width:64px;height:64px}\n"] }]
|
|
21
22
|
}], propDecorators: { size: [{
|
|
22
23
|
type: Input
|
|
23
24
|
}], imageUrl: [{
|
|
@@ -29,4 +30,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
29
30
|
}], iconColor: [{
|
|
30
31
|
type: Input
|
|
31
32
|
}] } });
|
|
32
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
33
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYXZhdGFyLWljb24uY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvaXVzLWRlc2lnbi1jb21wb25lbnRzL3NyYy9saWIvYXZhdGFyLWljb24vYXZhdGFyLWljb24uY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvaXVzLWRlc2lnbi1jb21wb25lbnRzL3NyYy9saWIvYXZhdGFyLWljb24vYXZhdGFyLWljb24uY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ2pELE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSxZQUFZLENBQUM7QUFDN0MsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLFlBQVksQ0FBQztBQUM3QyxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sWUFBWSxDQUFDO0FBQzdDLE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSxZQUFZLENBQUM7OztBQVU3QyxNQUFNLE9BQU8sbUJBQW1CO0lBUGhDO1FBUVcsU0FBSSxHQUE4QixJQUFJLENBQUM7UUFJdkMsb0JBQWUsR0FBVyxNQUFNLENBQUM7UUFDakMsYUFBUSxHQUFXLGNBQWMsQ0FBQztRQUNsQyxjQUFTLEdBQVcsTUFBTSxDQUFDO0tBQ3JDOytHQVJZLG1CQUFtQjttR0FBbkIsbUJBQW1CLDZNQ2ZoQyxxeEJBbUJNLHdXRFJNLFlBQVksa05BQUUsZUFBZSx1RkFBRSxlQUFlLHVGQUFFLGVBQWUsdUZBQUUsZUFBZTs7NEZBSS9FLG1CQUFtQjtrQkFQL0IsU0FBUzsrQkFDRSxpQkFBaUIsY0FDZixJQUFJLFdBQ1AsQ0FBQyxZQUFZLEVBQUUsZUFBZSxFQUFFLGVBQWUsRUFBRSxlQUFlLEVBQUUsZUFBZSxDQUFDOzhCQUtsRixJQUFJO3NCQUFaLEtBQUs7Z0JBRUcsUUFBUTtzQkFBaEIsS0FBSztnQkFFRyxlQUFlO3NCQUF2QixLQUFLO2dCQUNHLFFBQVE7c0JBQWhCLEtBQUs7Z0JBQ0csU0FBUztzQkFBakIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XHJcbmltcG9ydCB7IENvbXBvbmVudCwgSW5wdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IHsgSWNvblhzQ29tcG9uZW50IH0gZnJvbSBcIi4uL2ljb24teHNcIjtcclxuaW1wb3J0IHsgSWNvblNtQ29tcG9uZW50IH0gZnJvbSAnLi4vaWNvbi1zbSc7XHJcbmltcG9ydCB7IEljb25NZENvbXBvbmVudCB9IGZyb20gXCIuLi9pY29uLW1kXCI7XHJcbmltcG9ydCB7IEljb25YbENvbXBvbmVudCB9IGZyb20gXCIuLi9pY29uLXhsXCI7XHJcblxyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgc2VsZWN0b3I6ICdpdXMtYXZhdGFyLWljb24nLFxyXG4gIHN0YW5kYWxvbmU6IHRydWUsXHJcbiAgaW1wb3J0czogW0NvbW1vbk1vZHVsZSwgSWNvblhzQ29tcG9uZW50LCBJY29uU21Db21wb25lbnQsIEljb25NZENvbXBvbmVudCwgSWNvblhsQ29tcG9uZW50XSxcclxuICB0ZW1wbGF0ZVVybDogJy4vYXZhdGFyLWljb24uY29tcG9uZW50Lmh0bWwnLFxyXG4gIHN0eWxlVXJsOiAnLi9hdmF0YXItaWNvbi5jb21wb25lbnQuc2NzcydcclxufSlcclxuZXhwb3J0IGNsYXNzIEF2YXRhckljb25Db21wb25lbnQge1xyXG4gIEBJbnB1dCgpIHNpemU6ICdzbScgfCAnbWQnIHwgJ2xnJyB8ICd4bCcgPSAnc20nO1xyXG4gIFxyXG4gIEBJbnB1dCgpIGltYWdlVXJsPzogc3RyaW5nO1xyXG5cclxuICBASW5wdXQoKSBiYWNrZ3JvdW5kQ29sb3I6IHN0cmluZyA9ICdncmV5JztcclxuICBASW5wdXQoKSBpY29uTmFtZTogc3RyaW5nID0gJ2ljb24tY29tbWVudCc7XHJcbiAgQElucHV0KCkgaWNvbkNvbG9yOiBzdHJpbmcgPSAnZ3JleSc7XHJcbn1cclxuIiwiPGRpdiBjbGFzcz1cImF2YXRhclwiIFtuZ0NsYXNzXT1cInNpemVcIiBbbmdTdHlsZV09XCJ7J2JhY2tncm91bmQtY29sb3InOiBiYWNrZ3JvdW5kQ29sb3J9XCI+XHJcbiAgICBAaWYgKGltYWdlVXJsKSB7XHJcbiAgICAgICAgPGltZyBbc3JjXT1cImltYWdlVXJsXCIgYWx0PVwiYXZhdGFyXCIgLz5cclxuICAgIH0gQGVsc2Uge1xyXG4gICAgICAgIEBzd2l0Y2ggKHNpemUpIHtcclxuICAgICAgICAgICAgQGNhc2UoJ3NtJykge1xyXG4gICAgICAgICAgICA8aXVzLWljb24teHMgW2ljb25OYW1lXT1cImljb25OYW1lXCIgW2NvbG9yXT1cImljb25Db2xvclwiPjwvaXVzLWljb24teHM+XHJcbiAgICAgICAgICAgIH1cclxuICAgICAgICAgICAgQGNhc2UoJ21kJykge1xyXG4gICAgICAgICAgICA8aXVzLWljb24tc20gW2ljb25OYW1lXT1cImljb25OYW1lXCIgW2NvbG9yXT1cImljb25Db2xvclwiPjwvaXVzLWljb24tc20+XHJcbiAgICAgICAgICAgIH1cclxuICAgICAgICAgICAgQGNhc2UoJ2xnJykge1xyXG4gICAgICAgICAgICA8aXVzLWljb24tbWQgW2ljb25OYW1lXT1cImljb25OYW1lXCIgW2NvbG9yXT1cImljb25Db2xvclwiPjwvaXVzLWljb24tbWQ+XHJcbiAgICAgICAgICAgIH1cclxuICAgICAgICAgICAgQGNhc2UoJ3hsJykge1xyXG4gICAgICAgICAgICA8aXVzLWljb24teGwgW2ljb25OYW1lXT1cImljb25OYW1lXCIgW2NvbG9yXT1cImljb25Db2xvclwiPjwvaXVzLWljb24teGw+XHJcbiAgICAgICAgICAgIH1cclxuICAgICAgICB9XHJcbiAgICB9XHJcbjwvZGl2PiJdfQ==
|
|
@@ -1,16 +1,63 @@
|
|
|
1
1
|
import { Component, CUSTOM_ELEMENTS_SCHEMA, Input } from '@angular/core';
|
|
2
|
+
import { CommonModule } from '@angular/common';
|
|
2
3
|
import * as i0 from "@angular/core";
|
|
3
4
|
export class LoadingComponentDynamicComponent {
|
|
4
5
|
constructor() {
|
|
6
|
+
this.loading = false;
|
|
7
|
+
this.empty = false;
|
|
8
|
+
this.error = false;
|
|
5
9
|
this.src = '';
|
|
10
|
+
this.srcEmpty = '';
|
|
11
|
+
this.srcError = '';
|
|
12
|
+
this.titleLoading = 'Estamos cargando la información';
|
|
13
|
+
this.subtitleLoading = 'Danos un momento por favor...';
|
|
14
|
+
this.titleEmpty = 'No hay nada aquí...';
|
|
15
|
+
this.subtitleEmpty = 'No encontramos resultados para mostrar.';
|
|
16
|
+
this.titleError = 'Ocurrió un error al cargar los datos...';
|
|
17
|
+
this.subtitleError = 'Inténtalo nuevamente.';
|
|
18
|
+
this.state = 'idle';
|
|
19
|
+
}
|
|
20
|
+
ngOnChanges(changes) {
|
|
21
|
+
this.state = this.resolveState();
|
|
22
|
+
}
|
|
23
|
+
resolveState() {
|
|
24
|
+
if (this.loading)
|
|
25
|
+
return 'loading';
|
|
26
|
+
if (this.error)
|
|
27
|
+
return 'error';
|
|
28
|
+
if (this.empty)
|
|
29
|
+
return 'empty';
|
|
30
|
+
return 'idle';
|
|
6
31
|
}
|
|
7
32
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: LoadingComponentDynamicComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
33
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: LoadingComponentDynamicComponent, isStandalone: true, selector: "ius-loading-component-dynamic", inputs: { loading: "loading", empty: "empty", error: "error", src: "src", srcEmpty: "srcEmpty", srcError: "srcError", titleLoading: "titleLoading", subtitleLoading: "subtitleLoading", titleEmpty: "titleEmpty", subtitleEmpty: "subtitleEmpty", titleError: "titleError", subtitleError: "subtitleError" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"ius-state-container\" [attr.data-state]=\"state\" aria-live=\"polite\">\r\n <div class=\"ius-state-inner\">\r\n\r\n @switch (state) {\r\n\r\n @case ('loading') {\r\n <lottie-player [attr.src]=\"src\" speed=\"1\" style=\"width: 64px; height: 64px;\" loop autoplay>\r\n </lottie-player>\r\n <div class=\"ius-state-text\">\r\n <span class=\"h4\">{{ titleLoading }}</span>\r\n <span class=\"h5\">{{ subtitleLoading }}</span>\r\n </div>\r\n }\r\n\r\n @case ('empty') {\r\n <div class=\"ius-state-img-wrapper\">\r\n <img [src]=\"srcEmpty\" alt=\"Sin resultados\" />\r\n </div>\r\n <div class=\"ius-state-text\">\r\n <span class=\"h4\">{{ titleEmpty }}</span>\r\n <span class=\"h5\">{{ subtitleEmpty }}</span>\r\n </div>\r\n }\r\n\r\n @case ('error') {\r\n <div class=\"ius-state-img-wrapper\">\r\n <img [src]=\"srcError\" alt=\"Error\" />\r\n </div>\r\n <div class=\"ius-state-text\">\r\n <span class=\"h4\">{{ titleError }}</span>\r\n <span class=\"h5\">{{ subtitleError }}</span>\r\n </div>\r\n }\r\n\r\n @default {\r\n\r\n }\r\n\r\n }\r\n\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-state-container{display:flex;flex-direction:column;justify-content:center;align-items:center;flex:1 0 0;align-self:stretch;height:100%;border-radius:8px;border:1px solid #eaeaea;background:#fff;padding:8px}.ius-state-container[data-state=idle]{display:none}.ius-state-inner{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:16px}.ius-state-text{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}.ius-state-img-wrapper{display:flex;width:87px;height:87px;justify-content:center;align-items:center}lottie-player{display:block;min-width:64px;min-height:64px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] }); }
|
|
9
34
|
}
|
|
10
35
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: LoadingComponentDynamicComponent, decorators: [{
|
|
11
36
|
type: Component,
|
|
12
|
-
args: [{ selector: 'ius-loading-component-dynamic', standalone: true, imports: [], schemas: [CUSTOM_ELEMENTS_SCHEMA], template: "<div class=\"container-
|
|
13
|
-
}], propDecorators: {
|
|
37
|
+
args: [{ selector: 'ius-loading-component-dynamic', standalone: true, imports: [CommonModule], schemas: [CUSTOM_ELEMENTS_SCHEMA], template: "<div class=\"ius-state-container\" [attr.data-state]=\"state\" aria-live=\"polite\">\r\n <div class=\"ius-state-inner\">\r\n\r\n @switch (state) {\r\n\r\n @case ('loading') {\r\n <lottie-player [attr.src]=\"src\" speed=\"1\" style=\"width: 64px; height: 64px;\" loop autoplay>\r\n </lottie-player>\r\n <div class=\"ius-state-text\">\r\n <span class=\"h4\">{{ titleLoading }}</span>\r\n <span class=\"h5\">{{ subtitleLoading }}</span>\r\n </div>\r\n }\r\n\r\n @case ('empty') {\r\n <div class=\"ius-state-img-wrapper\">\r\n <img [src]=\"srcEmpty\" alt=\"Sin resultados\" />\r\n </div>\r\n <div class=\"ius-state-text\">\r\n <span class=\"h4\">{{ titleEmpty }}</span>\r\n <span class=\"h5\">{{ subtitleEmpty }}</span>\r\n </div>\r\n }\r\n\r\n @case ('error') {\r\n <div class=\"ius-state-img-wrapper\">\r\n <img [src]=\"srcError\" alt=\"Error\" />\r\n </div>\r\n <div class=\"ius-state-text\">\r\n <span class=\"h4\">{{ titleError }}</span>\r\n <span class=\"h5\">{{ subtitleError }}</span>\r\n </div>\r\n }\r\n\r\n @default {\r\n\r\n }\r\n\r\n }\r\n\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-state-container{display:flex;flex-direction:column;justify-content:center;align-items:center;flex:1 0 0;align-self:stretch;height:100%;border-radius:8px;border:1px solid #eaeaea;background:#fff;padding:8px}.ius-state-container[data-state=idle]{display:none}.ius-state-inner{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:16px}.ius-state-text{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}.ius-state-img-wrapper{display:flex;width:87px;height:87px;justify-content:center;align-items:center}lottie-player{display:block;min-width:64px;min-height:64px}\n"] }]
|
|
38
|
+
}], propDecorators: { loading: [{
|
|
39
|
+
type: Input
|
|
40
|
+
}], empty: [{
|
|
41
|
+
type: Input
|
|
42
|
+
}], error: [{
|
|
43
|
+
type: Input
|
|
44
|
+
}], src: [{
|
|
45
|
+
type: Input
|
|
46
|
+
}], srcEmpty: [{
|
|
47
|
+
type: Input
|
|
48
|
+
}], srcError: [{
|
|
49
|
+
type: Input
|
|
50
|
+
}], titleLoading: [{
|
|
51
|
+
type: Input
|
|
52
|
+
}], subtitleLoading: [{
|
|
53
|
+
type: Input
|
|
54
|
+
}], titleEmpty: [{
|
|
55
|
+
type: Input
|
|
56
|
+
}], subtitleEmpty: [{
|
|
57
|
+
type: Input
|
|
58
|
+
}], titleError: [{
|
|
59
|
+
type: Input
|
|
60
|
+
}], subtitleError: [{
|
|
14
61
|
type: Input
|
|
15
62
|
}] } });
|
|
16
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
63
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibG9hZGluZy1jb21wb25lbnQtZHluYW1pYy5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9pdXMtZGVzaWduLWNvbXBvbmVudHMvc3JjL2xpYi9sb2FkaW5nLWNvbXBvbmVudC1keW5hbWljL2xvYWRpbmctY29tcG9uZW50LWR5bmFtaWMuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvaXVzLWRlc2lnbi1jb21wb25lbnRzL3NyYy9saWIvbG9hZGluZy1jb21wb25lbnQtZHluYW1pYy9sb2FkaW5nLWNvbXBvbmVudC1keW5hbWljLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsc0JBQXNCLEVBQUUsS0FBSyxFQUE0QixNQUFNLGVBQWUsQ0FBQztBQUNuRyxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7O0FBWS9DLE1BQU0sT0FBTyxnQ0FBZ0M7SUFSN0M7UUFVVyxZQUFPLEdBQUcsS0FBSyxDQUFDO1FBQ2hCLFVBQUssR0FBRyxLQUFLLENBQUM7UUFDZCxVQUFLLEdBQUcsS0FBSyxDQUFDO1FBQ2QsUUFBRyxHQUFXLEVBQUUsQ0FBQztRQUNqQixhQUFRLEdBQVcsRUFBRSxDQUFDO1FBQ3RCLGFBQVEsR0FBVyxFQUFFLENBQUM7UUFFdEIsaUJBQVksR0FBRyxpQ0FBaUMsQ0FBQztRQUNqRCxvQkFBZSxHQUFHLCtCQUErQixDQUFDO1FBRWxELGVBQVUsR0FBRyxxQkFBcUIsQ0FBQztRQUNuQyxrQkFBYSxHQUFHLHlDQUF5QyxDQUFDO1FBRTFELGVBQVUsR0FBRyx5Q0FBeUMsQ0FBQztRQUN2RCxrQkFBYSxHQUFHLHVCQUF1QixDQUFDO1FBRWpELFVBQUssR0FBaUIsTUFBTSxDQUFDO0tBWTlCO0lBVkMsV0FBVyxDQUFDLE9BQXNCO1FBQ2hDLElBQUksQ0FBQyxLQUFLLEdBQUcsSUFBSSxDQUFDLFlBQVksRUFBRSxDQUFDO0lBQ25DLENBQUM7SUFFTyxZQUFZO1FBQ2xCLElBQUksSUFBSSxDQUFDLE9BQU87WUFBRSxPQUFPLFNBQVMsQ0FBQztRQUNuQyxJQUFJLElBQUksQ0FBQyxLQUFLO1lBQUksT0FBTyxPQUFPLENBQUM7UUFDakMsSUFBSSxJQUFJLENBQUMsS0FBSztZQUFJLE9BQU8sT0FBTyxDQUFDO1FBQ2pDLE9BQU8sTUFBTSxDQUFDO0lBQ2hCLENBQUM7K0dBN0JVLGdDQUFnQzttR0FBaEMsZ0NBQWdDLDRaQ2I3Qyx1eUNBeUNNLDRuRURqQ00sWUFBWTs7NEZBS1gsZ0NBQWdDO2tCQVI1QyxTQUFTOytCQUNFLCtCQUErQixjQUM3QixJQUFJLFdBQ1AsQ0FBQyxZQUFZLENBQUMsV0FHZCxDQUFDLHNCQUFzQixDQUFDOzhCQUl4QixPQUFPO3NCQUFmLEtBQUs7Z0JBQ0csS0FBSztzQkFBYixLQUFLO2dCQUNHLEtBQUs7c0JBQWIsS0FBSztnQkFDRyxHQUFHO3NCQUFYLEtBQUs7Z0JBQ0csUUFBUTtzQkFBaEIsS0FBSztnQkFDRyxRQUFRO3NCQUFoQixLQUFLO2dCQUVHLFlBQVk7c0JBQXBCLEtBQUs7Z0JBQ0csZUFBZTtzQkFBdkIsS0FBSztnQkFFRyxVQUFVO3NCQUFsQixLQUFLO2dCQUNHLGFBQWE7c0JBQXJCLEtBQUs7Z0JBRUcsVUFBVTtzQkFBbEIsS0FBSztnQkFDRyxhQUFhO3NCQUFyQixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBDVVNUT01fRUxFTUVOVFNfU0NIRU1BLCBJbnB1dCwgT25DaGFuZ2VzLCBTaW1wbGVDaGFuZ2VzIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XHJcblxyXG5leHBvcnQgdHlwZSBMb2FkaW5nU3RhdGUgPSAnbG9hZGluZycgfCAnZW1wdHknIHwgJ2Vycm9yJyB8ICdpZGxlJztcclxuXHJcbkBDb21wb25lbnQoe1xyXG4gIHNlbGVjdG9yOiAnaXVzLWxvYWRpbmctY29tcG9uZW50LWR5bmFtaWMnLFxyXG4gIHN0YW5kYWxvbmU6IHRydWUsXHJcbiAgaW1wb3J0czogW0NvbW1vbk1vZHVsZV0sXHJcbiAgdGVtcGxhdGVVcmw6ICcuL2xvYWRpbmctY29tcG9uZW50LWR5bmFtaWMuY29tcG9uZW50Lmh0bWwnLFxyXG4gIHN0eWxlVXJsOiAnLi9sb2FkaW5nLWNvbXBvbmVudC1keW5hbWljLmNvbXBvbmVudC5zY3NzJyxcclxuICBzY2hlbWFzOiBbQ1VTVE9NX0VMRU1FTlRTX1NDSEVNQV0sXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBMb2FkaW5nQ29tcG9uZW50RHluYW1pY0NvbXBvbmVudCBpbXBsZW1lbnRzIE9uQ2hhbmdlcyB7XHJcblxyXG4gIEBJbnB1dCgpIGxvYWRpbmcgPSBmYWxzZTtcclxuICBASW5wdXQoKSBlbXB0eSA9IGZhbHNlO1xyXG4gIEBJbnB1dCgpIGVycm9yID0gZmFsc2U7XHJcbiAgQElucHV0KCkgc3JjOiBzdHJpbmcgPSAnJztcclxuICBASW5wdXQoKSBzcmNFbXB0eTogc3RyaW5nID0gJyc7XHJcbiAgQElucHV0KCkgc3JjRXJyb3I6IHN0cmluZyA9ICcnO1xyXG5cclxuICBASW5wdXQoKSB0aXRsZUxvYWRpbmcgPSAnRXN0YW1vcyBjYXJnYW5kbyBsYSBpbmZvcm1hY2nDs24nO1xyXG4gIEBJbnB1dCgpIHN1YnRpdGxlTG9hZGluZyA9ICdEYW5vcyB1biBtb21lbnRvIHBvciBmYXZvci4uLic7XHJcblxyXG4gIEBJbnB1dCgpIHRpdGxlRW1wdHkgPSAnTm8gaGF5IG5hZGEgYXF1w60uLi4nO1xyXG4gIEBJbnB1dCgpIHN1YnRpdGxlRW1wdHkgPSAnTm8gZW5jb250cmFtb3MgcmVzdWx0YWRvcyBwYXJhIG1vc3RyYXIuJztcclxuXHJcbiAgQElucHV0KCkgdGl0bGVFcnJvciA9ICdPY3VycmnDsyB1biBlcnJvciBhbCBjYXJnYXIgbG9zIGRhdG9zLi4uJztcclxuICBASW5wdXQoKSBzdWJ0aXRsZUVycm9yID0gJ0ludMOpbnRhbG8gbnVldmFtZW50ZS4nO1xyXG5cclxuICBzdGF0ZTogTG9hZGluZ1N0YXRlID0gJ2lkbGUnO1xyXG5cclxuICBuZ09uQ2hhbmdlcyhjaGFuZ2VzOiBTaW1wbGVDaGFuZ2VzKTogdm9pZCB7XHJcbiAgICB0aGlzLnN0YXRlID0gdGhpcy5yZXNvbHZlU3RhdGUoKTtcclxuICB9XHJcblxyXG4gIHByaXZhdGUgcmVzb2x2ZVN0YXRlKCk6IExvYWRpbmdTdGF0ZSB7XHJcbiAgICBpZiAodGhpcy5sb2FkaW5nKSByZXR1cm4gJ2xvYWRpbmcnO1xyXG4gICAgaWYgKHRoaXMuZXJyb3IpICAgcmV0dXJuICdlcnJvcic7XHJcbiAgICBpZiAodGhpcy5lbXB0eSkgICByZXR1cm4gJ2VtcHR5JztcclxuICAgIHJldHVybiAnaWRsZSc7XHJcbiAgfVxyXG59IiwiPGRpdiBjbGFzcz1cIml1cy1zdGF0ZS1jb250YWluZXJcIiBbYXR0ci5kYXRhLXN0YXRlXT1cInN0YXRlXCIgYXJpYS1saXZlPVwicG9saXRlXCI+XHJcbiAgICA8ZGl2IGNsYXNzPVwiaXVzLXN0YXRlLWlubmVyXCI+XHJcblxyXG4gICAgICAgIEBzd2l0Y2ggKHN0YXRlKSB7XHJcblxyXG4gICAgICAgIEBjYXNlICgnbG9hZGluZycpIHtcclxuICAgICAgICA8bG90dGllLXBsYXllciBbYXR0ci5zcmNdPVwic3JjXCIgc3BlZWQ9XCIxXCIgc3R5bGU9XCJ3aWR0aDogNjRweDsgaGVpZ2h0OiA2NHB4O1wiIGxvb3AgYXV0b3BsYXk+XHJcbiAgICAgICAgPC9sb3R0aWUtcGxheWVyPlxyXG4gICAgICAgIDxkaXYgY2xhc3M9XCJpdXMtc3RhdGUtdGV4dFwiPlxyXG4gICAgICAgICAgICA8c3BhbiBjbGFzcz1cImg0XCI+e3sgdGl0bGVMb2FkaW5nIH19PC9zcGFuPlxyXG4gICAgICAgICAgICA8c3BhbiBjbGFzcz1cImg1XCI+e3sgc3VidGl0bGVMb2FkaW5nIH19PC9zcGFuPlxyXG4gICAgICAgIDwvZGl2PlxyXG4gICAgICAgIH1cclxuXHJcbiAgICAgICAgQGNhc2UgKCdlbXB0eScpIHtcclxuICAgICAgICA8ZGl2IGNsYXNzPVwiaXVzLXN0YXRlLWltZy13cmFwcGVyXCI+XHJcbiAgICAgICAgICAgIDxpbWcgW3NyY109XCJzcmNFbXB0eVwiIGFsdD1cIlNpbiByZXN1bHRhZG9zXCIgLz5cclxuICAgICAgICA8L2Rpdj5cclxuICAgICAgICA8ZGl2IGNsYXNzPVwiaXVzLXN0YXRlLXRleHRcIj5cclxuICAgICAgICAgICAgPHNwYW4gY2xhc3M9XCJoNFwiPnt7IHRpdGxlRW1wdHkgfX08L3NwYW4+XHJcbiAgICAgICAgICAgIDxzcGFuIGNsYXNzPVwiaDVcIj57eyBzdWJ0aXRsZUVtcHR5IH19PC9zcGFuPlxyXG4gICAgICAgIDwvZGl2PlxyXG4gICAgICAgIH1cclxuXHJcbiAgICAgICAgQGNhc2UgKCdlcnJvcicpIHtcclxuICAgICAgICA8ZGl2IGNsYXNzPVwiaXVzLXN0YXRlLWltZy13cmFwcGVyXCI+XHJcbiAgICAgICAgICAgIDxpbWcgW3NyY109XCJzcmNFcnJvclwiIGFsdD1cIkVycm9yXCIgLz5cclxuICAgICAgICA8L2Rpdj5cclxuICAgICAgICA8ZGl2IGNsYXNzPVwiaXVzLXN0YXRlLXRleHRcIj5cclxuICAgICAgICAgICAgPHNwYW4gY2xhc3M9XCJoNFwiPnt7IHRpdGxlRXJyb3IgfX08L3NwYW4+XHJcbiAgICAgICAgICAgIDxzcGFuIGNsYXNzPVwiaDVcIj57eyBzdWJ0aXRsZUVycm9yIH19PC9zcGFuPlxyXG4gICAgICAgIDwvZGl2PlxyXG4gICAgICAgIH1cclxuXHJcbiAgICAgICAgQGRlZmF1bHQge1xyXG5cclxuICAgICAgICB9XHJcblxyXG4gICAgICAgIH1cclxuXHJcbiAgICA8L2Rpdj5cclxuPC9kaXY+Il19
|
|
@@ -3285,11 +3285,11 @@ class AvatarIconComponent {
|
|
|
3285
3285
|
this.iconColor = 'grey';
|
|
3286
3286
|
}
|
|
3287
3287
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AvatarIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
3288
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: AvatarIconComponent, isStandalone: true, selector: "ius-avatar-icon", inputs: { size: "size", imageUrl: "imageUrl", backgroundColor: "backgroundColor", iconName: "iconName", iconColor: "iconColor" }, ngImport: i0, template: "<div class=\"avatar\" [ngClass]=\"size\" [ngStyle]=\"{'background-color': backgroundColor}\">\r\n @if (imageUrl) {\r\n <img [src]=\"imageUrl\" alt=\"avatar\" />\r\n } @else {\r\n @switch (size) {\r\n @case('sm') {\r\n <ius-icon-xs [iconName]=\"iconName\" [color]=\"iconColor\"></ius-icon-xs>\r\n }\r\n @case('md') {\r\n <ius-icon-sm [iconName]=\"iconName\" [color]=\"iconColor\"></ius-icon-sm>\r\n }\r\n @case('lg') {\r\n <ius-icon-md [iconName]=\"iconName\" [color]=\"iconColor\"></ius-icon-md>\r\n }\r\n }\r\n }\r\n</div>", styles: [".avatar{border-radius:50%;display:flex;justify-content:center;align-items:center}.avatar img{border-radius:50%;width:100%;height:100%;object-fit:cover;display:block}.avatar.sm{width:24px;height:24px}.avatar.md{width:32px;height:32px}.avatar.lg{width:40px;height:40px}\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"] }] }); }
|
|
3288
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: AvatarIconComponent, isStandalone: true, selector: "ius-avatar-icon", inputs: { size: "size", imageUrl: "imageUrl", backgroundColor: "backgroundColor", iconName: "iconName", iconColor: "iconColor" }, ngImport: i0, template: "<div class=\"avatar\" [ngClass]=\"size\" [ngStyle]=\"{'background-color': backgroundColor}\">\r\n @if (imageUrl) {\r\n <img [src]=\"imageUrl\" alt=\"avatar\" />\r\n } @else {\r\n @switch (size) {\r\n @case('sm') {\r\n <ius-icon-xs [iconName]=\"iconName\" [color]=\"iconColor\"></ius-icon-xs>\r\n }\r\n @case('md') {\r\n <ius-icon-sm [iconName]=\"iconName\" [color]=\"iconColor\"></ius-icon-sm>\r\n }\r\n @case('lg') {\r\n <ius-icon-md [iconName]=\"iconName\" [color]=\"iconColor\"></ius-icon-md>\r\n }\r\n @case('xl') {\r\n <ius-icon-xl [iconName]=\"iconName\" [color]=\"iconColor\"></ius-icon-xl>\r\n }\r\n }\r\n }\r\n</div>", styles: [".avatar{border-radius:50%;display:flex;justify-content:center;align-items:center}.avatar img{border-radius:50%;width:100%;height:100%;object-fit:cover;display:block}.avatar.sm{width:24px;height:24px}.avatar.md{width:32px;height:32px}.avatar.lg{width:40px;height:40px}.avatar.xl{width:64px;height:64px}\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"] }] }); }
|
|
3289
3289
|
}
|
|
3290
3290
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: AvatarIconComponent, decorators: [{
|
|
3291
3291
|
type: Component,
|
|
3292
|
-
args: [{ selector: 'ius-avatar-icon', standalone: true, imports: [CommonModule, IconXsComponent, IconSmComponent, IconMdComponent], template: "<div class=\"avatar\" [ngClass]=\"size\" [ngStyle]=\"{'background-color': backgroundColor}\">\r\n @if (imageUrl) {\r\n <img [src]=\"imageUrl\" alt=\"avatar\" />\r\n } @else {\r\n @switch (size) {\r\n @case('sm') {\r\n <ius-icon-xs [iconName]=\"iconName\" [color]=\"iconColor\"></ius-icon-xs>\r\n }\r\n @case('md') {\r\n <ius-icon-sm [iconName]=\"iconName\" [color]=\"iconColor\"></ius-icon-sm>\r\n }\r\n @case('lg') {\r\n <ius-icon-md [iconName]=\"iconName\" [color]=\"iconColor\"></ius-icon-md>\r\n }\r\n }\r\n }\r\n</div>", styles: [".avatar{border-radius:50%;display:flex;justify-content:center;align-items:center}.avatar img{border-radius:50%;width:100%;height:100%;object-fit:cover;display:block}.avatar.sm{width:24px;height:24px}.avatar.md{width:32px;height:32px}.avatar.lg{width:40px;height:40px}\n"] }]
|
|
3292
|
+
args: [{ selector: 'ius-avatar-icon', standalone: true, imports: [CommonModule, IconXsComponent, IconSmComponent, IconMdComponent, IconXlComponent], template: "<div class=\"avatar\" [ngClass]=\"size\" [ngStyle]=\"{'background-color': backgroundColor}\">\r\n @if (imageUrl) {\r\n <img [src]=\"imageUrl\" alt=\"avatar\" />\r\n } @else {\r\n @switch (size) {\r\n @case('sm') {\r\n <ius-icon-xs [iconName]=\"iconName\" [color]=\"iconColor\"></ius-icon-xs>\r\n }\r\n @case('md') {\r\n <ius-icon-sm [iconName]=\"iconName\" [color]=\"iconColor\"></ius-icon-sm>\r\n }\r\n @case('lg') {\r\n <ius-icon-md [iconName]=\"iconName\" [color]=\"iconColor\"></ius-icon-md>\r\n }\r\n @case('xl') {\r\n <ius-icon-xl [iconName]=\"iconName\" [color]=\"iconColor\"></ius-icon-xl>\r\n }\r\n }\r\n }\r\n</div>", styles: [".avatar{border-radius:50%;display:flex;justify-content:center;align-items:center}.avatar img{border-radius:50%;width:100%;height:100%;object-fit:cover;display:block}.avatar.sm{width:24px;height:24px}.avatar.md{width:32px;height:32px}.avatar.lg{width:40px;height:40px}.avatar.xl{width:64px;height:64px}\n"] }]
|
|
3293
3293
|
}], propDecorators: { size: [{
|
|
3294
3294
|
type: Input
|
|
3295
3295
|
}], imageUrl: [{
|
|
@@ -7292,15 +7292,61 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
7292
7292
|
|
|
7293
7293
|
class LoadingComponentDynamicComponent {
|
|
7294
7294
|
constructor() {
|
|
7295
|
+
this.loading = false;
|
|
7296
|
+
this.empty = false;
|
|
7297
|
+
this.error = false;
|
|
7295
7298
|
this.src = '';
|
|
7299
|
+
this.srcEmpty = '';
|
|
7300
|
+
this.srcError = '';
|
|
7301
|
+
this.titleLoading = 'Estamos cargando la información';
|
|
7302
|
+
this.subtitleLoading = 'Danos un momento por favor...';
|
|
7303
|
+
this.titleEmpty = 'No hay nada aquí...';
|
|
7304
|
+
this.subtitleEmpty = 'No encontramos resultados para mostrar.';
|
|
7305
|
+
this.titleError = 'Ocurrió un error al cargar los datos...';
|
|
7306
|
+
this.subtitleError = 'Inténtalo nuevamente.';
|
|
7307
|
+
this.state = 'idle';
|
|
7308
|
+
}
|
|
7309
|
+
ngOnChanges(changes) {
|
|
7310
|
+
this.state = this.resolveState();
|
|
7311
|
+
}
|
|
7312
|
+
resolveState() {
|
|
7313
|
+
if (this.loading)
|
|
7314
|
+
return 'loading';
|
|
7315
|
+
if (this.error)
|
|
7316
|
+
return 'error';
|
|
7317
|
+
if (this.empty)
|
|
7318
|
+
return 'empty';
|
|
7319
|
+
return 'idle';
|
|
7296
7320
|
}
|
|
7297
7321
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: LoadingComponentDynamicComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
7298
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
7322
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: LoadingComponentDynamicComponent, isStandalone: true, selector: "ius-loading-component-dynamic", inputs: { loading: "loading", empty: "empty", error: "error", src: "src", srcEmpty: "srcEmpty", srcError: "srcError", titleLoading: "titleLoading", subtitleLoading: "subtitleLoading", titleEmpty: "titleEmpty", subtitleEmpty: "subtitleEmpty", titleError: "titleError", subtitleError: "subtitleError" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"ius-state-container\" [attr.data-state]=\"state\" aria-live=\"polite\">\r\n <div class=\"ius-state-inner\">\r\n\r\n @switch (state) {\r\n\r\n @case ('loading') {\r\n <lottie-player [attr.src]=\"src\" speed=\"1\" style=\"width: 64px; height: 64px;\" loop autoplay>\r\n </lottie-player>\r\n <div class=\"ius-state-text\">\r\n <span class=\"h4\">{{ titleLoading }}</span>\r\n <span class=\"h5\">{{ subtitleLoading }}</span>\r\n </div>\r\n }\r\n\r\n @case ('empty') {\r\n <div class=\"ius-state-img-wrapper\">\r\n <img [src]=\"srcEmpty\" alt=\"Sin resultados\" />\r\n </div>\r\n <div class=\"ius-state-text\">\r\n <span class=\"h4\">{{ titleEmpty }}</span>\r\n <span class=\"h5\">{{ subtitleEmpty }}</span>\r\n </div>\r\n }\r\n\r\n @case ('error') {\r\n <div class=\"ius-state-img-wrapper\">\r\n <img [src]=\"srcError\" alt=\"Error\" />\r\n </div>\r\n <div class=\"ius-state-text\">\r\n <span class=\"h4\">{{ titleError }}</span>\r\n <span class=\"h5\">{{ subtitleError }}</span>\r\n </div>\r\n }\r\n\r\n @default {\r\n\r\n }\r\n\r\n }\r\n\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-state-container{display:flex;flex-direction:column;justify-content:center;align-items:center;flex:1 0 0;align-self:stretch;height:100%;border-radius:8px;border:1px solid #eaeaea;background:#fff;padding:8px}.ius-state-container[data-state=idle]{display:none}.ius-state-inner{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:16px}.ius-state-text{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}.ius-state-img-wrapper{display:flex;width:87px;height:87px;justify-content:center;align-items:center}lottie-player{display:block;min-width:64px;min-height:64px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }] }); }
|
|
7299
7323
|
}
|
|
7300
7324
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: LoadingComponentDynamicComponent, decorators: [{
|
|
7301
7325
|
type: Component,
|
|
7302
|
-
args: [{ selector: 'ius-loading-component-dynamic', standalone: true, imports: [], schemas: [CUSTOM_ELEMENTS_SCHEMA], template: "<div class=\"container-
|
|
7303
|
-
}], propDecorators: {
|
|
7326
|
+
args: [{ selector: 'ius-loading-component-dynamic', standalone: true, imports: [CommonModule], schemas: [CUSTOM_ELEMENTS_SCHEMA], template: "<div class=\"ius-state-container\" [attr.data-state]=\"state\" aria-live=\"polite\">\r\n <div class=\"ius-state-inner\">\r\n\r\n @switch (state) {\r\n\r\n @case ('loading') {\r\n <lottie-player [attr.src]=\"src\" speed=\"1\" style=\"width: 64px; height: 64px;\" loop autoplay>\r\n </lottie-player>\r\n <div class=\"ius-state-text\">\r\n <span class=\"h4\">{{ titleLoading }}</span>\r\n <span class=\"h5\">{{ subtitleLoading }}</span>\r\n </div>\r\n }\r\n\r\n @case ('empty') {\r\n <div class=\"ius-state-img-wrapper\">\r\n <img [src]=\"srcEmpty\" alt=\"Sin resultados\" />\r\n </div>\r\n <div class=\"ius-state-text\">\r\n <span class=\"h4\">{{ titleEmpty }}</span>\r\n <span class=\"h5\">{{ subtitleEmpty }}</span>\r\n </div>\r\n }\r\n\r\n @case ('error') {\r\n <div class=\"ius-state-img-wrapper\">\r\n <img [src]=\"srcError\" alt=\"Error\" />\r\n </div>\r\n <div class=\"ius-state-text\">\r\n <span class=\"h4\">{{ titleError }}</span>\r\n <span class=\"h5\">{{ subtitleError }}</span>\r\n </div>\r\n }\r\n\r\n @default {\r\n\r\n }\r\n\r\n }\r\n\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-state-container{display:flex;flex-direction:column;justify-content:center;align-items:center;flex:1 0 0;align-self:stretch;height:100%;border-radius:8px;border:1px solid #eaeaea;background:#fff;padding:8px}.ius-state-container[data-state=idle]{display:none}.ius-state-inner{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:16px}.ius-state-text{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}.ius-state-img-wrapper{display:flex;width:87px;height:87px;justify-content:center;align-items:center}lottie-player{display:block;min-width:64px;min-height:64px}\n"] }]
|
|
7327
|
+
}], propDecorators: { loading: [{
|
|
7328
|
+
type: Input
|
|
7329
|
+
}], empty: [{
|
|
7330
|
+
type: Input
|
|
7331
|
+
}], error: [{
|
|
7332
|
+
type: Input
|
|
7333
|
+
}], src: [{
|
|
7334
|
+
type: Input
|
|
7335
|
+
}], srcEmpty: [{
|
|
7336
|
+
type: Input
|
|
7337
|
+
}], srcError: [{
|
|
7338
|
+
type: Input
|
|
7339
|
+
}], titleLoading: [{
|
|
7340
|
+
type: Input
|
|
7341
|
+
}], subtitleLoading: [{
|
|
7342
|
+
type: Input
|
|
7343
|
+
}], titleEmpty: [{
|
|
7344
|
+
type: Input
|
|
7345
|
+
}], subtitleEmpty: [{
|
|
7346
|
+
type: Input
|
|
7347
|
+
}], titleError: [{
|
|
7348
|
+
type: Input
|
|
7349
|
+
}], subtitleError: [{
|
|
7304
7350
|
type: Input
|
|
7305
7351
|
}] } });
|
|
7306
7352
|
|