@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
|
@@ -3203,7 +3203,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
3203
3203
|
* To use, import `IconModule` or another module that imports and exports that module from `@impartner/design-components`.
|
|
3204
3204
|
*/
|
|
3205
3205
|
class IconComponent {
|
|
3206
|
-
constructor() {
|
|
3206
|
+
constructor(_changeDetectorRef) {
|
|
3207
|
+
this._changeDetectorRef = _changeDetectorRef;
|
|
3207
3208
|
this._loading = true;
|
|
3208
3209
|
this._licensed = false;
|
|
3209
3210
|
/**
|
|
@@ -3249,16 +3250,17 @@ class IconComponent {
|
|
|
3249
3250
|
if (iconFontFamily.includes('Font Awesome')) {
|
|
3250
3251
|
this._licensed = !iconFontFamily.includes('Free');
|
|
3251
3252
|
this._loading = false;
|
|
3253
|
+
this._changeDetectorRef.detectChanges();
|
|
3252
3254
|
}
|
|
3253
3255
|
}
|
|
3254
3256
|
}
|
|
3255
3257
|
}
|
|
3256
|
-
IconComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: IconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3258
|
+
IconComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: IconComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
3257
3259
|
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 });
|
|
3258
3260
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: IconComponent, decorators: [{
|
|
3259
3261
|
type: Component,
|
|
3260
3262
|
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" }]
|
|
3261
|
-
}], propDecorators: { name: [{
|
|
3263
|
+
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { name: [{
|
|
3262
3264
|
type: Input
|
|
3263
3265
|
}], theme: [{
|
|
3264
3266
|
type: Input
|
|
@@ -5863,7 +5865,7 @@ class SelectOptionComponent extends NgbDropdownItem {
|
|
|
5863
5865
|
}
|
|
5864
5866
|
}
|
|
5865
5867
|
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 });
|
|
5866
|
-
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
|
|
5868
|
+
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 });
|
|
5867
5869
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: SelectOptionComponent, decorators: [{
|
|
5868
5870
|
type: Component,
|
|
5869
5871
|
args: [{ selector: 'impdc-select-option', changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
@@ -5872,7 +5874,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
5872
5874
|
'[class.impdc-select-option--selected]': 'selected',
|
|
5873
5875
|
'(click)': '_selectViaInteraction()',
|
|
5874
5876
|
'(keydown)': '_handleKeydown($event)'
|
|
5875
|
-
}, template: "<ng-template #singleSelectTemplate>\n <span>{{ label || ' ' }}</span>\n <span
|
|
5877
|
+
}, 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"] }]
|
|
5876
5878
|
}], ctorParameters: function () {
|
|
5877
5879
|
return [{ type: undefined, decorators: [{
|
|
5878
5880
|
type: Optional
|
|
@@ -6553,14 +6555,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
6553
6555
|
class SelectModule {
|
|
6554
6556
|
}
|
|
6555
6557
|
SelectModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: SelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
6556
|
-
SelectModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: SelectModule, declarations: [SelectOptionComponent, SelectComponent], imports: [CommonModule, NgbDropdownModule], exports: [
|
|
6557
|
-
|
|
6558
|
+
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,
|
|
6559
|
+
IconModule,
|
|
6560
|
+
SelectOptionComponent,
|
|
6561
|
+
SelectComponent] });
|
|
6562
|
+
SelectModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: SelectModule, imports: [CommonModule, NgbDropdownModule, IconModule, NgbDropdownModule,
|
|
6563
|
+
IconModule] });
|
|
6558
6564
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: SelectModule, decorators: [{
|
|
6559
6565
|
type: NgModule,
|
|
6560
6566
|
args: [{
|
|
6567
|
+
imports: [CommonModule, NgbDropdownModule, IconModule],
|
|
6561
6568
|
declarations: [SelectOptionComponent, SelectComponent],
|
|
6562
|
-
|
|
6563
|
-
|
|
6569
|
+
exports: [
|
|
6570
|
+
NgbDropdownModule,
|
|
6571
|
+
IconModule,
|
|
6572
|
+
SelectOptionComponent,
|
|
6573
|
+
SelectComponent
|
|
6574
|
+
]
|
|
6564
6575
|
}]
|
|
6565
6576
|
}] });
|
|
6566
6577
|
|
|
@@ -7016,7 +7027,7 @@ FileUploadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ve
|
|
|
7016
7027
|
provide: ImpdcFormFieldControl,
|
|
7017
7028
|
useExisting: FileUploadComponent
|
|
7018
7029
|
}
|
|
7019
|
-
], 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
|
|
7030
|
+
], 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 });
|
|
7020
7031
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: FileUploadComponent, decorators: [{
|
|
7021
7032
|
type: Component,
|
|
7022
7033
|
args: [{ selector: 'impdc-file-upload, [impdc-file-upload]', inputs: ['disabled', 'tabIndex'], changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
@@ -7037,7 +7048,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
7037
7048
|
provide: ImpdcFormFieldControl,
|
|
7038
7049
|
useExisting: FileUploadComponent
|
|
7039
7050
|
}
|
|
7040
|
-
], 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
|
|
7051
|
+
], 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"] }]
|
|
7041
7052
|
}], ctorParameters: function () {
|
|
7042
7053
|
return [{ type: i0.ChangeDetectorRef }, { type: ErrorStateMatcher }, { type: undefined, decorators: [{
|
|
7043
7054
|
type: Optional
|
|
@@ -7081,18 +7092,18 @@ class FileUploadModule {
|
|
|
7081
7092
|
FileUploadModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: FileUploadModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
7082
7093
|
FileUploadModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: FileUploadModule, declarations: [FileDropDirective,
|
|
7083
7094
|
FileUploadComponent,
|
|
7084
|
-
HumanReadableByteSizePipe], imports: [CommonModule, FormsModule, ButtonModule], exports: [FileDropDirective, FileUploadComponent] });
|
|
7085
|
-
FileUploadModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: FileUploadModule, imports: [CommonModule, FormsModule, ButtonModule] });
|
|
7095
|
+
HumanReadableByteSizePipe], imports: [CommonModule, FormsModule, ButtonModule, IconModule], exports: [IconModule, FileDropDirective, FileUploadComponent] });
|
|
7096
|
+
FileUploadModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: FileUploadModule, imports: [CommonModule, FormsModule, ButtonModule, IconModule, IconModule] });
|
|
7086
7097
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: FileUploadModule, decorators: [{
|
|
7087
7098
|
type: NgModule,
|
|
7088
7099
|
args: [{
|
|
7089
|
-
imports: [CommonModule, FormsModule, ButtonModule],
|
|
7100
|
+
imports: [CommonModule, FormsModule, ButtonModule, IconModule],
|
|
7090
7101
|
declarations: [
|
|
7091
7102
|
FileDropDirective,
|
|
7092
7103
|
FileUploadComponent,
|
|
7093
7104
|
HumanReadableByteSizePipe
|
|
7094
7105
|
],
|
|
7095
|
-
exports: [FileDropDirective, FileUploadComponent]
|
|
7106
|
+
exports: [IconModule, FileDropDirective, FileUploadComponent]
|
|
7096
7107
|
}]
|
|
7097
7108
|
}], ctorParameters: function () { return []; } });
|
|
7098
7109
|
|
|
@@ -7125,10 +7136,10 @@ class AvatarComponent {
|
|
|
7125
7136
|
}
|
|
7126
7137
|
}
|
|
7127
7138
|
AvatarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: AvatarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
7128
|
-
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
|
|
7139
|
+
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"] }] });
|
|
7129
7140
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: AvatarComponent, decorators: [{
|
|
7130
7141
|
type: Component,
|
|
7131
|
-
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
|
|
7142
|
+
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"] }]
|
|
7132
7143
|
}], propDecorators: { imgSrc: [{
|
|
7133
7144
|
type: Input
|
|
7134
7145
|
}], initials: [{
|
|
@@ -7142,14 +7153,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
7142
7153
|
class AvatarModule {
|
|
7143
7154
|
}
|
|
7144
7155
|
AvatarModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: AvatarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
7145
|
-
AvatarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: AvatarModule, declarations: [AvatarComponent], imports: [CommonModule], exports: [AvatarComponent] });
|
|
7146
|
-
AvatarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: AvatarModule, imports: [CommonModule] });
|
|
7156
|
+
AvatarModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: AvatarModule, declarations: [AvatarComponent], imports: [CommonModule, IconModule], exports: [IconModule, AvatarComponent] });
|
|
7157
|
+
AvatarModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: AvatarModule, imports: [CommonModule, IconModule, IconModule] });
|
|
7147
7158
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: AvatarModule, decorators: [{
|
|
7148
7159
|
type: NgModule,
|
|
7149
7160
|
args: [{
|
|
7161
|
+
imports: [CommonModule, IconModule],
|
|
7150
7162
|
declarations: [AvatarComponent],
|
|
7151
|
-
|
|
7152
|
-
exports: [AvatarComponent]
|
|
7163
|
+
exports: [IconModule, AvatarComponent]
|
|
7153
7164
|
}]
|
|
7154
7165
|
}] });
|
|
7155
7166
|
|
|
@@ -7250,10 +7261,10 @@ class BadgeComponent {
|
|
|
7250
7261
|
}
|
|
7251
7262
|
}
|
|
7252
7263
|
BadgeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: BadgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
7253
|
-
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\"
|
|
7264
|
+
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"] }] });
|
|
7254
7265
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: BadgeComponent, decorators: [{
|
|
7255
7266
|
type: Component,
|
|
7256
|
-
args: [{ selector: 'impdc-badge, [impdc-badge]', template: "<span *ngIf=\"icon\"
|
|
7267
|
+
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" }]
|
|
7257
7268
|
}], propDecorators: { text: [{
|
|
7258
7269
|
type: Input
|
|
7259
7270
|
}], icon: [{
|
|
@@ -7285,14 +7296,14 @@ class BadgeModule {
|
|
|
7285
7296
|
constructor() { }
|
|
7286
7297
|
}
|
|
7287
7298
|
BadgeModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: BadgeModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
7288
|
-
BadgeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: BadgeModule, declarations: [BadgeComponent], imports: [CommonModule], exports: [BadgeComponent] });
|
|
7289
|
-
BadgeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: BadgeModule, imports: [CommonModule] });
|
|
7299
|
+
BadgeModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: BadgeModule, declarations: [BadgeComponent], imports: [CommonModule, IconModule], exports: [IconModule, BadgeComponent] });
|
|
7300
|
+
BadgeModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: BadgeModule, imports: [CommonModule, IconModule, IconModule] });
|
|
7290
7301
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: BadgeModule, decorators: [{
|
|
7291
7302
|
type: NgModule,
|
|
7292
7303
|
args: [{
|
|
7293
|
-
imports: [CommonModule],
|
|
7304
|
+
imports: [CommonModule, IconModule],
|
|
7294
7305
|
declarations: [BadgeComponent],
|
|
7295
|
-
exports: [BadgeComponent]
|
|
7306
|
+
exports: [IconModule, BadgeComponent]
|
|
7296
7307
|
}]
|
|
7297
7308
|
}], ctorParameters: function () { return []; } });
|
|
7298
7309
|
|
|
@@ -7731,10 +7742,10 @@ class PaginationComponent {
|
|
|
7731
7742
|
}
|
|
7732
7743
|
}
|
|
7733
7744
|
PaginationComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: PaginationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
7734
|
-
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
|
|
7745
|
+
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"] }] });
|
|
7735
7746
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: PaginationComponent, decorators: [{
|
|
7736
7747
|
type: Component,
|
|
7737
|
-
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
|
|
7748
|
+
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"] }]
|
|
7738
7749
|
}], propDecorators: { page: [{
|
|
7739
7750
|
type: Input
|
|
7740
7751
|
}], perPage: [{
|
|
@@ -7751,14 +7762,28 @@ class PaginationModule {
|
|
|
7751
7762
|
constructor() { }
|
|
7752
7763
|
}
|
|
7753
7764
|
PaginationModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: PaginationModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
7754
|
-
PaginationModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: PaginationModule, declarations: [PaginationComponent], imports: [CommonModule,
|
|
7755
|
-
|
|
7765
|
+
PaginationModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: PaginationModule, declarations: [PaginationComponent], imports: [CommonModule,
|
|
7766
|
+
ButtonModule,
|
|
7767
|
+
FormsModule,
|
|
7768
|
+
ImpdcFormsModule,
|
|
7769
|
+
IconModule], exports: [ButtonModule, ImpdcFormsModule, IconModule, PaginationComponent] });
|
|
7770
|
+
PaginationModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: PaginationModule, imports: [CommonModule,
|
|
7771
|
+
ButtonModule,
|
|
7772
|
+
FormsModule,
|
|
7773
|
+
ImpdcFormsModule,
|
|
7774
|
+
IconModule, ButtonModule, ImpdcFormsModule, IconModule] });
|
|
7756
7775
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: PaginationModule, decorators: [{
|
|
7757
7776
|
type: NgModule,
|
|
7758
7777
|
args: [{
|
|
7759
|
-
imports: [
|
|
7778
|
+
imports: [
|
|
7779
|
+
CommonModule,
|
|
7780
|
+
ButtonModule,
|
|
7781
|
+
FormsModule,
|
|
7782
|
+
ImpdcFormsModule,
|
|
7783
|
+
IconModule
|
|
7784
|
+
],
|
|
7760
7785
|
declarations: [PaginationComponent],
|
|
7761
|
-
exports: [ButtonModule, ImpdcFormsModule, PaginationComponent]
|
|
7786
|
+
exports: [ButtonModule, ImpdcFormsModule, IconModule, PaginationComponent]
|
|
7762
7787
|
}]
|
|
7763
7788
|
}], ctorParameters: function () { return []; } });
|
|
7764
7789
|
|
|
@@ -7972,10 +7997,10 @@ class ScrollableComponent {
|
|
|
7972
7997
|
}
|
|
7973
7998
|
}
|
|
7974
7999
|
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 });
|
|
7975
|
-
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
|
|
8000
|
+
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 });
|
|
7976
8001
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: ScrollableComponent, decorators: [{
|
|
7977
8002
|
type: Component,
|
|
7978
|
-
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
|
|
8003
|
+
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"] }]
|
|
7979
8004
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }]; }, propDecorators: { scrollUnit: [{
|
|
7980
8005
|
type: Input
|
|
7981
8006
|
}], clickScrollMultiplier: [{
|
|
@@ -8247,7 +8272,7 @@ SelectIconComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ve
|
|
|
8247
8272
|
provide: ImpdcFormFieldControl,
|
|
8248
8273
|
useExisting: SelectIconComponent
|
|
8249
8274
|
}
|
|
8250
|
-
], 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
|
|
8275
|
+
], 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 });
|
|
8251
8276
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: SelectIconComponent, decorators: [{
|
|
8252
8277
|
type: Component,
|
|
8253
8278
|
args: [{ selector: 'impdc-select-icon', inputs: ['disabled', 'tabIndex'], changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
@@ -8270,7 +8295,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImpo
|
|
|
8270
8295
|
provide: ImpdcFormFieldControl,
|
|
8271
8296
|
useExisting: SelectIconComponent
|
|
8272
8297
|
}
|
|
8273
|
-
], 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
|
|
8298
|
+
], 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"] }]
|
|
8274
8299
|
}], ctorParameters: function () {
|
|
8275
8300
|
return [{ type: i0.ChangeDetectorRef }, { type: ErrorStateMatcher }, { type: undefined, decorators: [{
|
|
8276
8301
|
type: Optional
|
|
@@ -8429,10 +8454,10 @@ class DataCardComponent {
|
|
|
8429
8454
|
}
|
|
8430
8455
|
}
|
|
8431
8456
|
DataCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DataCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
8432
|
-
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\"
|
|
8457
|
+
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 });
|
|
8433
8458
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DataCardComponent, decorators: [{
|
|
8434
8459
|
type: Component,
|
|
8435
|
-
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\"
|
|
8460
|
+
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"] }]
|
|
8436
8461
|
}], propDecorators: { title: [{
|
|
8437
8462
|
type: Input
|
|
8438
8463
|
}], current: [{
|
|
@@ -8469,14 +8494,14 @@ class DataCardModule {
|
|
|
8469
8494
|
constructor() { }
|
|
8470
8495
|
}
|
|
8471
8496
|
DataCardModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DataCardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
8472
|
-
DataCardModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: DataCardModule, declarations: [DataCardComponent], imports: [CommonModule], exports: [DataCardComponent] });
|
|
8473
|
-
DataCardModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DataCardModule, imports: [CommonModule] });
|
|
8497
|
+
DataCardModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "14.2.12", ngImport: i0, type: DataCardModule, declarations: [DataCardComponent], imports: [CommonModule, IconModule], exports: [IconModule, DataCardComponent] });
|
|
8498
|
+
DataCardModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DataCardModule, imports: [CommonModule, IconModule, IconModule] });
|
|
8474
8499
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: DataCardModule, decorators: [{
|
|
8475
8500
|
type: NgModule,
|
|
8476
8501
|
args: [{
|
|
8477
|
-
imports: [CommonModule],
|
|
8502
|
+
imports: [CommonModule, IconModule],
|
|
8478
8503
|
declarations: [DataCardComponent],
|
|
8479
|
-
exports: [DataCardComponent]
|
|
8504
|
+
exports: [IconModule, DataCardComponent]
|
|
8480
8505
|
}]
|
|
8481
8506
|
}], ctorParameters: function () { return []; } });
|
|
8482
8507
|
|