@progressio_resources/gravity-design-system 2.1.1 → 2.1.3
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/components/gravity-attach-file/gravity-attach-file.component.mjs +26 -7
- package/esm2022/lib/components/gravity-notification/gravity-notification.component.mjs +3 -3
- package/esm2022/lib/components/gravity-notification-instant/gravity-notification-instant-container.component.mjs +3 -3
- package/esm2022/lib/components/gravity-table/gravity-table.component.mjs +3 -3
- package/fesm2022/progressio_resources-gravity-design-system.mjs +31 -12
- package/fesm2022/progressio_resources-gravity-design-system.mjs.map +1 -1
- package/lib/components/gravity-attach-file/gravity-attach-file.component.d.ts +8 -4
- package/package.json +1 -1
|
@@ -1395,11 +1395,11 @@ class GravityNotificationComponent {
|
|
|
1395
1395
|
this.ngbActiveModal.close();
|
|
1396
1396
|
}
|
|
1397
1397
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityNotificationComponent, deps: [{ token: i1$2.NgbActiveModal }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1398
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityNotificationComponent, selector: "ng-component", inputs: { notificationContent: "notificationContent" }, ngImport: i0, template: "<main class=\"alert-content {{notificationContent.state}}\">\n <gravity-icon class=\"close\" (click)=\"closeModal()\" data-cy=\"gravity_notification_informative_close_icon\"\n [iconName]=\"'
|
|
1398
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityNotificationComponent, selector: "ng-component", inputs: { notificationContent: "notificationContent" }, ngImport: i0, template: "<main class=\"alert-content {{notificationContent.state}}\">\n <gravity-icon class=\"close\" (click)=\"closeModal()\" data-cy=\"gravity_notification_informative_close_icon\"\n [iconName]=\"'unsuccess'\" [title]=\"'Close'\"></gravity-icon>\n\n <div class=\"title\">\n <gravity-icon class=\"title-icon\" [iconName]=\"'notification_' + notificationContent.state\"></gravity-icon>\n <h1 class=\"hr-title lg-bold\">{{notificationContent.title}}</h1>\n </div>\n\n <div class=\"content\">\n <h2 class=\"hr-body-text md-regular\">{{notificationContent.text}}</h2>\n </div>\n</main>\n", styles: [".border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:50%}main.alert-content{border-bottom:.75rem solid var(--notification-highlight-color);border-radius:.625rem;padding:1.5rem 1.5rem 1rem;position:relative}main.alert-content.success{--notification-highlight-color: var(--notification-success-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-success-primary);--notification-icon-color: var(--on-bg-icon-notification-success-primary)}main.alert-content.error{--notification-highlight-color: var(--notification-error-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-error-primary);--notification-icon-color: var(--on-bg-icon-notification-error-primary)}main.alert-content.warning{--notification-highlight-color: var(--notification-warning-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-warning-primary);--notification-icon-color: var(--on-bg-icon-notification-warning-primary)}gravity-icon.close{align-items:center;border-radius:50%;cursor:pointer;display:flex;height:2rem;line-height:0;justify-content:center;position:absolute;right:.75rem;top:.625rem;width:2rem}gravity-icon.close ::ng-deep svg-icon{--icon-color: var(--close-dialog-header-active-primary);--icon-height: 1.25rem;--icon-width: 1.25rem}gravity-icon.close:hover{background-color:var(--bg-close-dialog-header-hover-primary)}gravity-icon.close:hover ::ng-deep svg-icon{--icon-color: var(--close-dialog-header-hover-primary)}.title{align-items:center;display:flex}.title gravity-icon.title-icon{align-items:center;background-color:var(--notification-icon-background-color);border-radius:50%;display:flex;height:2rem;line-height:0;justify-content:center;margin-right:1rem;max-height:2rem;max-width:2rem;min-height:2rem;min-width:2rem;padding:.5rem;width:2rem}.title gravity-icon.title-icon ::ng-deep svg-icon{--icon-color: var(--notification-icon-color)}.content{margin-left:3rem}\n"], dependencies: [{ kind: "component", type: GravityIconComponent, selector: "gravity-icon", inputs: ["customIconColorVariable", "iconName", "hoverIcon", "size"] }] }); }
|
|
1399
1399
|
}
|
|
1400
1400
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityNotificationComponent, decorators: [{
|
|
1401
1401
|
type: Component,
|
|
1402
|
-
args: [{ template: "<main class=\"alert-content {{notificationContent.state}}\">\n <gravity-icon class=\"close\" (click)=\"closeModal()\" data-cy=\"gravity_notification_informative_close_icon\"\n [iconName]=\"'
|
|
1402
|
+
args: [{ template: "<main class=\"alert-content {{notificationContent.state}}\">\n <gravity-icon class=\"close\" (click)=\"closeModal()\" data-cy=\"gravity_notification_informative_close_icon\"\n [iconName]=\"'unsuccess'\" [title]=\"'Close'\"></gravity-icon>\n\n <div class=\"title\">\n <gravity-icon class=\"title-icon\" [iconName]=\"'notification_' + notificationContent.state\"></gravity-icon>\n <h1 class=\"hr-title lg-bold\">{{notificationContent.title}}</h1>\n </div>\n\n <div class=\"content\">\n <h2 class=\"hr-body-text md-regular\">{{notificationContent.text}}</h2>\n </div>\n</main>\n", styles: [".border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:50%}main.alert-content{border-bottom:.75rem solid var(--notification-highlight-color);border-radius:.625rem;padding:1.5rem 1.5rem 1rem;position:relative}main.alert-content.success{--notification-highlight-color: var(--notification-success-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-success-primary);--notification-icon-color: var(--on-bg-icon-notification-success-primary)}main.alert-content.error{--notification-highlight-color: var(--notification-error-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-error-primary);--notification-icon-color: var(--on-bg-icon-notification-error-primary)}main.alert-content.warning{--notification-highlight-color: var(--notification-warning-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-warning-primary);--notification-icon-color: var(--on-bg-icon-notification-warning-primary)}gravity-icon.close{align-items:center;border-radius:50%;cursor:pointer;display:flex;height:2rem;line-height:0;justify-content:center;position:absolute;right:.75rem;top:.625rem;width:2rem}gravity-icon.close ::ng-deep svg-icon{--icon-color: var(--close-dialog-header-active-primary);--icon-height: 1.25rem;--icon-width: 1.25rem}gravity-icon.close:hover{background-color:var(--bg-close-dialog-header-hover-primary)}gravity-icon.close:hover ::ng-deep svg-icon{--icon-color: var(--close-dialog-header-hover-primary)}.title{align-items:center;display:flex}.title gravity-icon.title-icon{align-items:center;background-color:var(--notification-icon-background-color);border-radius:50%;display:flex;height:2rem;line-height:0;justify-content:center;margin-right:1rem;max-height:2rem;max-width:2rem;min-height:2rem;min-width:2rem;padding:.5rem;width:2rem}.title gravity-icon.title-icon ::ng-deep svg-icon{--icon-color: var(--notification-icon-color)}.content{margin-left:3rem}\n"] }]
|
|
1403
1403
|
}], ctorParameters: function () { return [{ type: i1$2.NgbActiveModal }]; }, propDecorators: { notificationContent: [{
|
|
1404
1404
|
type: Input
|
|
1405
1405
|
}] } });
|
|
@@ -1431,26 +1431,41 @@ class GravityNotificationInstantContainerComponent {
|
|
|
1431
1431
|
this.delay = 5000;
|
|
1432
1432
|
}
|
|
1433
1433
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityNotificationInstantContainerComponent, deps: [{ token: GravityInstantNotificationsService }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1434
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityNotificationInstantContainerComponent, selector: "gravity-notification-instant-container", inputs: { delay: "delay" }, ngImport: i0, template: "<ngb-toast [autohide]=\"true\"\n [delay]=\"delay\"\n\n (hidden)=\"gravityInstantNotificationsService.hideNotification(i)\"\n\n *ngFor=\"let notification of gravityInstantNotificationsService.notifications; index as i\">\n <main class=\"alert-content {{notification.state}}\">\n <gravity-icon class=\"close\" (click)=\"gravityInstantNotificationsService.hideNotification(i)\"\n data-cy=\"gravity_notification_instant_close_icon\" [iconName]=\"'
|
|
1434
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityNotificationInstantContainerComponent, selector: "gravity-notification-instant-container", inputs: { delay: "delay" }, ngImport: i0, template: "<ngb-toast [autohide]=\"true\"\n [delay]=\"delay\"\n\n (hidden)=\"gravityInstantNotificationsService.hideNotification(i)\"\n\n *ngFor=\"let notification of gravityInstantNotificationsService.notifications; index as i\">\n <main class=\"alert-content {{notification.state}}\">\n <gravity-icon class=\"close\" (click)=\"gravityInstantNotificationsService.hideNotification(i)\"\n data-cy=\"gravity_notification_instant_close_icon\" [iconName]=\"'unsuccess'\" [title]=\"'Close'\"></gravity-icon>\n\n <div class=\"title\">\n <gravity-icon class=\"title-icon\" [iconName]=\"'notification_' + notification.state\"></gravity-icon>\n <h1 class=\"hr-title lg-bold\">{{notification.title}}</h1>\n </div>\n\n <div class=\"content\">\n <h2 class=\"hr-body-text md-regular\">{{notification.text}}</h2>\n </div>\n </main>\n</ngb-toast>\n", styles: [".border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:50%}:host{padding:1rem;position:fixed;right:0;top:0;z-index:1200}main.alert-content{background-color:var(--bg-notification-primary);border-bottom:.75rem solid var(--notification-highlight-color);border-radius:.625rem;box-shadow:0 27px 34px #000c208f;color:var(--on-bg-notification-primary);margin-bottom:1rem;padding:1rem 1.5rem;position:relative;width:23rem}main.alert-content.success{--notification-highlight-color: var(--notification-success-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-success-primary);--notification-icon-color: var(--on-bg-icon-notification-success-primary)}main.alert-content.error{--notification-highlight-color: var(--notification-error-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-error-primary);--notification-icon-color: var(--on-bg-icon-notification-error-primary)}main.alert-content.warning{--notification-highlight-color: var(--notification-warning-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-warning-primary);--notification-icon-color: var(--on-bg-icon-notification-warning-primary)}gravity-icon.close{align-items:center;border-radius:50%;cursor:pointer;display:flex;height:2rem;line-height:0;justify-content:center;position:absolute;right:.75rem;top:.625rem;width:2rem}gravity-icon.close ::ng-deep svg-icon{--icon-color: var(--close-dialog-header-active-primary);--icon-height: 1.25rem;--icon-width: 1.25rem}gravity-icon.close:hover{background-color:var(--bg-close-dialog-header-hover-primary)}gravity-icon.close:hover ::ng-deep svg-icon{--icon-color: var(--close-dialog-header-hover-primary)}.title{align-items:center;display:flex}.title gravity-icon.title-icon{align-items:center;background-color:var(--notification-icon-background-color);border-radius:50%;display:flex;height:2rem;line-height:0;justify-content:center;margin-right:1rem;max-height:2rem;max-width:2rem;min-height:2rem;min-width:2rem;padding:.5rem;width:2rem}.title gravity-icon.title-icon ::ng-deep svg-icon{--icon-color: var(--notification-icon-color)}.content{margin-left:3rem}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i1$2.NgbToast, selector: "ngb-toast", inputs: ["animation", "delay", "autohide", "header"], outputs: ["shown", "hidden"], exportAs: ["ngbToast"] }, { kind: "component", type: GravityIconComponent, selector: "gravity-icon", inputs: ["customIconColorVariable", "iconName", "hoverIcon", "size"] }] }); }
|
|
1435
1435
|
}
|
|
1436
1436
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityNotificationInstantContainerComponent, decorators: [{
|
|
1437
1437
|
type: Component,
|
|
1438
|
-
args: [{ selector: 'gravity-notification-instant-container', template: "<ngb-toast [autohide]=\"true\"\n [delay]=\"delay\"\n\n (hidden)=\"gravityInstantNotificationsService.hideNotification(i)\"\n\n *ngFor=\"let notification of gravityInstantNotificationsService.notifications; index as i\">\n <main class=\"alert-content {{notification.state}}\">\n <gravity-icon class=\"close\" (click)=\"gravityInstantNotificationsService.hideNotification(i)\"\n data-cy=\"gravity_notification_instant_close_icon\" [iconName]=\"'
|
|
1438
|
+
args: [{ selector: 'gravity-notification-instant-container', template: "<ngb-toast [autohide]=\"true\"\n [delay]=\"delay\"\n\n (hidden)=\"gravityInstantNotificationsService.hideNotification(i)\"\n\n *ngFor=\"let notification of gravityInstantNotificationsService.notifications; index as i\">\n <main class=\"alert-content {{notification.state}}\">\n <gravity-icon class=\"close\" (click)=\"gravityInstantNotificationsService.hideNotification(i)\"\n data-cy=\"gravity_notification_instant_close_icon\" [iconName]=\"'unsuccess'\" [title]=\"'Close'\"></gravity-icon>\n\n <div class=\"title\">\n <gravity-icon class=\"title-icon\" [iconName]=\"'notification_' + notification.state\"></gravity-icon>\n <h1 class=\"hr-title lg-bold\">{{notification.title}}</h1>\n </div>\n\n <div class=\"content\">\n <h2 class=\"hr-body-text md-regular\">{{notification.text}}</h2>\n </div>\n </main>\n</ngb-toast>\n", styles: [".border-radius-none{border-radius:0}.border-radius-xs{border-radius:.0625rem}.border-radius-sm{border-radius:.3125rem}.border-radius-md{border-radius:.625rem}.border-radius-lg{border-radius:.9375rem}.border-radius-xl{border-radius:1.25rem}.border-radius-xxl{border-radius:2rem}.border-radius-rounded{border-radius:50%}:host{padding:1rem;position:fixed;right:0;top:0;z-index:1200}main.alert-content{background-color:var(--bg-notification-primary);border-bottom:.75rem solid var(--notification-highlight-color);border-radius:.625rem;box-shadow:0 27px 34px #000c208f;color:var(--on-bg-notification-primary);margin-bottom:1rem;padding:1rem 1.5rem;position:relative;width:23rem}main.alert-content.success{--notification-highlight-color: var(--notification-success-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-success-primary);--notification-icon-color: var(--on-bg-icon-notification-success-primary)}main.alert-content.error{--notification-highlight-color: var(--notification-error-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-error-primary);--notification-icon-color: var(--on-bg-icon-notification-error-primary)}main.alert-content.warning{--notification-highlight-color: var(--notification-warning-highlight-primary);--notification-icon-background-color: var(--bg-icon-notification-warning-primary);--notification-icon-color: var(--on-bg-icon-notification-warning-primary)}gravity-icon.close{align-items:center;border-radius:50%;cursor:pointer;display:flex;height:2rem;line-height:0;justify-content:center;position:absolute;right:.75rem;top:.625rem;width:2rem}gravity-icon.close ::ng-deep svg-icon{--icon-color: var(--close-dialog-header-active-primary);--icon-height: 1.25rem;--icon-width: 1.25rem}gravity-icon.close:hover{background-color:var(--bg-close-dialog-header-hover-primary)}gravity-icon.close:hover ::ng-deep svg-icon{--icon-color: var(--close-dialog-header-hover-primary)}.title{align-items:center;display:flex}.title gravity-icon.title-icon{align-items:center;background-color:var(--notification-icon-background-color);border-radius:50%;display:flex;height:2rem;line-height:0;justify-content:center;margin-right:1rem;max-height:2rem;max-width:2rem;min-height:2rem;min-width:2rem;padding:.5rem;width:2rem}.title gravity-icon.title-icon ::ng-deep svg-icon{--icon-color: var(--notification-icon-color)}.content{margin-left:3rem}\n"] }]
|
|
1439
1439
|
}], ctorParameters: function () { return [{ type: GravityInstantNotificationsService }]; }, propDecorators: { delay: [{
|
|
1440
1440
|
type: Input
|
|
1441
1441
|
}] } });
|
|
1442
1442
|
|
|
1443
1443
|
class GravityAttachFileComponent {
|
|
1444
1444
|
constructor() {
|
|
1445
|
-
this.
|
|
1445
|
+
this.fileValueAsBase64StringResponse = new EventEmitter();
|
|
1446
1446
|
this.currentLang = 'en';
|
|
1447
|
+
this.inputId = '';
|
|
1447
1448
|
this.state = "enabled";
|
|
1449
|
+
this.supportedTypes = '';
|
|
1450
|
+
}
|
|
1451
|
+
ngAfterViewInit() {
|
|
1452
|
+
if (this.supportedDocumentTypes) {
|
|
1453
|
+
this.supportedDocumentTypes.forEach((value, index) => {
|
|
1454
|
+
this.supportedTypes += value;
|
|
1455
|
+
if (index != this.supportedDocumentTypes.length - 1) {
|
|
1456
|
+
this.supportedTypes += ',';
|
|
1457
|
+
}
|
|
1458
|
+
});
|
|
1459
|
+
}
|
|
1460
|
+
else {
|
|
1461
|
+
this.supportedTypes = "*";
|
|
1462
|
+
}
|
|
1448
1463
|
}
|
|
1449
1464
|
handleFileInput($event) {
|
|
1450
1465
|
this.file = $event.target.files[0];
|
|
1451
1466
|
if (this.file) {
|
|
1452
1467
|
GravityAttachFileComponent.convertFileToBase64(this.file).then((base64String) => {
|
|
1453
|
-
this.
|
|
1468
|
+
this.fileValueAsBase64StringResponse.emit(base64String);
|
|
1454
1469
|
}).catch((error) => {
|
|
1455
1470
|
console.error('Error loading file:', error.message);
|
|
1456
1471
|
});
|
|
@@ -1472,27 +1487,31 @@ class GravityAttachFileComponent {
|
|
|
1472
1487
|
}
|
|
1473
1488
|
removeFile() {
|
|
1474
1489
|
this.file = null;
|
|
1475
|
-
this.
|
|
1490
|
+
this.fileValueAsBase64StringResponse.emit('');
|
|
1476
1491
|
}
|
|
1477
1492
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityAttachFileComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1478
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityAttachFileComponent, selector: "gravity-attach-file", inputs: { currentLang: "currentLang", cypressTag: "cypressTag", label: "label", required: "required", state: "state", supportTextContent: "supportTextContent", supportTextType: "supportTextType" }, outputs: {
|
|
1493
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityAttachFileComponent, selector: "gravity-attach-file", inputs: { currentLang: "currentLang", cypressTag: "cypressTag", inputId: "inputId", label: "label", required: "required", state: "state", supportedDocumentTypes: "supportedDocumentTypes", supportTextContent: "supportTextContent", supportTextType: "supportTextType" }, outputs: { fileValueAsBase64StringResponse: "response" }, ngImport: i0, template: "<label class=\"hr-body-text sm-regular {{state}}\" [class.empty]=\"!file\" [class.full-input]=\"file\" *ngIf=\"label\">\n {{label}}\n <ng-container *ngIf=\"required\">\n <ng-container *ngIf=\"currentLang == 'es'\">- Requerido <span class=\"text-negative\">*</span></ng-container>\n <ng-container *ngIf=\"currentLang == 'en'\">- Required <span class=\"text-negative\">*</span></ng-container>\n </ng-container>\n <ng-container *ngIf=\"state == 'readonly'\">\n <ng-container *ngIf=\"currentLang == 'es'\">- S\u00F3lo lectura</ng-container>\n <ng-container *ngIf=\"currentLang == 'en'\">- Readonly</ng-container>\n </ng-container>\n <ng-container *ngIf=\"state == 'disabled'\">\n <ng-container *ngIf=\"currentLang == 'es'\">- Deshabilitado</ng-container>\n <ng-container *ngIf=\"currentLang == 'en'\">- Disabled</ng-container>\n </ng-container>\n</label>\n<div class=\"gravity-attach-file {{state}}\" [class.empty]=\"!file\" [class.full-input]=\"file\">\n <ng-container *ngIf=\"!file\">\n <input autocomplete=\"off\" class=\"hr-label md-regular\" hidden id=\"fileInput-{{inputId}}\" type=\"file\"\n [accept]=\"supportedTypes\"\n [attr.data-cy]=\"cypressTag\"\n [attr.disabled]=\"state == 'disabled' ? true : null\"\n [attr.readonly]=\"state == 'readonly' ? true : null\"\n\n (change)=\"handleFileInput($event)\">\n <label for=\"fileInput-{{inputId}}\">\n <gravity-button [iconName]=\"'clip'\" [type]=\"'tertiary'\" [size]=\"'md'\">\n {{label}}\n </gravity-button>\n </label>\n </ng-container>\n <ng-container *ngIf=\"file\">\n <label>\n <gravity-button (click)=\"removeFile()\" [iconName]=\"'clip'\" [type]=\"'tertiary'\" [size]=\"'md'\">\n {{currentLang == 'en' ? 'Remove file' : 'Remover archivo'}}\n </gravity-button>\n </label>\n <h3 class=\"hr-body-text sm-bold\">{{currentLang == 'en' ? 'File' : 'Archivo'}}: {{file.name}}</h3>\n </ng-container>\n</div>\n<p class=\"hr-body-text sm-regular support-text text-{{supportTextType}}\" *ngIf=\"supportTextContent\">\n {{supportTextContent}}\n</p>\n", styles: [".text-negative{color:var(--negative-primary)}.text-neutro{color:var(--text-primary)}.text-positive{color:var(--positive-primary)}.support-text{margin-left:0;margin-top:.3125rem;padding-inline:1rem}:host{display:block}label{color:var(--text-field-label-color);margin-inline:1rem}label.empty.enabled{--text-field-label-color: var(--label-text-empty-enabled-primary)}label.empty.disabled{--text-field-label-color: var(--label-text-empty-disabled-primary)}label.full-input.enabled{--text-field-label-color: var(--label-text-full-enabled-primary)}label.full-input.disabled{--text-field-label-color: var(--label-text-full-disabled-primary)}label.full-input.readonly{--text-field-label-color: var(--label-text-full-read-only-primary)}.gravity-attach-file{align-items:center;display:flex}.gravity-attach-file label{cursor:pointer}.gravity-attach-file label:hover gravity-button ::ng-deep button{--button-background-color: var(--bg-button-hover-tertiary);--button-border-color: var(--bg-button-hover-tertiary);--button-text-color: var(--on-bg-button-hover-tertiary)}gravity-button,gravity-button ::ng-deep button{pointer-events:none}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: GravityButtonComponent, selector: "gravity-button", inputs: ["cypressTag", "disabled", "customState", "iconName", "isLoading", "showContent", "size", "type"] }] }); }
|
|
1479
1494
|
}
|
|
1480
1495
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityAttachFileComponent, decorators: [{
|
|
1481
1496
|
type: Component,
|
|
1482
|
-
args: [{ selector: 'gravity-attach-file', template: "<label class=\"hr-body-text sm-regular {{state}}\" [class.empty]=\"!file\" [class.full-input]=\"file\" *ngIf=\"label\">\n {{label}}\n <ng-container *ngIf=\"required\">\n <ng-container *ngIf=\"currentLang == 'es'\">- Requerido <span class=\"text-negative\">*</span></ng-container>\n <ng-container *ngIf=\"currentLang == 'en'\">- Required <span class=\"text-negative\">*</span></ng-container>\n </ng-container>\n <ng-container *ngIf=\"state == 'readonly'\">\n <ng-container *ngIf=\"currentLang == 'es'\">- S\u00F3lo lectura</ng-container>\n <ng-container *ngIf=\"currentLang == 'en'\">- Readonly</ng-container>\n </ng-container>\n <ng-container *ngIf=\"state == 'disabled'\">\n <ng-container *ngIf=\"currentLang == 'es'\">- Deshabilitado</ng-container>\n <ng-container *ngIf=\"currentLang == 'en'\">- Disabled</ng-container>\n </ng-container>\n</label>\n<div class=\"gravity-attach-file {{state}}\" [class.empty]=\"!file\" [class.full-input]=\"file\">\n <ng-container *ngIf=\"!file\">\n <input autocomplete=\"off\" class=\"hr-label md-regular\" hidden id=\"fileInput\" type=\"file\"\n [attr.data-cy]=\"cypressTag\"\n [attr.disabled]=\"state == 'disabled' ? true : null\"\n [attr.readonly]=\"state == 'readonly' ? true : null\"\n\n (change)=\"handleFileInput($event)\">\n <label for=\"fileInput\">\n <gravity-button [iconName]=\"'clip'\" [type]=\"'tertiary'\" [size]=\"'md'\">\n {{label}}\n </gravity-button>\n </label>\n </ng-container>\n <ng-container *ngIf=\"file\">\n <label>\n <gravity-button (click)=\"removeFile()\" [iconName]=\"'clip'\" [type]=\"'tertiary'\" [size]=\"'md'\">\n {{currentLang == 'en' ? 'Remove file' : 'Remover archivo'}}\n </gravity-button>\n </label>\n <h3>{{currentLang == 'en' ? 'File' : 'Archivo'}}: {{file.name}}</h3>\n </ng-container>\n</div>\n<p class=\"hr-body-text sm-regular support-text text-{{supportTextType}}\" *ngIf=\"supportTextContent\">\n {{supportTextContent}}\n</p>\n", styles: [".text-negative{color:var(--negative-primary)}.text-neutro{color:var(--text-primary)}.text-positive{color:var(--positive-primary)}.support-text{margin-left:0;margin-top:.3125rem;padding-inline:1rem}:host{display:block}label{color:var(--text-field-label-color);margin-inline:1rem}label.empty.enabled{--text-field-label-color: var(--label-text-empty-enabled-primary)}label.empty.disabled{--text-field-label-color: var(--label-text-empty-disabled-primary)}label.full-input.enabled{--text-field-label-color: var(--label-text-full-enabled-primary)}label.full-input.disabled{--text-field-label-color: var(--label-text-full-disabled-primary)}label.full-input.readonly{--text-field-label-color: var(--label-text-full-read-only-primary)}.gravity-attach-file{align-items:center;display:flex}.gravity-attach-file label{cursor:pointer}.gravity-attach-file label:hover gravity-button ::ng-deep button{--button-background-color: var(--bg-button-hover-tertiary);--button-border-color: var(--bg-button-hover-tertiary);--button-text-color: var(--on-bg-button-hover-tertiary)}gravity-button,gravity-button ::ng-deep button{pointer-events:none}\n"] }]
|
|
1483
|
-
}], propDecorators: {
|
|
1497
|
+
args: [{ selector: 'gravity-attach-file', template: "<label class=\"hr-body-text sm-regular {{state}}\" [class.empty]=\"!file\" [class.full-input]=\"file\" *ngIf=\"label\">\n {{label}}\n <ng-container *ngIf=\"required\">\n <ng-container *ngIf=\"currentLang == 'es'\">- Requerido <span class=\"text-negative\">*</span></ng-container>\n <ng-container *ngIf=\"currentLang == 'en'\">- Required <span class=\"text-negative\">*</span></ng-container>\n </ng-container>\n <ng-container *ngIf=\"state == 'readonly'\">\n <ng-container *ngIf=\"currentLang == 'es'\">- S\u00F3lo lectura</ng-container>\n <ng-container *ngIf=\"currentLang == 'en'\">- Readonly</ng-container>\n </ng-container>\n <ng-container *ngIf=\"state == 'disabled'\">\n <ng-container *ngIf=\"currentLang == 'es'\">- Deshabilitado</ng-container>\n <ng-container *ngIf=\"currentLang == 'en'\">- Disabled</ng-container>\n </ng-container>\n</label>\n<div class=\"gravity-attach-file {{state}}\" [class.empty]=\"!file\" [class.full-input]=\"file\">\n <ng-container *ngIf=\"!file\">\n <input autocomplete=\"off\" class=\"hr-label md-regular\" hidden id=\"fileInput-{{inputId}}\" type=\"file\"\n [accept]=\"supportedTypes\"\n [attr.data-cy]=\"cypressTag\"\n [attr.disabled]=\"state == 'disabled' ? true : null\"\n [attr.readonly]=\"state == 'readonly' ? true : null\"\n\n (change)=\"handleFileInput($event)\">\n <label for=\"fileInput-{{inputId}}\">\n <gravity-button [iconName]=\"'clip'\" [type]=\"'tertiary'\" [size]=\"'md'\">\n {{label}}\n </gravity-button>\n </label>\n </ng-container>\n <ng-container *ngIf=\"file\">\n <label>\n <gravity-button (click)=\"removeFile()\" [iconName]=\"'clip'\" [type]=\"'tertiary'\" [size]=\"'md'\">\n {{currentLang == 'en' ? 'Remove file' : 'Remover archivo'}}\n </gravity-button>\n </label>\n <h3 class=\"hr-body-text sm-bold\">{{currentLang == 'en' ? 'File' : 'Archivo'}}: {{file.name}}</h3>\n </ng-container>\n</div>\n<p class=\"hr-body-text sm-regular support-text text-{{supportTextType}}\" *ngIf=\"supportTextContent\">\n {{supportTextContent}}\n</p>\n", styles: [".text-negative{color:var(--negative-primary)}.text-neutro{color:var(--text-primary)}.text-positive{color:var(--positive-primary)}.support-text{margin-left:0;margin-top:.3125rem;padding-inline:1rem}:host{display:block}label{color:var(--text-field-label-color);margin-inline:1rem}label.empty.enabled{--text-field-label-color: var(--label-text-empty-enabled-primary)}label.empty.disabled{--text-field-label-color: var(--label-text-empty-disabled-primary)}label.full-input.enabled{--text-field-label-color: var(--label-text-full-enabled-primary)}label.full-input.disabled{--text-field-label-color: var(--label-text-full-disabled-primary)}label.full-input.readonly{--text-field-label-color: var(--label-text-full-read-only-primary)}.gravity-attach-file{align-items:center;display:flex}.gravity-attach-file label{cursor:pointer}.gravity-attach-file label:hover gravity-button ::ng-deep button{--button-background-color: var(--bg-button-hover-tertiary);--button-border-color: var(--bg-button-hover-tertiary);--button-text-color: var(--on-bg-button-hover-tertiary)}gravity-button,gravity-button ::ng-deep button{pointer-events:none}\n"] }]
|
|
1498
|
+
}], propDecorators: { fileValueAsBase64StringResponse: [{
|
|
1484
1499
|
type: Output,
|
|
1485
1500
|
args: ['response']
|
|
1486
1501
|
}], currentLang: [{
|
|
1487
1502
|
type: Input
|
|
1488
1503
|
}], cypressTag: [{
|
|
1489
1504
|
type: Input
|
|
1505
|
+
}], inputId: [{
|
|
1506
|
+
type: Input
|
|
1490
1507
|
}], label: [{
|
|
1491
1508
|
type: Input
|
|
1492
1509
|
}], required: [{
|
|
1493
1510
|
type: Input
|
|
1494
1511
|
}], state: [{
|
|
1495
1512
|
type: Input
|
|
1513
|
+
}], supportedDocumentTypes: [{
|
|
1514
|
+
type: Input
|
|
1496
1515
|
}], supportTextContent: [{
|
|
1497
1516
|
type: Input
|
|
1498
1517
|
}], supportTextType: [{
|
|
@@ -1690,11 +1709,11 @@ class GravityTableComponent {
|
|
|
1690
1709
|
}
|
|
1691
1710
|
}
|
|
1692
1711
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityTableComponent, deps: [{ token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1693
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityTableComponent, selector: "gravity-table", inputs: { tableDensity: "tableDensity", tableSizeInput: "tableSizeInput" }, host: { listeners: { "window:resize": "onResize($event)" } }, viewQueries: [{ propertyName: "tableContainer", first: true, predicate: ["tableContainer"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"table-container {{tableSize}}\" #tableContainer>\n <ng-content></ng-content>\n</div>\n\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n", styles: [".table-container{overflow-x:auto}\n"], dependencies: [{ kind: "component", type: GravityButtonComponent, selector: "gravity-button", inputs: ["cypressTag", "disabled", "customState", "iconName", "isLoading", "showContent", "size", "type"] }] }); }
|
|
1712
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.12", type: GravityTableComponent, selector: "gravity-table", inputs: { tableDensity: "tableDensity", tableSizeInput: "tableSizeInput" }, host: { listeners: { "window:resize": "onResize($event)" } }, viewQueries: [{ propertyName: "tableContainer", first: true, predicate: ["tableContainer"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"table-container {{tableSize}}\" #tableContainer>\n <ng-content></ng-content>\n</div>\n\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n", styles: [".table-container{overflow-x:auto}\n"], dependencies: [{ kind: "component", type: GravityButtonComponent, selector: "gravity-button", inputs: ["cypressTag", "disabled", "customState", "iconName", "isLoading", "showContent", "size", "type"] }] }); }
|
|
1694
1713
|
}
|
|
1695
1714
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: GravityTableComponent, decorators: [{
|
|
1696
1715
|
type: Component,
|
|
1697
|
-
args: [{ selector: 'gravity-table', template: "<div class=\"table-container {{tableSize}}\" #tableContainer>\n <ng-content></ng-content>\n</div>\n\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n", styles: [".table-container{overflow-x:auto}\n"] }]
|
|
1716
|
+
args: [{ selector: 'gravity-table', template: "<div class=\"table-container {{tableSize}}\" #tableContainer>\n <ng-content></ng-content>\n</div>\n\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n<gravity-button id-reference=\"close-button\" [iconName]=\"'unsuccess'\" [type]=\"'tertiary'\" [size]=\"'sm'\">Close menu</gravity-button>\n", styles: [".table-container{overflow-x:auto}\n"] }]
|
|
1698
1717
|
}], ctorParameters: function () { return [{ type: i0.Renderer2 }]; }, propDecorators: { tableDensity: [{
|
|
1699
1718
|
type: Input
|
|
1700
1719
|
}], tableSizeInput: [{
|