@impartner/design-components 1.1.0 → 1.1.2
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/esm2020/lib/avatar/avatar.component.mjs +4 -3
- package/esm2020/lib/avatar/avatar.module.mjs +6 -5
- package/esm2020/lib/badge/badge.component.mjs +4 -3
- package/esm2020/lib/badge/badge.module.mjs +6 -5
- package/esm2020/lib/data-card/data-card.component.mjs +4 -3
- package/esm2020/lib/data-card/data-card.module.mjs +6 -5
- package/esm2020/lib/file-upload/file-upload.component.mjs +6 -5
- package/esm2020/lib/file-upload/file-upload.module.mjs +7 -6
- package/esm2020/lib/form-field/controls/select/option/select-option.component.mjs +4 -3
- package/esm2020/lib/form-field/controls/select/select.module.mjs +15 -5
- package/esm2020/lib/icon/icon.component.mjs +6 -4
- package/esm2020/lib/pagination/pagination.component.mjs +6 -5
- package/esm2020/lib/pagination/pagination.module.mjs +20 -5
- package/esm2020/lib/scrollable/scrollable.component.mjs +3 -3
- package/esm2020/lib/select-icon/select-icon.component.mjs +7 -6
- package/fesm2015/impartner-design-components.mjs +68 -43
- package/fesm2015/impartner-design-components.mjs.map +1 -1
- package/fesm2020/impartner-design-components.mjs +68 -43
- package/fesm2020/impartner-design-components.mjs.map +1 -1
- package/lib/avatar/avatar.module.d.ts +2 -1
- package/lib/badge/badge.module.d.ts +2 -1
- package/lib/data-card/data-card.module.d.ts +2 -1
- package/lib/file-upload/file-upload.module.d.ts +2 -1
- package/lib/form-field/controls/select/select.module.d.ts +2 -1
- package/lib/icon/icon.component.d.ts +3 -1
- package/lib/pagination/pagination.module.d.ts +2 -1
- package/package.json +1 -1
|
@@ -3202,7 +3202,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
3202
3202
|
* To use, import `IconModule` or another module that imports and exports that module from `@impartner/design-components`.
|
|
3203
3203
|
*/
|
|
3204
3204
|
class IconComponent {
|
|
3205
|
-
constructor() {
|
|
3205
|
+
constructor(_changeDetectorRef) {
|
|
3206
|
+
this._changeDetectorRef = _changeDetectorRef;
|
|
3206
3207
|
this._loading = true;
|
|
3207
3208
|
this._licensed = false;
|
|
3208
3209
|
/**
|
|
@@ -3248,16 +3249,17 @@ class IconComponent {
|
|
|
3248
3249
|
if (iconFontFamily.includes('Font Awesome')) {
|
|
3249
3250
|
this._licensed = !iconFontFamily.includes('Free');
|
|
3250
3251
|
this._loading = false;
|
|
3252
|
+
this._changeDetectorRef.detectChanges();
|
|
3251
3253
|
}
|
|
3252
3254
|
}
|
|
3253
3255
|
}
|
|
3254
3256
|
}
|
|
3255
|
-
IconComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: IconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3257
|
+
IconComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: IconComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
3256
3258
|
IconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: IconComponent, selector: "impdc-icon, [impdc-icon]", inputs: { name: "name", theme: "theme", size: "size" }, viewQueries: [{ propertyName: "iconRef", first: true, predicate: ["icon"], descendants: true, static: true }], ngImport: i0, template: "<i\n #icon\n class=\"{{ typeClass }} fa-{{ name }}\"\n [style.font-size]=\"computedSize\"></i>\n", encapsulation: i0.ViewEncapsulation.None });
|
|
3257
3259
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: IconComponent, decorators: [{
|
|
3258
3260
|
type: Component,
|
|
3259
3261
|
args: [{ selector: 'impdc-icon, [impdc-icon]', encapsulation: ViewEncapsulation.None, template: "<i\n #icon\n class=\"{{ typeClass }} fa-{{ name }}\"\n [style.font-size]=\"computedSize\"></i>\n" }]
|
|
3260
|
-
}], propDecorators: { name: [{
|
|
3262
|
+
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { name: [{
|
|
3261
3263
|
type: Input
|
|
3262
3264
|
}], theme: [{
|
|
3263
3265
|
type: Input
|
|
@@ -5844,7 +5846,7 @@ class SelectOptionComponent extends NgbDropdownItem {
|
|
|
5844
5846
|
}
|
|
5845
5847
|
}
|
|
5846
5848
|
SelectOptionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: SelectOptionComponent, deps: [{ token: IMPDC_SELECT_OPTION_PARENT_COMPONENT, optional: true }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
|
|
5847
|
-
SelectOptionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: SelectOptionComponent, selector: "impdc-select-option", inputs: { value: "value", label: "label", id: "id", disabled: "disabled" }, outputs: { onSelectionChange: "onSelectionChange" }, host: { listeners: { "click": "_selectViaInteraction()", "keydown": "_handleKeydown($event)" }, properties: { "class.impdc-select-option--single": "!multiple", "class.impdc-select-option--multiple": "multiple", "class.impdc-select-option--selected": "selected" } }, usesInheritance: true, ngImport: i0, template: "<ng-template #singleSelectTemplate>\n <span>{{ label || ' ' }}</span>\n <span
|
|
5849
|
+
SelectOptionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: SelectOptionComponent, selector: "impdc-select-option", inputs: { value: "value", label: "label", id: "id", disabled: "disabled" }, outputs: { onSelectionChange: "onSelectionChange" }, host: { listeners: { "click": "_selectViaInteraction()", "keydown": "_handleKeydown($event)" }, properties: { "class.impdc-select-option--single": "!multiple", "class.impdc-select-option--multiple": "multiple", "class.impdc-select-option--selected": "selected" } }, usesInheritance: true, ngImport: i0, template: "<ng-template #singleSelectTemplate>\n <span>{{ label || ' ' }}</span>\n <span\n *ngIf=\"selected\"\n impdc-icon\n name=\"check\"\n class=\"selected-check ms-auto\"></span>\n</ng-template>\n\n<ng-template #multipleSelectTemplate>\n <div class=\"d-flex align-items-center gap-5\">\n <span>\n <input\n class=\"form-check-input opacity-100\"\n type=\"checkbox\"\n disabled\n readonly=\"readonly\"\n [attr.checked]=\"selected ? 'checked' : null\" />\n </span>\n <span>\n {{ label }}\n </span>\n </div>\n</ng-template>\n\n<ng-template\n [ngTemplateOutlet]=\"\n multiple ? multipleSelectTemplate : singleSelectTemplate\n \"></ng-template>\n", styles: [":host{background-color:var(--impd-color-white);color:var(--impd-color-gray-600);padding:var(--impd-size-2) var(--impd-size-3);white-space:nowrap;text-overflow:ellipsis;overflow:hidden;display:flex!important;align-items:center;column-gap:var(--impd-size-2);cursor:pointer}:host:hover,:host:focus{background-color:var(--impd-color-gray-100);border:0;outline:0}:host.impdc-select-option--selected{font-weight:var(--impd-font-weight-semibold)}:host.impdc-select-option--single .selected-check{display:none}:host.impdc-select-option--single.impdc-select-option--selected{background-color:var(--impd-color-motion-blue-600);color:var(--impd-color-white)}:host.impdc-select-option--single.impdc-select-option--selected:hover,:host.impdc-select-option--single.impdc-select-option--selected:focus{background:linear-gradient(to top,rgba(0,0,0,.1),rgba(0,0,0,.1)) var(--impd-color-motion-blue-600);color:var(--impd-color-white);border:0;outline:0}:host.impdc-select-option--single.impdc-select-option--selected .selected-check{display:inline-block}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: IconComponent, selector: "impdc-icon, [impdc-icon]", inputs: ["name", "theme", "size"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
5848
5850
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: SelectOptionComponent, decorators: [{
|
|
5849
5851
|
type: Component,
|
|
5850
5852
|
args: [{ selector: 'impdc-select-option', changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
@@ -5853,7 +5855,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
5853
5855
|
'[class.impdc-select-option--selected]': 'selected',
|
|
5854
5856
|
'(click)': '_selectViaInteraction()',
|
|
5855
5857
|
'(keydown)': '_handleKeydown($event)'
|
|
5856
|
-
}, template: "<ng-template #singleSelectTemplate>\n <span>{{ label || ' ' }}</span>\n <span
|
|
5858
|
+
}, template: "<ng-template #singleSelectTemplate>\n <span>{{ label || ' ' }}</span>\n <span\n *ngIf=\"selected\"\n impdc-icon\n name=\"check\"\n class=\"selected-check ms-auto\"></span>\n</ng-template>\n\n<ng-template #multipleSelectTemplate>\n <div class=\"d-flex align-items-center gap-5\">\n <span>\n <input\n class=\"form-check-input opacity-100\"\n type=\"checkbox\"\n disabled\n readonly=\"readonly\"\n [attr.checked]=\"selected ? 'checked' : null\" />\n </span>\n <span>\n {{ label }}\n </span>\n </div>\n</ng-template>\n\n<ng-template\n [ngTemplateOutlet]=\"\n multiple ? multipleSelectTemplate : singleSelectTemplate\n \"></ng-template>\n", styles: [":host{background-color:var(--impd-color-white);color:var(--impd-color-gray-600);padding:var(--impd-size-2) var(--impd-size-3);white-space:nowrap;text-overflow:ellipsis;overflow:hidden;display:flex!important;align-items:center;column-gap:var(--impd-size-2);cursor:pointer}:host:hover,:host:focus{background-color:var(--impd-color-gray-100);border:0;outline:0}:host.impdc-select-option--selected{font-weight:var(--impd-font-weight-semibold)}:host.impdc-select-option--single .selected-check{display:none}:host.impdc-select-option--single.impdc-select-option--selected{background-color:var(--impd-color-motion-blue-600);color:var(--impd-color-white)}:host.impdc-select-option--single.impdc-select-option--selected:hover,:host.impdc-select-option--single.impdc-select-option--selected:focus{background:linear-gradient(to top,rgba(0,0,0,.1),rgba(0,0,0,.1)) var(--impd-color-motion-blue-600);color:var(--impd-color-white);border:0;outline:0}:host.impdc-select-option--single.impdc-select-option--selected .selected-check{display:inline-block}\n"] }]
|
|
5857
5859
|
}], ctorParameters: function () { return [{ type: undefined, decorators: [{
|
|
5858
5860
|
type: Optional
|
|
5859
5861
|
}, {
|
|
@@ -6529,14 +6531,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
6529
6531
|
class SelectModule {
|
|
6530
6532
|
}
|
|
6531
6533
|
SelectModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: SelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
6532
|
-
SelectModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: SelectModule, declarations: [SelectOptionComponent, SelectComponent], imports: [CommonModule, NgbDropdownModule], exports: [
|
|
6533
|
-
|
|
6534
|
+
SelectModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: SelectModule, declarations: [SelectOptionComponent, SelectComponent], imports: [CommonModule, NgbDropdownModule, IconModule], exports: [NgbDropdownModule,
|
|
6535
|
+
IconModule,
|
|
6536
|
+
SelectOptionComponent,
|
|
6537
|
+
SelectComponent] });
|
|
6538
|
+
SelectModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: SelectModule, imports: [CommonModule, NgbDropdownModule, IconModule, NgbDropdownModule,
|
|
6539
|
+
IconModule] });
|
|
6534
6540
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: SelectModule, decorators: [{
|
|
6535
6541
|
type: NgModule,
|
|
6536
6542
|
args: [{
|
|
6543
|
+
imports: [CommonModule, NgbDropdownModule, IconModule],
|
|
6537
6544
|
declarations: [SelectOptionComponent, SelectComponent],
|
|
6538
|
-
|
|
6539
|
-
|
|
6545
|
+
exports: [
|
|
6546
|
+
NgbDropdownModule,
|
|
6547
|
+
IconModule,
|
|
6548
|
+
SelectOptionComponent,
|
|
6549
|
+
SelectComponent
|
|
6550
|
+
]
|
|
6540
6551
|
}]
|
|
6541
6552
|
}] });
|
|
6542
6553
|
|
|
@@ -6992,7 +7003,7 @@ FileUploadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ve
|
|
|
6992
7003
|
provide: ImpdcFormFieldControl,
|
|
6993
7004
|
useExisting: FileUploadComponent
|
|
6994
7005
|
}
|
|
6995
|
-
], viewQueries: [{ propertyName: "fileDropElementRef", first: true, predicate: FileDropDirective, descendants: true, read: ElementRef }, { propertyName: "fileUploadInputEltRef", first: true, predicate: ["fileUploadInputElt"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"impdc-file-upload-container\">\n <div\n class=\"impdc-file-upload-dropzone\"\n [ngClass]=\"{\n 'hide-upload': !canUpload\n }\"\n impdcFileDrop\n (filesDropped)=\"handleDrop($event)\"\n (keyup.enter)=\"fileUploadInputElt.click()\"\n (focus)=\"_onFocus()\"\n (blur)=\"_onBlur()\"\n [tabindex]=\"disabled ? '-1' : '0'\">\n <input\n class=\"file-upload-input\"\n type=\"file\"\n #fileUploadInputElt\n [multiple]=\"multiple\"\n [disabled]=\"disabled\"\n [accept]=\"accept\"\n (change)=\"handleChange($event)\"\n tabindex=\"-1\" />\n <span
|
|
7006
|
+
], viewQueries: [{ propertyName: "fileDropElementRef", first: true, predicate: FileDropDirective, descendants: true, read: ElementRef }, { propertyName: "fileUploadInputEltRef", first: true, predicate: ["fileUploadInputElt"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"impdc-file-upload-container\">\n <div\n class=\"impdc-file-upload-dropzone\"\n [ngClass]=\"{\n 'hide-upload': !canUpload\n }\"\n impdcFileDrop\n (filesDropped)=\"handleDrop($event)\"\n (keyup.enter)=\"fileUploadInputElt.click()\"\n (focus)=\"_onFocus()\"\n (blur)=\"_onBlur()\"\n [tabindex]=\"disabled ? '-1' : '0'\">\n <input\n class=\"file-upload-input\"\n type=\"file\"\n #fileUploadInputElt\n [multiple]=\"multiple\"\n [disabled]=\"disabled\"\n [accept]=\"accept\"\n (change)=\"handleChange($event)\"\n tabindex=\"-1\" />\n <span\n impdc-icon\n theme=\"regular\"\n name=\"cloud-upload-alt\"\n class=\"upload-icon\"></span>\n <p class=\"upload-text\">{{ uploadText }}</p>\n </div>\n <div class=\"current-files\" *ngIf=\"filesForDisplay.length\">\n <ng-container *ngFor=\"let file of filesForDisplay; let idx = index\">\n <div class=\"current-file\">\n <div class=\"current-file-details\">\n <div class=\"name\">{{ file.name }}</div>\n <div class=\"size\">{{ file.size | humanReadableByteSize }}</div>\n </div>\n <div *ngIf=\"!disabled\" class=\"current-file-actions\">\n <button\n impdcButton\n theme=\"close\"\n tabindex=\"0\"\n (keyup.enter)=\"removeFile(idx)\"\n (click)=\"removeFile(idx)\"></button>\n </div>\n </div>\n </ng-container>\n </div>\n</div>\n", styles: [":host{display:block}:host.impdc-file-upload--invalid .impdc-file-upload-dropzone{color:var(--impd-color-red-500);border-color:var(--impd-color-red-500)}:host.impdc-file-upload--invalid .impdc-file-upload-dropzone .upload-text{color:var(--impd-color-red-900)}:host.impdc-file-upload--invalid .impdc-file-upload-container .current-files .current-file{border-color:var(--impd-color-red-500)}:host.impdc-file-upload--disabled .impdc-file-upload-dropzone{color:var(--impd-color-gray-300);background-color:var(--impd-color-gray-50)}:host:not(.impdc-file-upload--disabled) .impdc-file-upload-dropzone:focus,:host:not(.impdc-file-upload--disabled) .impdc-file-upload-dropzone:has(label > button:focus){background-color:var(--impd-color-gray-50);border:2px solid var(--impd-color-motion-blue-500);border-radius:var(--impd-border-radius-md);outline:none}.impdc-file-upload-container{display:flex;flex-direction:column;gap:var(--impd-size-2);width:100%}.impdc-file-upload-container .file-hover:not(.disabled){background-color:var(--impd-color-gray-50);border:2px solid var(--impd-color-motion-blue-500);border-radius:var(--impd-border-radius-md);outline:none}.impdc-file-upload-container .current-files{display:flex;flex-direction:column;gap:var(--impd-size-2)}.impdc-file-upload-container .current-files .current-file{display:inline-flex;background-color:var(--impd-color-gray-50);padding:var(--impd-size-4);gap:var(--impd-size-4);border-radius:var(--impd-border-radius-md);border:1px solid var(--impd-color-gray-200);justify-content:space-between;align-items:center;color:var(--impd-color-gray-600)}.impdc-file-upload-container .current-files .current-file .current-file-details{display:flex;flex-direction:column}.impdc-file-upload-container .current-files .current-file .current-file-details .name{color:var(--impd-color-gray-900);font-size:1.4rem;font-weight:500}.impdc-file-upload-container .current-files .current-file .current-file-details .size{font-size:1.4rem}.impdc-file-upload-container .current-files .current-file .current-file-actions .btn.btn-close-fa{color:var(--impd-color-gray-600)}.impdc-file-upload-dropzone{position:relative;display:flex;flex-direction:column;width:100%;min-height:10rem;padding:3.2rem 1.6rem;gap:2rem;align-items:center;justify-content:center;text-align:center;border:2px dashed var(--impd-color-gray-200);color:var(--impd-color-motion-blue-600);border-radius:5px}.impdc-file-upload-dropzone.hide-upload{display:none}.impdc-file-upload-dropzone .upload-icon{font-size:33px;color:inherit}.impdc-file-upload-dropzone .upload-text{margin:0;font-size:14px;line-height:20px;color:inherit}.impdc-file-upload-dropzone .button-text{border-color:var(--impd-color-motion-blue-600);background-color:var(--impd-color-motion-blue-600);color:#fff}.impdc-file-upload-dropzone input{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;z-index:2;cursor:pointer}.impdc-file-upload-dropzone input:disabled{cursor:default}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ButtonComponent, selector: "button[impdcButton]", inputs: ["type", "theme", "text", "disabled", "titleText", "ariaLabel"] }, { kind: "component", type: IconComponent, selector: "impdc-icon, [impdc-icon]", inputs: ["name", "theme", "size"] }, { kind: "directive", type: FileDropDirective, selector: "[impdcFileDrop]", outputs: ["filesDropped"] }, { kind: "pipe", type: HumanReadableByteSizePipe, name: "humanReadableByteSize" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
6996
7007
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: FileUploadComponent, decorators: [{
|
|
6997
7008
|
type: Component,
|
|
6998
7009
|
args: [{ selector: 'impdc-file-upload, [impdc-file-upload]', inputs: ['disabled', 'tabIndex'], changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
@@ -7013,7 +7024,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
7013
7024
|
provide: ImpdcFormFieldControl,
|
|
7014
7025
|
useExisting: FileUploadComponent
|
|
7015
7026
|
}
|
|
7016
|
-
], template: "<div class=\"impdc-file-upload-container\">\n <div\n class=\"impdc-file-upload-dropzone\"\n [ngClass]=\"{\n 'hide-upload': !canUpload\n }\"\n impdcFileDrop\n (filesDropped)=\"handleDrop($event)\"\n (keyup.enter)=\"fileUploadInputElt.click()\"\n (focus)=\"_onFocus()\"\n (blur)=\"_onBlur()\"\n [tabindex]=\"disabled ? '-1' : '0'\">\n <input\n class=\"file-upload-input\"\n type=\"file\"\n #fileUploadInputElt\n [multiple]=\"multiple\"\n [disabled]=\"disabled\"\n [accept]=\"accept\"\n (change)=\"handleChange($event)\"\n tabindex=\"-1\" />\n <span
|
|
7027
|
+
], template: "<div class=\"impdc-file-upload-container\">\n <div\n class=\"impdc-file-upload-dropzone\"\n [ngClass]=\"{\n 'hide-upload': !canUpload\n }\"\n impdcFileDrop\n (filesDropped)=\"handleDrop($event)\"\n (keyup.enter)=\"fileUploadInputElt.click()\"\n (focus)=\"_onFocus()\"\n (blur)=\"_onBlur()\"\n [tabindex]=\"disabled ? '-1' : '0'\">\n <input\n class=\"file-upload-input\"\n type=\"file\"\n #fileUploadInputElt\n [multiple]=\"multiple\"\n [disabled]=\"disabled\"\n [accept]=\"accept\"\n (change)=\"handleChange($event)\"\n tabindex=\"-1\" />\n <span\n impdc-icon\n theme=\"regular\"\n name=\"cloud-upload-alt\"\n class=\"upload-icon\"></span>\n <p class=\"upload-text\">{{ uploadText }}</p>\n </div>\n <div class=\"current-files\" *ngIf=\"filesForDisplay.length\">\n <ng-container *ngFor=\"let file of filesForDisplay; let idx = index\">\n <div class=\"current-file\">\n <div class=\"current-file-details\">\n <div class=\"name\">{{ file.name }}</div>\n <div class=\"size\">{{ file.size | humanReadableByteSize }}</div>\n </div>\n <div *ngIf=\"!disabled\" class=\"current-file-actions\">\n <button\n impdcButton\n theme=\"close\"\n tabindex=\"0\"\n (keyup.enter)=\"removeFile(idx)\"\n (click)=\"removeFile(idx)\"></button>\n </div>\n </div>\n </ng-container>\n </div>\n</div>\n", styles: [":host{display:block}:host.impdc-file-upload--invalid .impdc-file-upload-dropzone{color:var(--impd-color-red-500);border-color:var(--impd-color-red-500)}:host.impdc-file-upload--invalid .impdc-file-upload-dropzone .upload-text{color:var(--impd-color-red-900)}:host.impdc-file-upload--invalid .impdc-file-upload-container .current-files .current-file{border-color:var(--impd-color-red-500)}:host.impdc-file-upload--disabled .impdc-file-upload-dropzone{color:var(--impd-color-gray-300);background-color:var(--impd-color-gray-50)}:host:not(.impdc-file-upload--disabled) .impdc-file-upload-dropzone:focus,:host:not(.impdc-file-upload--disabled) .impdc-file-upload-dropzone:has(label > button:focus){background-color:var(--impd-color-gray-50);border:2px solid var(--impd-color-motion-blue-500);border-radius:var(--impd-border-radius-md);outline:none}.impdc-file-upload-container{display:flex;flex-direction:column;gap:var(--impd-size-2);width:100%}.impdc-file-upload-container .file-hover:not(.disabled){background-color:var(--impd-color-gray-50);border:2px solid var(--impd-color-motion-blue-500);border-radius:var(--impd-border-radius-md);outline:none}.impdc-file-upload-container .current-files{display:flex;flex-direction:column;gap:var(--impd-size-2)}.impdc-file-upload-container .current-files .current-file{display:inline-flex;background-color:var(--impd-color-gray-50);padding:var(--impd-size-4);gap:var(--impd-size-4);border-radius:var(--impd-border-radius-md);border:1px solid var(--impd-color-gray-200);justify-content:space-between;align-items:center;color:var(--impd-color-gray-600)}.impdc-file-upload-container .current-files .current-file .current-file-details{display:flex;flex-direction:column}.impdc-file-upload-container .current-files .current-file .current-file-details .name{color:var(--impd-color-gray-900);font-size:1.4rem;font-weight:500}.impdc-file-upload-container .current-files .current-file .current-file-details .size{font-size:1.4rem}.impdc-file-upload-container .current-files .current-file .current-file-actions .btn.btn-close-fa{color:var(--impd-color-gray-600)}.impdc-file-upload-dropzone{position:relative;display:flex;flex-direction:column;width:100%;min-height:10rem;padding:3.2rem 1.6rem;gap:2rem;align-items:center;justify-content:center;text-align:center;border:2px dashed var(--impd-color-gray-200);color:var(--impd-color-motion-blue-600);border-radius:5px}.impdc-file-upload-dropzone.hide-upload{display:none}.impdc-file-upload-dropzone .upload-icon{font-size:33px;color:inherit}.impdc-file-upload-dropzone .upload-text{margin:0;font-size:14px;line-height:20px;color:inherit}.impdc-file-upload-dropzone .button-text{border-color:var(--impd-color-motion-blue-600);background-color:var(--impd-color-motion-blue-600);color:#fff}.impdc-file-upload-dropzone input{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;z-index:2;cursor:pointer}.impdc-file-upload-dropzone input:disabled{cursor:default}\n"] }]
|
|
7017
7028
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: ErrorStateMatcher }, { type: undefined, decorators: [{
|
|
7018
7029
|
type: Optional
|
|
7019
7030
|
}, {
|
|
@@ -7055,18 +7066,18 @@ class FileUploadModule {
|
|
|
7055
7066
|
FileUploadModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: FileUploadModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
7056
7067
|
FileUploadModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: FileUploadModule, declarations: [FileDropDirective,
|
|
7057
7068
|
FileUploadComponent,
|
|
7058
|
-
HumanReadableByteSizePipe], imports: [CommonModule, FormsModule, ButtonModule], exports: [FileDropDirective, FileUploadComponent] });
|
|
7059
|
-
FileUploadModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: FileUploadModule, imports: [CommonModule, FormsModule, ButtonModule] });
|
|
7069
|
+
HumanReadableByteSizePipe], imports: [CommonModule, FormsModule, ButtonModule, IconModule], exports: [IconModule, FileDropDirective, FileUploadComponent] });
|
|
7070
|
+
FileUploadModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: FileUploadModule, imports: [CommonModule, FormsModule, ButtonModule, IconModule, IconModule] });
|
|
7060
7071
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: FileUploadModule, decorators: [{
|
|
7061
7072
|
type: NgModule,
|
|
7062
7073
|
args: [{
|
|
7063
|
-
imports: [CommonModule, FormsModule, ButtonModule],
|
|
7074
|
+
imports: [CommonModule, FormsModule, ButtonModule, IconModule],
|
|
7064
7075
|
declarations: [
|
|
7065
7076
|
FileDropDirective,
|
|
7066
7077
|
FileUploadComponent,
|
|
7067
7078
|
HumanReadableByteSizePipe
|
|
7068
7079
|
],
|
|
7069
|
-
exports: [FileDropDirective, FileUploadComponent]
|
|
7080
|
+
exports: [IconModule, FileDropDirective, FileUploadComponent]
|
|
7070
7081
|
}]
|
|
7071
7082
|
}], ctorParameters: function () { return []; } });
|
|
7072
7083
|
|
|
@@ -7099,10 +7110,10 @@ class AvatarComponent {
|
|
|
7099
7110
|
}
|
|
7100
7111
|
}
|
|
7101
7112
|
AvatarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: AvatarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
7102
|
-
AvatarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: AvatarComponent, selector: "impdc-avatar", inputs: { imgSrc: "imgSrc", initials: "initials", status: "status", size: "size" }, ngImport: i0, template: "<div class=\"avatar-container\">\n <span class=\"avatar-status\" *ngIf=\"status\" [ngClass]=\"[size, status]\"></span>\n\n <img\n class=\"avatar\"\n *ngIf=\"avatarHasImg\"\n [attr.src]=\"imgSrc\"\n [ngClass]=\"size\" />\n <div\n class=\"avatar initials\"\n *ngIf=\"!avatarHasImg && initials\"\n [ngClass]=\"size\">\n {{ initials.toUpperCase() }}\n </div>\n\n <div\n class=\"avatar fallback\"\n *ngIf=\"!avatarHasImg && !initials\"\n [ngClass]=\"size\">\n <span
|
|
7113
|
+
AvatarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: AvatarComponent, selector: "impdc-avatar", inputs: { imgSrc: "imgSrc", initials: "initials", status: "status", size: "size" }, ngImport: i0, template: "<div class=\"avatar-container\">\n <span class=\"avatar-status\" *ngIf=\"status\" [ngClass]=\"[size, status]\"></span>\n\n <img\n class=\"avatar\"\n *ngIf=\"avatarHasImg\"\n [attr.src]=\"imgSrc\"\n [ngClass]=\"size\" />\n <div\n class=\"avatar initials\"\n *ngIf=\"!avatarHasImg && initials\"\n [ngClass]=\"size\">\n {{ initials.toUpperCase() }}\n </div>\n\n <div\n class=\"avatar fallback\"\n *ngIf=\"!avatarHasImg && !initials\"\n [ngClass]=\"size\">\n <span impdc-icon name=\"user\"></span>\n </div>\n</div>\n", styles: [".avatar-container{display:flex;position:relative;align-items:center;justify-content:center}.avatar-right{margin-left:1.2rem}.avatar{border-radius:50%}.avatar.xs{height:2.4rem;width:2.4rem}.avatar.sm{height:3.2rem;width:3.2rem}.avatar.md{height:4rem;width:4rem}.avatar.lg{height:4.8rem;width:4.8rem}.avatar.xl{height:5.6rem;width:5.6rem}.avatar.xxl{height:6.4rem;width:6.4rem}.avatar.initials{background-color:var(--impd-color-gray-400);color:var(--impd-color-white)}.avatar.initials.xs{font-size:1.2rem}.avatar.initials.sm{font-size:1.4rem}.avatar.initials.md{font-size:1.6rem}.avatar.initials.lg{font-size:1.8rem}.avatar.initials.xl{font-size:2rem}.avatar.initials.xxl{font-size:2.2rem}.avatar.fallback{background:var(--impd-color-gray-100);color:var(--impd-color-gray-300)}.avatar.fallback.xs{font-size:1.2rem}.avatar.fallback.sm{font-size:1.7rem}.avatar.fallback.md{font-size:2.3rem}.avatar.fallback.lg{font-size:2.9rem}.avatar.fallback.xl{font-size:3.5rem}.avatar.fallback.xxl{font-size:3.9rem}.avatar.initials,.avatar.fallback{display:flex;align-items:center;justify-content:center}.avatar-status{border-radius:50%;border:.2rem solid var(--impd-color-white);position:absolute;top:0;right:0}.avatar-status.xs{height:.6rem;width:.6rem}.avatar-status.sm{height:.8rem;width:.8rem}.avatar-status.md{height:1rem;width:1rem}.avatar-status.lg{height:1.2rem;width:1.2rem}.avatar-status.xl{height:1.4rem;width:1.4rem}.avatar-status.xxl{height:1.6rem;width:1.6rem}.avatar-status.active{background-color:var(--impd-color-green-400)}.avatar-status.inactive{background-color:var(--impd-color-gray-300)}.avatar-status.busy{background-color:var(--impd-color-red-400)}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IconComponent, selector: "impdc-icon, [impdc-icon]", inputs: ["name", "theme", "size"] }] });
|
|
7103
7114
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: AvatarComponent, decorators: [{
|
|
7104
7115
|
type: Component,
|
|
7105
|
-
args: [{ selector: 'impdc-avatar', template: "<div class=\"avatar-container\">\n <span class=\"avatar-status\" *ngIf=\"status\" [ngClass]=\"[size, status]\"></span>\n\n <img\n class=\"avatar\"\n *ngIf=\"avatarHasImg\"\n [attr.src]=\"imgSrc\"\n [ngClass]=\"size\" />\n <div\n class=\"avatar initials\"\n *ngIf=\"!avatarHasImg && initials\"\n [ngClass]=\"size\">\n {{ initials.toUpperCase() }}\n </div>\n\n <div\n class=\"avatar fallback\"\n *ngIf=\"!avatarHasImg && !initials\"\n [ngClass]=\"size\">\n <span
|
|
7116
|
+
args: [{ selector: 'impdc-avatar', template: "<div class=\"avatar-container\">\n <span class=\"avatar-status\" *ngIf=\"status\" [ngClass]=\"[size, status]\"></span>\n\n <img\n class=\"avatar\"\n *ngIf=\"avatarHasImg\"\n [attr.src]=\"imgSrc\"\n [ngClass]=\"size\" />\n <div\n class=\"avatar initials\"\n *ngIf=\"!avatarHasImg && initials\"\n [ngClass]=\"size\">\n {{ initials.toUpperCase() }}\n </div>\n\n <div\n class=\"avatar fallback\"\n *ngIf=\"!avatarHasImg && !initials\"\n [ngClass]=\"size\">\n <span impdc-icon name=\"user\"></span>\n </div>\n</div>\n", styles: [".avatar-container{display:flex;position:relative;align-items:center;justify-content:center}.avatar-right{margin-left:1.2rem}.avatar{border-radius:50%}.avatar.xs{height:2.4rem;width:2.4rem}.avatar.sm{height:3.2rem;width:3.2rem}.avatar.md{height:4rem;width:4rem}.avatar.lg{height:4.8rem;width:4.8rem}.avatar.xl{height:5.6rem;width:5.6rem}.avatar.xxl{height:6.4rem;width:6.4rem}.avatar.initials{background-color:var(--impd-color-gray-400);color:var(--impd-color-white)}.avatar.initials.xs{font-size:1.2rem}.avatar.initials.sm{font-size:1.4rem}.avatar.initials.md{font-size:1.6rem}.avatar.initials.lg{font-size:1.8rem}.avatar.initials.xl{font-size:2rem}.avatar.initials.xxl{font-size:2.2rem}.avatar.fallback{background:var(--impd-color-gray-100);color:var(--impd-color-gray-300)}.avatar.fallback.xs{font-size:1.2rem}.avatar.fallback.sm{font-size:1.7rem}.avatar.fallback.md{font-size:2.3rem}.avatar.fallback.lg{font-size:2.9rem}.avatar.fallback.xl{font-size:3.5rem}.avatar.fallback.xxl{font-size:3.9rem}.avatar.initials,.avatar.fallback{display:flex;align-items:center;justify-content:center}.avatar-status{border-radius:50%;border:.2rem solid var(--impd-color-white);position:absolute;top:0;right:0}.avatar-status.xs{height:.6rem;width:.6rem}.avatar-status.sm{height:.8rem;width:.8rem}.avatar-status.md{height:1rem;width:1rem}.avatar-status.lg{height:1.2rem;width:1.2rem}.avatar-status.xl{height:1.4rem;width:1.4rem}.avatar-status.xxl{height:1.6rem;width:1.6rem}.avatar-status.active{background-color:var(--impd-color-green-400)}.avatar-status.inactive{background-color:var(--impd-color-gray-300)}.avatar-status.busy{background-color:var(--impd-color-red-400)}\n"] }]
|
|
7106
7117
|
}], propDecorators: { imgSrc: [{
|
|
7107
7118
|
type: Input
|
|
7108
7119
|
}], initials: [{
|
|
@@ -7116,14 +7127,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
7116
7127
|
class AvatarModule {
|
|
7117
7128
|
}
|
|
7118
7129
|
AvatarModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: AvatarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
7119
|
-
AvatarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: AvatarModule, declarations: [AvatarComponent], imports: [CommonModule], exports: [AvatarComponent] });
|
|
7120
|
-
AvatarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: AvatarModule, imports: [CommonModule] });
|
|
7130
|
+
AvatarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: AvatarModule, declarations: [AvatarComponent], imports: [CommonModule, IconModule], exports: [IconModule, AvatarComponent] });
|
|
7131
|
+
AvatarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: AvatarModule, imports: [CommonModule, IconModule, IconModule] });
|
|
7121
7132
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: AvatarModule, decorators: [{
|
|
7122
7133
|
type: NgModule,
|
|
7123
7134
|
args: [{
|
|
7135
|
+
imports: [CommonModule, IconModule],
|
|
7124
7136
|
declarations: [AvatarComponent],
|
|
7125
|
-
|
|
7126
|
-
exports: [AvatarComponent]
|
|
7137
|
+
exports: [IconModule, AvatarComponent]
|
|
7127
7138
|
}]
|
|
7128
7139
|
}] });
|
|
7129
7140
|
|
|
@@ -7224,10 +7235,10 @@ class BadgeComponent {
|
|
|
7224
7235
|
}
|
|
7225
7236
|
}
|
|
7226
7237
|
BadgeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: BadgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
7227
|
-
BadgeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: BadgeComponent, selector: "impdc-badge, [impdc-badge]", inputs: { text: "text", icon: "icon", theme: "theme", size: "size", hideBg: "hideBg", rounded: "rounded", dismissable: "dismissable" }, outputs: { dismiss: "dismiss" }, host: { properties: { "class": "this.classBadge", "class.rounded-pill": "this.classBadgeRounded", "hidden": "this._dismissed" } }, ngImport: i0, template: "<span *ngIf=\"icon\"
|
|
7238
|
+
BadgeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: BadgeComponent, selector: "impdc-badge, [impdc-badge]", inputs: { text: "text", icon: "icon", theme: "theme", size: "size", hideBg: "hideBg", rounded: "rounded", dismissable: "dismissable" }, outputs: { dismiss: "dismiss" }, host: { properties: { "class": "this.classBadge", "class.rounded-pill": "this.classBadgeRounded", "hidden": "this._dismissed" } }, ngImport: i0, template: "<span *ngIf=\"icon\" impdc-icon [name]=\"icon === 'dot' ? 'circle' : icon\"></span>\n{{ text }}\n<a *ngIf=\"dismissable\" (click)=\"handleDismiss($event)\">\n <span impdc-icon name=\"times\"></span>\n</a>\n", dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IconComponent, selector: "impdc-icon, [impdc-icon]", inputs: ["name", "theme", "size"] }] });
|
|
7228
7239
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: BadgeComponent, decorators: [{
|
|
7229
7240
|
type: Component,
|
|
7230
|
-
args: [{ selector: 'impdc-badge, [impdc-badge]', template: "<span *ngIf=\"icon\"
|
|
7241
|
+
args: [{ selector: 'impdc-badge, [impdc-badge]', template: "<span *ngIf=\"icon\" impdc-icon [name]=\"icon === 'dot' ? 'circle' : icon\"></span>\n{{ text }}\n<a *ngIf=\"dismissable\" (click)=\"handleDismiss($event)\">\n <span impdc-icon name=\"times\"></span>\n</a>\n" }]
|
|
7231
7242
|
}], propDecorators: { text: [{
|
|
7232
7243
|
type: Input
|
|
7233
7244
|
}], icon: [{
|
|
@@ -7259,14 +7270,14 @@ class BadgeModule {
|
|
|
7259
7270
|
constructor() { }
|
|
7260
7271
|
}
|
|
7261
7272
|
BadgeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: BadgeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
7262
|
-
BadgeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: BadgeModule, declarations: [BadgeComponent], imports: [CommonModule], exports: [BadgeComponent] });
|
|
7263
|
-
BadgeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: BadgeModule, imports: [CommonModule] });
|
|
7273
|
+
BadgeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: BadgeModule, declarations: [BadgeComponent], imports: [CommonModule, IconModule], exports: [IconModule, BadgeComponent] });
|
|
7274
|
+
BadgeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: BadgeModule, imports: [CommonModule, IconModule, IconModule] });
|
|
7264
7275
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: BadgeModule, decorators: [{
|
|
7265
7276
|
type: NgModule,
|
|
7266
7277
|
args: [{
|
|
7267
|
-
imports: [CommonModule],
|
|
7278
|
+
imports: [CommonModule, IconModule],
|
|
7268
7279
|
declarations: [BadgeComponent],
|
|
7269
|
-
exports: [BadgeComponent]
|
|
7280
|
+
exports: [IconModule, BadgeComponent]
|
|
7270
7281
|
}]
|
|
7271
7282
|
}], ctorParameters: function () { return []; } });
|
|
7272
7283
|
|
|
@@ -7705,10 +7716,10 @@ class PaginationComponent {
|
|
|
7705
7716
|
}
|
|
7706
7717
|
}
|
|
7707
7718
|
PaginationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: PaginationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
7708
|
-
PaginationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: PaginationComponent, selector: "impdc-pagination, div[impdc-pagination]", inputs: { page: "page", perPage: "perPage", total: "total", summary: "summary" }, outputs: { goToPage: "goToPage" }, ngImport: i0, template: "<div class=\"pagination-container\">\n <div class=\"mobile-pagination\">\n <button\n impdcButton\n theme=\"secondary\"\n [disabled]=\"page <= 1\"\n (click)=\"goToPreviousPage()\">\n <i
|
|
7719
|
+
PaginationComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: PaginationComponent, selector: "impdc-pagination, div[impdc-pagination]", inputs: { page: "page", perPage: "perPage", total: "total", summary: "summary" }, outputs: { goToPage: "goToPage" }, ngImport: i0, template: "<div class=\"pagination-container\">\n <div class=\"mobile-pagination\">\n <button\n impdcButton\n theme=\"secondary\"\n [disabled]=\"page <= 1\"\n (click)=\"goToPreviousPage()\">\n <i impdc-icon name=\"chevron-left\"></i>\n </button>\n <button\n impdcButton\n theme=\"secondary\"\n [disabled]=\"page === totalPages\"\n (click)=\"goToNextPage()\">\n <i impdc-icon name=\"chevron-right\"></i>\n </button>\n </div>\n\n <div class=\"desktop-pagination\">\n <div>\n <span class=\"summary\" [innerHTML]=\"summary\"></span>\n </div>\n <div class=\"pagination-actions\">\n <button\n impdcButton\n theme=\"secondary\"\n aria-label=\"First Page\"\n class=\"pagination-first-last-btns\"\n (click)=\"goToExactPage(1)\"\n [disabled]=\"page <= 1\">\n <i impdc-icon name=\"chevron-left first\"></i>\n <i impdc-icon name=\"chevron-left\"></i>\n <!-- 1 -->\n </button>\n <button\n impdcButton\n theme=\"secondary\"\n class=\"previous\"\n aria-label=\"Previous\"\n (click)=\"goToPreviousPage()\"\n [disabled]=\"page <= 1\">\n <i impdc-icon name=\"chevron-left\"></i>\n </button>\n <div class=\"page-change\">\n <input\n impdcInput\n [(ngModel)]=\"page\"\n maxlength=\"4\"\n (blur)=\"goToExactPageFromEvent($event)\"\n (keydown.enter)=\"preventDefaultAndBlur($event)\" />\n <span class=\"total-pages\"> / {{ totalPages }} </span>\n </div>\n <button\n impdcButton\n theme=\"secondary\"\n aria-label=\"Next\"\n (click)=\"goToNextPage()\"\n [disabled]=\"page >= totalPages\">\n <i impdc-icon name=\"chevron-right\"></i>\n </button>\n <button\n impdcButton\n theme=\"secondary\"\n class=\"pagination-first-last-btns\"\n aria-label=\"Last Page\"\n (click)=\"goToExactPage(totalPages)\"\n [disabled]=\"page === totalPages\">\n <i impdc-icon name=\"chevron-right\"></i>\n <i impdc-icon name=\"chevron-right last\"></i>\n <!-- {{ totalPages }} -->\n </button>\n </div>\n </div>\n</div>\n", styles: [".pagination-container{background-color:var(--impd-color-white);padding:var(--impd-size-3) var(--impd-size-6);gap:1rem;color:var(--impd-color-gray-700, #374151)}@media (min-width: 640px){.pagination-container{padding-left:var(--impd-size-6);padding-right:var(--impd-size-6)}}.mobile-pagination{display:flex;gap:2rem;justify-content:space-between;align-items:center}@media (min-width: 640px){.mobile-pagination{display:none}}.desktop-pagination{display:none}@media (min-width: 640px){.desktop-pagination{display:flex;flex:1 1 0%;align-items:center;justify-content:space-between;gap:2rem;flex-flow:wrap}}.summary{font-size:var(--impd-font-size-sm);line-height:var(--impd-size-5);font-weight:400;color:var(--impd-color-gray-700)}.pagination-actions{display:flex;flex-direction:row;gap:.4rem;flex-flow:wrap}.pagination-actions ::ng-deep .first{margin-right:-1.2rem}.pagination-actions ::ng-deep .last{margin-left:-1.2rem}.page-change{display:flex;flex-direction:row;align-items:center;gap:.4rem;font-size:var(--impd-size-3_5, 1.4rem)}.page-change .form-control{min-width:4.275rem;max-width:6.3rem;text-align:center}.page-change .total-pages{padding:0 1.2rem}.pagination-first-last-btns{padding-left:1.325rem;padding-right:1.325rem}\n"], dependencies: [{ kind: "component", type: ButtonComponent, selector: "button[impdcButton]", inputs: ["type", "theme", "text", "disabled", "titleText", "ariaLabel"] }, { kind: "component", type: IconComponent, selector: "impdc-icon, [impdc-icon]", inputs: ["name", "theme", "size"] }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: InputDirective, selector: "input[impdcInput], textarea[impdcInput], select[impdcNativeSelect]", inputs: ["disabled", "id", "type", "required", "readonly", "errorStateMatcher", "value"], exportAs: ["impdcInput"] }] });
|
|
7709
7720
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: PaginationComponent, decorators: [{
|
|
7710
7721
|
type: Component,
|
|
7711
|
-
args: [{ selector: 'impdc-pagination, div[impdc-pagination]', template: "<div class=\"pagination-container\">\n <div class=\"mobile-pagination\">\n <button\n impdcButton\n theme=\"secondary\"\n [disabled]=\"page <= 1\"\n (click)=\"goToPreviousPage()\">\n <i
|
|
7722
|
+
args: [{ selector: 'impdc-pagination, div[impdc-pagination]', template: "<div class=\"pagination-container\">\n <div class=\"mobile-pagination\">\n <button\n impdcButton\n theme=\"secondary\"\n [disabled]=\"page <= 1\"\n (click)=\"goToPreviousPage()\">\n <i impdc-icon name=\"chevron-left\"></i>\n </button>\n <button\n impdcButton\n theme=\"secondary\"\n [disabled]=\"page === totalPages\"\n (click)=\"goToNextPage()\">\n <i impdc-icon name=\"chevron-right\"></i>\n </button>\n </div>\n\n <div class=\"desktop-pagination\">\n <div>\n <span class=\"summary\" [innerHTML]=\"summary\"></span>\n </div>\n <div class=\"pagination-actions\">\n <button\n impdcButton\n theme=\"secondary\"\n aria-label=\"First Page\"\n class=\"pagination-first-last-btns\"\n (click)=\"goToExactPage(1)\"\n [disabled]=\"page <= 1\">\n <i impdc-icon name=\"chevron-left first\"></i>\n <i impdc-icon name=\"chevron-left\"></i>\n <!-- 1 -->\n </button>\n <button\n impdcButton\n theme=\"secondary\"\n class=\"previous\"\n aria-label=\"Previous\"\n (click)=\"goToPreviousPage()\"\n [disabled]=\"page <= 1\">\n <i impdc-icon name=\"chevron-left\"></i>\n </button>\n <div class=\"page-change\">\n <input\n impdcInput\n [(ngModel)]=\"page\"\n maxlength=\"4\"\n (blur)=\"goToExactPageFromEvent($event)\"\n (keydown.enter)=\"preventDefaultAndBlur($event)\" />\n <span class=\"total-pages\"> / {{ totalPages }} </span>\n </div>\n <button\n impdcButton\n theme=\"secondary\"\n aria-label=\"Next\"\n (click)=\"goToNextPage()\"\n [disabled]=\"page >= totalPages\">\n <i impdc-icon name=\"chevron-right\"></i>\n </button>\n <button\n impdcButton\n theme=\"secondary\"\n class=\"pagination-first-last-btns\"\n aria-label=\"Last Page\"\n (click)=\"goToExactPage(totalPages)\"\n [disabled]=\"page === totalPages\">\n <i impdc-icon name=\"chevron-right\"></i>\n <i impdc-icon name=\"chevron-right last\"></i>\n <!-- {{ totalPages }} -->\n </button>\n </div>\n </div>\n</div>\n", styles: [".pagination-container{background-color:var(--impd-color-white);padding:var(--impd-size-3) var(--impd-size-6);gap:1rem;color:var(--impd-color-gray-700, #374151)}@media (min-width: 640px){.pagination-container{padding-left:var(--impd-size-6);padding-right:var(--impd-size-6)}}.mobile-pagination{display:flex;gap:2rem;justify-content:space-between;align-items:center}@media (min-width: 640px){.mobile-pagination{display:none}}.desktop-pagination{display:none}@media (min-width: 640px){.desktop-pagination{display:flex;flex:1 1 0%;align-items:center;justify-content:space-between;gap:2rem;flex-flow:wrap}}.summary{font-size:var(--impd-font-size-sm);line-height:var(--impd-size-5);font-weight:400;color:var(--impd-color-gray-700)}.pagination-actions{display:flex;flex-direction:row;gap:.4rem;flex-flow:wrap}.pagination-actions ::ng-deep .first{margin-right:-1.2rem}.pagination-actions ::ng-deep .last{margin-left:-1.2rem}.page-change{display:flex;flex-direction:row;align-items:center;gap:.4rem;font-size:var(--impd-size-3_5, 1.4rem)}.page-change .form-control{min-width:4.275rem;max-width:6.3rem;text-align:center}.page-change .total-pages{padding:0 1.2rem}.pagination-first-last-btns{padding-left:1.325rem;padding-right:1.325rem}\n"] }]
|
|
7712
7723
|
}], propDecorators: { page: [{
|
|
7713
7724
|
type: Input
|
|
7714
7725
|
}], perPage: [{
|
|
@@ -7725,14 +7736,28 @@ class PaginationModule {
|
|
|
7725
7736
|
constructor() { }
|
|
7726
7737
|
}
|
|
7727
7738
|
PaginationModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: PaginationModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
7728
|
-
PaginationModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: PaginationModule, declarations: [PaginationComponent], imports: [CommonModule,
|
|
7729
|
-
|
|
7739
|
+
PaginationModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: PaginationModule, declarations: [PaginationComponent], imports: [CommonModule,
|
|
7740
|
+
ButtonModule,
|
|
7741
|
+
FormsModule,
|
|
7742
|
+
ImpdcFormsModule,
|
|
7743
|
+
IconModule], exports: [ButtonModule, ImpdcFormsModule, IconModule, PaginationComponent] });
|
|
7744
|
+
PaginationModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: PaginationModule, imports: [CommonModule,
|
|
7745
|
+
ButtonModule,
|
|
7746
|
+
FormsModule,
|
|
7747
|
+
ImpdcFormsModule,
|
|
7748
|
+
IconModule, ButtonModule, ImpdcFormsModule, IconModule] });
|
|
7730
7749
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: PaginationModule, decorators: [{
|
|
7731
7750
|
type: NgModule,
|
|
7732
7751
|
args: [{
|
|
7733
|
-
imports: [
|
|
7752
|
+
imports: [
|
|
7753
|
+
CommonModule,
|
|
7754
|
+
ButtonModule,
|
|
7755
|
+
FormsModule,
|
|
7756
|
+
ImpdcFormsModule,
|
|
7757
|
+
IconModule
|
|
7758
|
+
],
|
|
7734
7759
|
declarations: [PaginationComponent],
|
|
7735
|
-
exports: [ButtonModule, ImpdcFormsModule, PaginationComponent]
|
|
7760
|
+
exports: [ButtonModule, ImpdcFormsModule, IconModule, PaginationComponent]
|
|
7736
7761
|
}]
|
|
7737
7762
|
}], ctorParameters: function () { return []; } });
|
|
7738
7763
|
|
|
@@ -7940,10 +7965,10 @@ class ScrollableComponent {
|
|
|
7940
7965
|
}
|
|
7941
7966
|
}
|
|
7942
7967
|
ScrollableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ScrollableComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
7943
|
-
ScrollableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: ScrollableComponent, selector: "impdc-scrollable, div[impdc-scrollable]", inputs: { scrollUnit: "scrollUnit", clickScrollMultiplier: "clickScrollMultiplier" }, host: { properties: { "style.--impdc-scrollable-bg": "this._scrollableBgColor" } }, viewQueries: [{ propertyName: "containerRef", first: true, predicate: ["container"], descendants: true }, { propertyName: "contentRef", first: true, predicate: ["content"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\n class=\"impdc-scrollable\"\n #container\n impdcSizeDetector\n (resized)=\"widthChanged($event)\">\n <a class=\"impdc-scrollable-left\" (click)=\"scroll(-1)\" *ngIf=\"canScrollLeft\">\n <i
|
|
7968
|
+
ScrollableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: ScrollableComponent, selector: "impdc-scrollable, div[impdc-scrollable]", inputs: { scrollUnit: "scrollUnit", clickScrollMultiplier: "clickScrollMultiplier" }, host: { properties: { "style.--impdc-scrollable-bg": "this._scrollableBgColor" } }, viewQueries: [{ propertyName: "containerRef", first: true, predicate: ["container"], descendants: true }, { propertyName: "contentRef", first: true, predicate: ["content"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div\n class=\"impdc-scrollable\"\n #container\n impdcSizeDetector\n (resized)=\"widthChanged($event)\">\n <a class=\"impdc-scrollable-left\" (click)=\"scroll(-1)\" *ngIf=\"canScrollLeft\">\n <i impdc-icon name=\"chevron-left\" class=\"default\"></i>\n </a>\n <div #content class=\"content-container\">\n <ng-content></ng-content>\n </div>\n <a class=\"impdc-scrollable-right\" (click)=\"scroll(1)\" *ngIf=\"canScrollRight\">\n <i impdc-icon name=\"chevron-right\" class=\"default\"></i>\n </a>\n</div>\n", styles: [".impdc-scrollable{position:relative;overflow-y:hidden}.impdc-scrollable .impdc-scrollable-base,.impdc-scrollable .impdc-scrollable-right,.impdc-scrollable .impdc-scrollable-left{position:absolute;top:0px;bottom:0px;display:flex;align-items:center;text-align:center;width:6.9rem;z-index:1;color:var(--impd-color-motion-blue-600, #01606d)}.impdc-scrollable .impdc-scrollable-left{justify-content:left;padding-left:1.5rem;background-image:linear-gradient(to right,var(--impdc-scrollable-bg, #fff) 50%,rgba(255,255,255,.0001) 86.46%)}.impdc-scrollable .impdc-scrollable-right{right:0;padding-right:1.5rem;justify-content:right;background-image:linear-gradient(to left,var(--impdc-scrollable-bg, #fff) 50%,rgba(255,255,255,.0001) 86.46%)}.impdc-scrollable .content-container{overflow-x:hidden;-webkit-overflow-scrolling:touch;white-space:nowrap}:host(.branded) .impdc-scrollable .impdc-scrollable-left,:host(.branded) .impdc-scrollable .impdc-scrollable-right{color:var(--px-primary-color, var(--impd-color-motion-blue-600, #01606d))}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: SizeDetectorDirective, selector: "[impdcSizeDetector]", outputs: ["resized"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
7944
7969
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ScrollableComponent, decorators: [{
|
|
7945
7970
|
type: Component,
|
|
7946
|
-
args: [{ selector: 'impdc-scrollable, div[impdc-scrollable]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n class=\"impdc-scrollable\"\n #container\n impdcSizeDetector\n (resized)=\"widthChanged($event)\">\n <a class=\"impdc-scrollable-left\" (click)=\"scroll(-1)\" *ngIf=\"canScrollLeft\">\n <i
|
|
7971
|
+
args: [{ selector: 'impdc-scrollable, div[impdc-scrollable]', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n class=\"impdc-scrollable\"\n #container\n impdcSizeDetector\n (resized)=\"widthChanged($event)\">\n <a class=\"impdc-scrollable-left\" (click)=\"scroll(-1)\" *ngIf=\"canScrollLeft\">\n <i impdc-icon name=\"chevron-left\" class=\"default\"></i>\n </a>\n <div #content class=\"content-container\">\n <ng-content></ng-content>\n </div>\n <a class=\"impdc-scrollable-right\" (click)=\"scroll(1)\" *ngIf=\"canScrollRight\">\n <i impdc-icon name=\"chevron-right\" class=\"default\"></i>\n </a>\n</div>\n", styles: [".impdc-scrollable{position:relative;overflow-y:hidden}.impdc-scrollable .impdc-scrollable-base,.impdc-scrollable .impdc-scrollable-right,.impdc-scrollable .impdc-scrollable-left{position:absolute;top:0px;bottom:0px;display:flex;align-items:center;text-align:center;width:6.9rem;z-index:1;color:var(--impd-color-motion-blue-600, #01606d)}.impdc-scrollable .impdc-scrollable-left{justify-content:left;padding-left:1.5rem;background-image:linear-gradient(to right,var(--impdc-scrollable-bg, #fff) 50%,rgba(255,255,255,.0001) 86.46%)}.impdc-scrollable .impdc-scrollable-right{right:0;padding-right:1.5rem;justify-content:right;background-image:linear-gradient(to left,var(--impdc-scrollable-bg, #fff) 50%,rgba(255,255,255,.0001) 86.46%)}.impdc-scrollable .content-container{overflow-x:hidden;-webkit-overflow-scrolling:touch;white-space:nowrap}:host(.branded) .impdc-scrollable .impdc-scrollable-left,:host(.branded) .impdc-scrollable .impdc-scrollable-right{color:var(--px-primary-color, var(--impd-color-motion-blue-600, #01606d))}\n"] }]
|
|
7947
7972
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }]; }, propDecorators: { scrollUnit: [{
|
|
7948
7973
|
type: Input
|
|
7949
7974
|
}], clickScrollMultiplier: [{
|
|
@@ -8216,7 +8241,7 @@ SelectIconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ve
|
|
|
8216
8241
|
provide: ImpdcFormFieldControl,
|
|
8217
8242
|
useExisting: SelectIconComponent
|
|
8218
8243
|
}
|
|
8219
|
-
], viewQueries: [{ propertyName: "_toggleButtonRef", first: true, predicate: ["toggleButton"], descendants: true, read: ElementRef, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div\n ngbDropdown\n autoClose=\"outside\"\n container=\"body\"\n dropdownClass=\"impartner-hex\"\n (openChange)=\"handleOpenChange($event)\"\n class=\"w-100\">\n <button\n #toggleButton\n class=\"impdc-select-icon--toggle btn border-0 text-start\"\n type=\"button\"\n role=\"combobox\"\n [disabled]=\"disabled\"\n ngbDropdownToggle>\n <ng-container [ngSwitch]=\"empty\">\n <span\n class=\"impdc-select-icon--text impdc-select-icon--placeholder\"\n *ngSwitchCase=\"true\">\n {{ placeholder }}\n </span>\n <div\n class=\"impdc-select-icon--text impdc-select-icon--value-text\"\n *ngSwitchCase=\"false\">\n <i
|
|
8244
|
+
], viewQueries: [{ propertyName: "_toggleButtonRef", first: true, predicate: ["toggleButton"], descendants: true, read: ElementRef, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div\n ngbDropdown\n autoClose=\"outside\"\n container=\"body\"\n dropdownClass=\"impartner-hex\"\n (openChange)=\"handleOpenChange($event)\"\n class=\"w-100\">\n <button\n #toggleButton\n class=\"impdc-select-icon--toggle btn border-0 text-start\"\n type=\"button\"\n role=\"combobox\"\n [disabled]=\"disabled\"\n ngbDropdownToggle>\n <ng-container [ngSwitch]=\"empty\">\n <span\n class=\"impdc-select-icon--text impdc-select-icon--placeholder\"\n *ngSwitchCase=\"true\">\n {{ placeholder }}\n </span>\n <div\n class=\"impdc-select-icon--text impdc-select-icon--value-text\"\n *ngSwitchCase=\"false\">\n <i impdc-icon [name]=\"value ?? undefined\"></i>\n <span *ngIf=\"showSelectedText\" class=\"ms-2\">{{ value }}</span>\n </div>\n </ng-container>\n </button>\n <div ngbDropdownMenu class=\"select-icon-dropdown-menu\" tabindex=\"-1\">\n <div *ngIf=\"allowSearch\" class=\"select-icon-search\">\n <impdc-form-field>\n <span impdcTextPrefix><i impdc-icon name=\"search\"></i></span>\n <input\n impdcInput\n [formControl]=\"searchControl\"\n class=\"select-icon-search-input\"\n type=\"search\" />\n </impdc-form-field>\n </div>\n <div class=\"select-icon-grid\">\n <button\n *ngFor=\"let iconName of filteredOptions$ | async\"\n type=\"button\"\n (click)=\"selectIcon(iconName)\"\n class=\"icon-option\"\n [class.selected]=\"value === iconName\"\n [title]=\"iconName\"\n [attr.aria-labelledby]=\"showText ? id + '_' + iconName : null\">\n <div class=\"icon-container\">\n <i impdc-icon [name]=\"iconName\" class=\"fs-2xl\"></i>\n </div>\n <div\n id=\"{{ id }}_{{ iconName }}\"\n class=\"icon-label\"\n [class.sr-only]=\"!showText\">\n {{ iconName }}\n </div>\n </button>\n </div>\n </div>\n</div>\n", styles: [":host{padding:0!important;position:relative}:host.impdc-select-icon--disabled{background-color:var(--impd-color-gray-100)}.impdc-select-icon--toggle{font-weight:inherit;padding-right:3.6rem;-webkit-user-select:none;user-select:none;width:100%}:host-context(.is-invalid) .impdc-select-icon--toggle{padding-right:6.6rem}.impdc-select-icon--text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.select-icon-dropdown-menu{background-color:var(--impd-color-white);color:var(--impd-color-gray-600);max-width:51.2rem;min-width:32rem;overflow:hidden;width:100%}.select-icon-search{margin:var(--impd-size-2);font-size:var(--impd-font-size-sm)}.select-icon-grid{display:grid;align-items:start;grid-template-columns:repeat(auto-fit,minmax(4.8rem,1fr));gap:var(--impd-size-4);width:100%;max-height:var(--impd-size-40);overflow-y:auto;overflow-x:hidden;padding:var(--impd-size-4);-webkit-user-select:none;user-select:none}button[ngbDropdownToggle].dropdown-toggle:after{display:none}.icon-option{padding:0;background:unset;border:none}.icon-option:focus{outline:0}.icon-container{height:4rem;width:4rem;margin-left:auto;margin-right:auto;display:flex;align-items:center;justify-content:center;border-radius:50%;justify-items:center}.selected>.icon-container,:hover>.icon-container,:focus>.icon-container{background-color:var(--impartner-hex-primary);color:var(--impartner-hex-white)}.icon-label{text-align:center;font-size:1rem}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i4.NgbDropdown, selector: "[ngbDropdown]", inputs: ["autoClose", "dropdownClass", "open", "placement", "popperOptions", "container", "display"], outputs: ["openChange"], exportAs: ["ngbDropdown"] }, { kind: "directive", type: i4.NgbDropdownToggle, selector: "[ngbDropdownToggle]" }, { kind: "directive", type: i4.NgbDropdownMenu, selector: "[ngbDropdownMenu]" }, { kind: "component", type: IconComponent, selector: "impdc-icon, [impdc-icon]", inputs: ["name", "theme", "size"] }, { kind: "component", type: FormFieldComponent, selector: "impdc-form-field", exportAs: ["impdcFormField"] }, { kind: "directive", type: InputDirective, selector: "input[impdcInput], textarea[impdcInput], select[impdcNativeSelect]", inputs: ["disabled", "id", "type", "required", "readonly", "errorStateMatcher", "value"], exportAs: ["impdcInput"] }, { kind: "directive", type: PrefixDirective, selector: "[impdcPrefix], [impdcTextPrefix]", inputs: ["impdcTextPrefix"] }, { kind: "directive", type: i2.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: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
8220
8245
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: SelectIconComponent, decorators: [{
|
|
8221
8246
|
type: Component,
|
|
8222
8247
|
args: [{ selector: 'impdc-select-icon', inputs: ['disabled', 'tabIndex'], changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
@@ -8239,7 +8264,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
8239
8264
|
provide: ImpdcFormFieldControl,
|
|
8240
8265
|
useExisting: SelectIconComponent
|
|
8241
8266
|
}
|
|
8242
|
-
], template: "<div\n ngbDropdown\n autoClose=\"outside\"\n container=\"body\"\n dropdownClass=\"impartner-hex\"\n (openChange)=\"handleOpenChange($event)\"\n class=\"w-100\">\n <button\n #toggleButton\n class=\"impdc-select-icon--toggle btn border-0 text-start\"\n type=\"button\"\n role=\"combobox\"\n [disabled]=\"disabled\"\n ngbDropdownToggle>\n <ng-container [ngSwitch]=\"empty\">\n <span\n class=\"impdc-select-icon--text impdc-select-icon--placeholder\"\n *ngSwitchCase=\"true\">\n {{ placeholder }}\n </span>\n <div\n class=\"impdc-select-icon--text impdc-select-icon--value-text\"\n *ngSwitchCase=\"false\">\n <i
|
|
8267
|
+
], template: "<div\n ngbDropdown\n autoClose=\"outside\"\n container=\"body\"\n dropdownClass=\"impartner-hex\"\n (openChange)=\"handleOpenChange($event)\"\n class=\"w-100\">\n <button\n #toggleButton\n class=\"impdc-select-icon--toggle btn border-0 text-start\"\n type=\"button\"\n role=\"combobox\"\n [disabled]=\"disabled\"\n ngbDropdownToggle>\n <ng-container [ngSwitch]=\"empty\">\n <span\n class=\"impdc-select-icon--text impdc-select-icon--placeholder\"\n *ngSwitchCase=\"true\">\n {{ placeholder }}\n </span>\n <div\n class=\"impdc-select-icon--text impdc-select-icon--value-text\"\n *ngSwitchCase=\"false\">\n <i impdc-icon [name]=\"value ?? undefined\"></i>\n <span *ngIf=\"showSelectedText\" class=\"ms-2\">{{ value }}</span>\n </div>\n </ng-container>\n </button>\n <div ngbDropdownMenu class=\"select-icon-dropdown-menu\" tabindex=\"-1\">\n <div *ngIf=\"allowSearch\" class=\"select-icon-search\">\n <impdc-form-field>\n <span impdcTextPrefix><i impdc-icon name=\"search\"></i></span>\n <input\n impdcInput\n [formControl]=\"searchControl\"\n class=\"select-icon-search-input\"\n type=\"search\" />\n </impdc-form-field>\n </div>\n <div class=\"select-icon-grid\">\n <button\n *ngFor=\"let iconName of filteredOptions$ | async\"\n type=\"button\"\n (click)=\"selectIcon(iconName)\"\n class=\"icon-option\"\n [class.selected]=\"value === iconName\"\n [title]=\"iconName\"\n [attr.aria-labelledby]=\"showText ? id + '_' + iconName : null\">\n <div class=\"icon-container\">\n <i impdc-icon [name]=\"iconName\" class=\"fs-2xl\"></i>\n </div>\n <div\n id=\"{{ id }}_{{ iconName }}\"\n class=\"icon-label\"\n [class.sr-only]=\"!showText\">\n {{ iconName }}\n </div>\n </button>\n </div>\n </div>\n</div>\n", styles: [":host{padding:0!important;position:relative}:host.impdc-select-icon--disabled{background-color:var(--impd-color-gray-100)}.impdc-select-icon--toggle{font-weight:inherit;padding-right:3.6rem;-webkit-user-select:none;user-select:none;width:100%}:host-context(.is-invalid) .impdc-select-icon--toggle{padding-right:6.6rem}.impdc-select-icon--text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;width:100%}.select-icon-dropdown-menu{background-color:var(--impd-color-white);color:var(--impd-color-gray-600);max-width:51.2rem;min-width:32rem;overflow:hidden;width:100%}.select-icon-search{margin:var(--impd-size-2);font-size:var(--impd-font-size-sm)}.select-icon-grid{display:grid;align-items:start;grid-template-columns:repeat(auto-fit,minmax(4.8rem,1fr));gap:var(--impd-size-4);width:100%;max-height:var(--impd-size-40);overflow-y:auto;overflow-x:hidden;padding:var(--impd-size-4);-webkit-user-select:none;user-select:none}button[ngbDropdownToggle].dropdown-toggle:after{display:none}.icon-option{padding:0;background:unset;border:none}.icon-option:focus{outline:0}.icon-container{height:4rem;width:4rem;margin-left:auto;margin-right:auto;display:flex;align-items:center;justify-content:center;border-radius:50%;justify-items:center}.selected>.icon-container,:hover>.icon-container,:focus>.icon-container{background-color:var(--impartner-hex-primary);color:var(--impartner-hex-white)}.icon-label{text-align:center;font-size:1rem}\n"] }]
|
|
8243
8268
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: ErrorStateMatcher }, { type: undefined, decorators: [{
|
|
8244
8269
|
type: Optional
|
|
8245
8270
|
}, {
|
|
@@ -8396,10 +8421,10 @@ class DataCardComponent {
|
|
|
8396
8421
|
}
|
|
8397
8422
|
}
|
|
8398
8423
|
DataCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DataCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
8399
|
-
DataCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: DataCardComponent, selector: "impdc-data-card, [impdc-data-card]", inputs: { title: "title", current: "current", previous: "previous", difference: "difference", linkText: "linkText", sharedBorders: "sharedBorders", differencePill: "differencePill", currentColor: "currentColor", iconColor: "iconColor", iconBgColor: "iconBgColor" }, outputs: { linkClicked: "linkClicked", cornerClicked: "cornerClicked" }, host: { properties: { "class": "this.classDataCard", "class.impdc-data-card-shared-borders": "this.classDataCardSharedBorders" } }, ngImport: i0, template: "<div class=\"card-body impdc-data-card-body\">\n <div\n #iconContentEl\n class=\"impdc-data-card-icon\"\n [style.color]=\"iconColor ? iconColor : undefined\"\n [style.background-color]=\"iconBgColor ? iconBgColor : undefined\"\n [class.hide]=\"!iconContentEl.children.length\">\n <ng-content select=\"[icon]\"></ng-content>\n </div>\n <div class=\"impdc-data-card-container\">\n <div class=\"impdc-data-card-title\" [class.title-attention]=\"titleAttention\">\n {{ title }}\n </div>\n <div class=\"impdc-data-card-data\">\n <ng-content></ng-content>\n <span\n *ngIf=\"current\"\n class=\"data-current\"\n [class.data-current-enlarged]=\"\n !iconContentEl.children.length && !previous && !difference\n \"\n [style.color]=\"currentColor ? currentColor : undefined\"\n [innerText]=\"current\"></span>\n <span class=\"data-other\">\n <span\n *ngIf=\"previous\"\n class=\"data-previous\"\n [innerText]=\"previous\"></span>\n <span\n *ngIf=\"difference\"\n class=\"data-difference\"\n [class.difference-negative]=\"differenceNegative\"\n [class.difference-positive]=\"differencePositive\"\n [class.badge]=\"differencePill\"\n [class.rounded-pill]=\"differencePill\">\n <span *ngIf=\"differenceNegative\"
|
|
8424
|
+
DataCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: DataCardComponent, selector: "impdc-data-card, [impdc-data-card]", inputs: { title: "title", current: "current", previous: "previous", difference: "difference", linkText: "linkText", sharedBorders: "sharedBorders", differencePill: "differencePill", currentColor: "currentColor", iconColor: "iconColor", iconBgColor: "iconBgColor" }, outputs: { linkClicked: "linkClicked", cornerClicked: "cornerClicked" }, host: { properties: { "class": "this.classDataCard", "class.impdc-data-card-shared-borders": "this.classDataCardSharedBorders" } }, ngImport: i0, template: "<div class=\"card-body impdc-data-card-body\">\n <div\n #iconContentEl\n class=\"impdc-data-card-icon\"\n [style.color]=\"iconColor ? iconColor : undefined\"\n [style.background-color]=\"iconBgColor ? iconBgColor : undefined\"\n [class.hide]=\"!iconContentEl.children.length\">\n <ng-content select=\"[icon]\"></ng-content>\n </div>\n <div class=\"impdc-data-card-container\">\n <div class=\"impdc-data-card-title\" [class.title-attention]=\"titleAttention\">\n {{ title }}\n </div>\n <div class=\"impdc-data-card-data\">\n <ng-content></ng-content>\n <span\n *ngIf=\"current\"\n class=\"data-current\"\n [class.data-current-enlarged]=\"\n !iconContentEl.children.length && !previous && !difference\n \"\n [style.color]=\"currentColor ? currentColor : undefined\"\n [innerText]=\"current\"></span>\n <span class=\"data-other\">\n <span\n *ngIf=\"previous\"\n class=\"data-previous\"\n [innerText]=\"previous\"></span>\n <span\n *ngIf=\"difference\"\n class=\"data-difference\"\n [class.difference-negative]=\"differenceNegative\"\n [class.difference-positive]=\"differencePositive\"\n [class.badge]=\"differencePill\"\n [class.rounded-pill]=\"differencePill\">\n <span *ngIf=\"differenceNegative\" impdc-icon name=\"arrow-down\"></span>\n <span *ngIf=\"differencePositive\" impdc-icon name=\"arrow-up\"></span>\n <span class=\"difference-display\">{{ differenceDisplay }}</span>\n </span>\n </span>\n </div>\n </div>\n <div\n #cornerContentEl\n class=\"impdc-data-card-corner\"\n [class.hide]=\"!cornerContentEl.children.length\"\n (click)=\"handleCornerClick($event); $event.stopPropagation()\">\n <ng-content select=\"[corner]\"></ng-content>\n </div>\n</div>\n<div\n class=\"card-footer impdc-data-card-footer\"\n [class.hide]=\"!linkText && !footerContentEl.children.length\">\n <div #footerContentEl [class.hide]=\"!footerContentEl.children.length\">\n <ng-content select=\"[footer]\"></ng-content>\n </div>\n <a\n *ngIf=\"linkText\"\n class=\"footer-link\"\n (click)=\"handleLinkClick($event); $event.stopPropagation()\"\n >{{ linkText }}</a\n >\n</div>\n", styles: [".hide{display:none}.impdc-data-card{overflow-x:hidden;border:0;box-shadow:0 1px 3px #0000001a,0 1px 2px #0000000f;border-radius:8px}.impdc-data-card.impdc-data-card-shared-borders:first-child:not(:last-child){border-right:0;border-top-right-radius:0;border-bottom-right-radius:0}.impdc-data-card.impdc-data-card-shared-borders:last-child:not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0}.impdc-data-card.impdc-data-card-shared-borders:not(:first-child):not(:last-child){border-right:0;border-radius:0}.impdc-data-card-body{position:relative;display:flex;align-items:center;gap:20px;padding:24px}.impdc-data-card-icon{display:flex;align-items:center;justify-content:center;padding:12px;background-color:#01606d;color:#fff;border-radius:6px}.impdc-data-card-icon .fa,.impdc-data-card-icon .fa-brands,.impdc-data-card-icon .fa-duotone,.impdc-data-card-icon .fa-light,.impdc-data-card-icon .fa-regular,.impdc-data-card-icon .fa-solid,.impdc-data-card-icon .fa-thin,.impdc-data-card-icon .fab,.impdc-data-card-icon .fad,.impdc-data-card-icon .fal,.impdc-data-card-icon .far,.impdc-data-card-icon .fas,.impdc-data-card-icon .fat,.impdc-data-card-icon svg{display:flex;align-items:center;justify-content:center;height:24px;width:24px;font-size:18px;line-height:24px}.impdc-data-card-icon.hide{display:none}.impdc-data-card-container{display:flex;flex-direction:column;min-width:50px}.impdc-data-card-title{color:#6b7280;font-size:14px;line-height:20px;font-weight:500;min-width:100px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.impdc-data-card-title.title-attention{color:#161e2e;font-size:16px;line-height:24px;font-weight:400}.impdc-data-card-data{display:flex;flex-wrap:wrap;align-items:end;min-width:0}.impdc-data-card-data .data-current{color:#161e2e;font-size:24px;line-height:32px;font-weight:600;min-width:75px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-right:8px}.impdc-data-card-data .data-current.data-current-enlarged{font-size:30px;line-height:36px}.impdc-data-card-data .data-other{display:inline-flex;justify-content:space-between;align-items:end;min-width:50px}.impdc-data-card-data .data-previous{min-width:0;color:#6b7280;font-size:14px;line-height:20px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-right:13px}.impdc-data-card-data .data-difference{display:inline-flex;align-items:center;gap:5px;color:#6b7280;font-size:14px;line-height:20px;font-weight:500}.impdc-data-card-data .data-difference.difference-negative{color:#e02424}.impdc-data-card-data .data-difference.difference-negative.badge{background-color:#fde8e8}.impdc-data-card-data .data-difference.difference-positive{color:#057a55}.impdc-data-card-data .data-difference.difference-positive.badge{background-color:#def7ec}.impdc-data-card-data .data-difference.rounded-pill{padding:4px 10px;border-radius:12px!important}.impdc-data-card-corner{position:absolute;top:0;right:0;margin:1rem;line-height:14px;color:#374151}.impdc-data-card-corner .fa,.impdc-data-card-corner .fa-brands,.impdc-data-card-corner .fa-duotone,.impdc-data-card-corner .fa-light,.impdc-data-card-corner .fa-regular,.impdc-data-card-corner .fa-solid,.impdc-data-card-corner .fa-thin,.impdc-data-card-corner .fab,.impdc-data-card-corner .fad,.impdc-data-card-corner .fal,.impdc-data-card-corner .far,.impdc-data-card-corner .fas,.impdc-data-card-corner .fat,.impdc-data-card-corner svg{height:14px;line-height:14px}.impdc-data-card-corner.hide{display:none}.impdc-data-card-footer{display:flex;align-items:center;padding:16px;background-color:#f9fafb}.impdc-data-card-footer.card-footer{border-top:0}.impdc-data-card-footer.hide{display:none}.impdc-data-card-footer .footer-link{color:#01606d;font-weight:500;font-size:14px;line-height:20px}.impdc-data-card-footer .footer-link:hover{color:#19a8c1}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IconComponent, selector: "impdc-icon, [impdc-icon]", inputs: ["name", "theme", "size"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
8400
8425
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DataCardComponent, decorators: [{
|
|
8401
8426
|
type: Component,
|
|
8402
|
-
args: [{ selector: 'impdc-data-card, [impdc-data-card]', encapsulation: ViewEncapsulation.None, template: "<div class=\"card-body impdc-data-card-body\">\n <div\n #iconContentEl\n class=\"impdc-data-card-icon\"\n [style.color]=\"iconColor ? iconColor : undefined\"\n [style.background-color]=\"iconBgColor ? iconBgColor : undefined\"\n [class.hide]=\"!iconContentEl.children.length\">\n <ng-content select=\"[icon]\"></ng-content>\n </div>\n <div class=\"impdc-data-card-container\">\n <div class=\"impdc-data-card-title\" [class.title-attention]=\"titleAttention\">\n {{ title }}\n </div>\n <div class=\"impdc-data-card-data\">\n <ng-content></ng-content>\n <span\n *ngIf=\"current\"\n class=\"data-current\"\n [class.data-current-enlarged]=\"\n !iconContentEl.children.length && !previous && !difference\n \"\n [style.color]=\"currentColor ? currentColor : undefined\"\n [innerText]=\"current\"></span>\n <span class=\"data-other\">\n <span\n *ngIf=\"previous\"\n class=\"data-previous\"\n [innerText]=\"previous\"></span>\n <span\n *ngIf=\"difference\"\n class=\"data-difference\"\n [class.difference-negative]=\"differenceNegative\"\n [class.difference-positive]=\"differencePositive\"\n [class.badge]=\"differencePill\"\n [class.rounded-pill]=\"differencePill\">\n <span *ngIf=\"differenceNegative\"
|
|
8427
|
+
args: [{ selector: 'impdc-data-card, [impdc-data-card]', encapsulation: ViewEncapsulation.None, template: "<div class=\"card-body impdc-data-card-body\">\n <div\n #iconContentEl\n class=\"impdc-data-card-icon\"\n [style.color]=\"iconColor ? iconColor : undefined\"\n [style.background-color]=\"iconBgColor ? iconBgColor : undefined\"\n [class.hide]=\"!iconContentEl.children.length\">\n <ng-content select=\"[icon]\"></ng-content>\n </div>\n <div class=\"impdc-data-card-container\">\n <div class=\"impdc-data-card-title\" [class.title-attention]=\"titleAttention\">\n {{ title }}\n </div>\n <div class=\"impdc-data-card-data\">\n <ng-content></ng-content>\n <span\n *ngIf=\"current\"\n class=\"data-current\"\n [class.data-current-enlarged]=\"\n !iconContentEl.children.length && !previous && !difference\n \"\n [style.color]=\"currentColor ? currentColor : undefined\"\n [innerText]=\"current\"></span>\n <span class=\"data-other\">\n <span\n *ngIf=\"previous\"\n class=\"data-previous\"\n [innerText]=\"previous\"></span>\n <span\n *ngIf=\"difference\"\n class=\"data-difference\"\n [class.difference-negative]=\"differenceNegative\"\n [class.difference-positive]=\"differencePositive\"\n [class.badge]=\"differencePill\"\n [class.rounded-pill]=\"differencePill\">\n <span *ngIf=\"differenceNegative\" impdc-icon name=\"arrow-down\"></span>\n <span *ngIf=\"differencePositive\" impdc-icon name=\"arrow-up\"></span>\n <span class=\"difference-display\">{{ differenceDisplay }}</span>\n </span>\n </span>\n </div>\n </div>\n <div\n #cornerContentEl\n class=\"impdc-data-card-corner\"\n [class.hide]=\"!cornerContentEl.children.length\"\n (click)=\"handleCornerClick($event); $event.stopPropagation()\">\n <ng-content select=\"[corner]\"></ng-content>\n </div>\n</div>\n<div\n class=\"card-footer impdc-data-card-footer\"\n [class.hide]=\"!linkText && !footerContentEl.children.length\">\n <div #footerContentEl [class.hide]=\"!footerContentEl.children.length\">\n <ng-content select=\"[footer]\"></ng-content>\n </div>\n <a\n *ngIf=\"linkText\"\n class=\"footer-link\"\n (click)=\"handleLinkClick($event); $event.stopPropagation()\"\n >{{ linkText }}</a\n >\n</div>\n", styles: [".hide{display:none}.impdc-data-card{overflow-x:hidden;border:0;box-shadow:0 1px 3px #0000001a,0 1px 2px #0000000f;border-radius:8px}.impdc-data-card.impdc-data-card-shared-borders:first-child:not(:last-child){border-right:0;border-top-right-radius:0;border-bottom-right-radius:0}.impdc-data-card.impdc-data-card-shared-borders:last-child:not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0}.impdc-data-card.impdc-data-card-shared-borders:not(:first-child):not(:last-child){border-right:0;border-radius:0}.impdc-data-card-body{position:relative;display:flex;align-items:center;gap:20px;padding:24px}.impdc-data-card-icon{display:flex;align-items:center;justify-content:center;padding:12px;background-color:#01606d;color:#fff;border-radius:6px}.impdc-data-card-icon .fa,.impdc-data-card-icon .fa-brands,.impdc-data-card-icon .fa-duotone,.impdc-data-card-icon .fa-light,.impdc-data-card-icon .fa-regular,.impdc-data-card-icon .fa-solid,.impdc-data-card-icon .fa-thin,.impdc-data-card-icon .fab,.impdc-data-card-icon .fad,.impdc-data-card-icon .fal,.impdc-data-card-icon .far,.impdc-data-card-icon .fas,.impdc-data-card-icon .fat,.impdc-data-card-icon svg{display:flex;align-items:center;justify-content:center;height:24px;width:24px;font-size:18px;line-height:24px}.impdc-data-card-icon.hide{display:none}.impdc-data-card-container{display:flex;flex-direction:column;min-width:50px}.impdc-data-card-title{color:#6b7280;font-size:14px;line-height:20px;font-weight:500;min-width:100px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.impdc-data-card-title.title-attention{color:#161e2e;font-size:16px;line-height:24px;font-weight:400}.impdc-data-card-data{display:flex;flex-wrap:wrap;align-items:end;min-width:0}.impdc-data-card-data .data-current{color:#161e2e;font-size:24px;line-height:32px;font-weight:600;min-width:75px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-right:8px}.impdc-data-card-data .data-current.data-current-enlarged{font-size:30px;line-height:36px}.impdc-data-card-data .data-other{display:inline-flex;justify-content:space-between;align-items:end;min-width:50px}.impdc-data-card-data .data-previous{min-width:0;color:#6b7280;font-size:14px;line-height:20px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-right:13px}.impdc-data-card-data .data-difference{display:inline-flex;align-items:center;gap:5px;color:#6b7280;font-size:14px;line-height:20px;font-weight:500}.impdc-data-card-data .data-difference.difference-negative{color:#e02424}.impdc-data-card-data .data-difference.difference-negative.badge{background-color:#fde8e8}.impdc-data-card-data .data-difference.difference-positive{color:#057a55}.impdc-data-card-data .data-difference.difference-positive.badge{background-color:#def7ec}.impdc-data-card-data .data-difference.rounded-pill{padding:4px 10px;border-radius:12px!important}.impdc-data-card-corner{position:absolute;top:0;right:0;margin:1rem;line-height:14px;color:#374151}.impdc-data-card-corner .fa,.impdc-data-card-corner .fa-brands,.impdc-data-card-corner .fa-duotone,.impdc-data-card-corner .fa-light,.impdc-data-card-corner .fa-regular,.impdc-data-card-corner .fa-solid,.impdc-data-card-corner .fa-thin,.impdc-data-card-corner .fab,.impdc-data-card-corner .fad,.impdc-data-card-corner .fal,.impdc-data-card-corner .far,.impdc-data-card-corner .fas,.impdc-data-card-corner .fat,.impdc-data-card-corner svg{height:14px;line-height:14px}.impdc-data-card-corner.hide{display:none}.impdc-data-card-footer{display:flex;align-items:center;padding:16px;background-color:#f9fafb}.impdc-data-card-footer.card-footer{border-top:0}.impdc-data-card-footer.hide{display:none}.impdc-data-card-footer .footer-link{color:#01606d;font-weight:500;font-size:14px;line-height:20px}.impdc-data-card-footer .footer-link:hover{color:#19a8c1}\n"] }]
|
|
8403
8428
|
}], propDecorators: { title: [{
|
|
8404
8429
|
type: Input
|
|
8405
8430
|
}], current: [{
|
|
@@ -8436,14 +8461,14 @@ class DataCardModule {
|
|
|
8436
8461
|
constructor() { }
|
|
8437
8462
|
}
|
|
8438
8463
|
DataCardModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DataCardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
8439
|
-
DataCardModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: DataCardModule, declarations: [DataCardComponent], imports: [CommonModule], exports: [DataCardComponent] });
|
|
8440
|
-
DataCardModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DataCardModule, imports: [CommonModule] });
|
|
8464
|
+
DataCardModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: DataCardModule, declarations: [DataCardComponent], imports: [CommonModule, IconModule], exports: [IconModule, DataCardComponent] });
|
|
8465
|
+
DataCardModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DataCardModule, imports: [CommonModule, IconModule, IconModule] });
|
|
8441
8466
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DataCardModule, decorators: [{
|
|
8442
8467
|
type: NgModule,
|
|
8443
8468
|
args: [{
|
|
8444
|
-
imports: [CommonModule],
|
|
8469
|
+
imports: [CommonModule, IconModule],
|
|
8445
8470
|
declarations: [DataCardComponent],
|
|
8446
|
-
exports: [DataCardComponent]
|
|
8471
|
+
exports: [IconModule, DataCardComponent]
|
|
8447
8472
|
}]
|
|
8448
8473
|
}], ctorParameters: function () { return []; } });
|
|
8449
8474
|
|