@carefirst/library 4.7.1 → 4.7.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.
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { Component, Input, Output, EventEmitter } from '@angular/core';
|
|
1
|
+
import { Component, Input, Output, EventEmitter, ViewChild } from '@angular/core';
|
|
2
2
|
import { FormControl, FormGroup } from '@angular/forms';
|
|
3
3
|
import * as i0 from "@angular/core";
|
|
4
4
|
import * as i1 from "@ionic/angular";
|
|
@@ -8,9 +8,9 @@ import * as i4 from "../button/button.component";
|
|
|
8
8
|
import * as i5 from "../spacer/spacer.component";
|
|
9
9
|
import * as i6 from "../form-input/form-input.component";
|
|
10
10
|
export class AlertComponent {
|
|
11
|
+
popover;
|
|
11
12
|
data = undefined;
|
|
12
13
|
alertEvent = new EventEmitter();
|
|
13
|
-
isPopoverOpen = false;
|
|
14
14
|
customError = null;
|
|
15
15
|
alertForm = new FormGroup({
|
|
16
16
|
inputTextControl: new FormControl(''),
|
|
@@ -27,7 +27,7 @@ export class AlertComponent {
|
|
|
27
27
|
this.alertForm.controls.inputTextControl.updateValueAndValidity();
|
|
28
28
|
if (this.data.input?.customError)
|
|
29
29
|
this.customError = this.data.input.customError;
|
|
30
|
-
this.
|
|
30
|
+
this.popover?.present();
|
|
31
31
|
}
|
|
32
32
|
}
|
|
33
33
|
handleAlert(status) {
|
|
@@ -36,17 +36,20 @@ export class AlertComponent {
|
|
|
36
36
|
status: status,
|
|
37
37
|
...(this.data?.input && this.alertForm.value.inputTextControl ? { inputValue: this.alertForm.value.inputTextControl } : {}),
|
|
38
38
|
});
|
|
39
|
-
this.
|
|
39
|
+
this.popover?.dismiss();
|
|
40
40
|
}
|
|
41
41
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
42
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: AlertComponent, selector: "cf-alert", inputs: { data: "data" }, outputs: { alertEvent: "alertEvent" }, usesOnChanges: true, ngImport: i0, template: "<ion-popover
|
|
42
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: AlertComponent, selector: "cf-alert", inputs: { data: "data" }, outputs: { alertEvent: "alertEvent" }, viewQueries: [{ propertyName: "popover", first: true, predicate: ["popover"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ion-popover #popover cssClass=\"care-first-alert\" backdropDismiss=\"false\">\n <ng-template #popoverContent>\n <div class=\"popover-wrapper\">\n <ng-content></ng-content>\n <h4>{{ data?.heading }}</h4>\n <cf-spacer default=\"8\"></cf-spacer>\n <p class=\"body-medium\">{{ data?.message }}</p>\n <cf-spacer default=\"24\"></cf-spacer>\n <ng-container *ngIf=\"data?.input\">\n <form [formGroup]=\"alertForm\">\n <cf-form-input\n [placeholder]=\"data?.input?.placeholder\"\n [control]=\"alertForm.controls.inputTextControl\"\n [customErrorMessage]=\"customError\"\n (valueChange)=\"customError = ''\"></cf-form-input>\n </form>\n <cf-spacer default=\"24\"></cf-spacer>\n </ng-container>\n\n <div style=\"display: grid; gap: 12px\">\n <cf-btn type=\"primary\" fontSize=\"large\" [disabled]=\"data?.input?.validators && alertForm.invalid\" (click)=\"handleAlert(true)\">{{\n data?.buttonTrue || 'OK'\n }}</cf-btn>\n <cf-btn *ngIf=\"data && data.buttonFalse !== null\" fontSize=\"large\" type=\"tertiary\" alert (click)=\"handleAlert(false)\">{{\n data.buttonFalse || 'Cancel'\n }}</cf-btn>\n </div>\n </div>\n </ng-template>\n</ion-popover>\n", styles: [".care-first-alert::part(content){top:50%!important;left:50%!important;transform:translate(-50%,-50%)!important;width:100%;max-width:358px;border-radius:16px;text-align:center!important;justify-content:center!important}@media (min-width: 768px){.care-first-alert::part(content){max-width:420px}}.care-first-alert .popover-wrapper{width:100%;padding:48px 24px 24px}\n"], dependencies: [{ kind: "component", type: i1.IonPopover, selector: "ion-popover" }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: i4.ButtonComponent, selector: "cf-btn", inputs: ["type", "disabled", "alert", "action", "white", "snug", "accent", "fontSize", "iconStart", "iconEnd", "loading", "loadingText", "customColor"] }, { kind: "component", type: i5.SpacerComponent, selector: "cf-spacer", inputs: ["default", "mobile", "desktop"] }, { kind: "component", type: i6.FormInputComponent, selector: "cf-form-input", inputs: ["label", "min", "max", "labelPlacement", "placeholder", "inputmode", "autoCapitalize", "type", "noClearButton", "control", "textCenter", "maxLength", "greyBackground", "customErrorMessage", "value"], outputs: ["valueChange"] }] });
|
|
43
43
|
}
|
|
44
44
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AlertComponent, decorators: [{
|
|
45
45
|
type: Component,
|
|
46
|
-
args: [{ selector: 'cf-alert', template: "<ion-popover
|
|
47
|
-
}], propDecorators: {
|
|
46
|
+
args: [{ selector: 'cf-alert', template: "<ion-popover #popover cssClass=\"care-first-alert\" backdropDismiss=\"false\">\n <ng-template #popoverContent>\n <div class=\"popover-wrapper\">\n <ng-content></ng-content>\n <h4>{{ data?.heading }}</h4>\n <cf-spacer default=\"8\"></cf-spacer>\n <p class=\"body-medium\">{{ data?.message }}</p>\n <cf-spacer default=\"24\"></cf-spacer>\n <ng-container *ngIf=\"data?.input\">\n <form [formGroup]=\"alertForm\">\n <cf-form-input\n [placeholder]=\"data?.input?.placeholder\"\n [control]=\"alertForm.controls.inputTextControl\"\n [customErrorMessage]=\"customError\"\n (valueChange)=\"customError = ''\"></cf-form-input>\n </form>\n <cf-spacer default=\"24\"></cf-spacer>\n </ng-container>\n\n <div style=\"display: grid; gap: 12px\">\n <cf-btn type=\"primary\" fontSize=\"large\" [disabled]=\"data?.input?.validators && alertForm.invalid\" (click)=\"handleAlert(true)\">{{\n data?.buttonTrue || 'OK'\n }}</cf-btn>\n <cf-btn *ngIf=\"data && data.buttonFalse !== null\" fontSize=\"large\" type=\"tertiary\" alert (click)=\"handleAlert(false)\">{{\n data.buttonFalse || 'Cancel'\n }}</cf-btn>\n </div>\n </div>\n </ng-template>\n</ion-popover>\n", styles: [".care-first-alert::part(content){top:50%!important;left:50%!important;transform:translate(-50%,-50%)!important;width:100%;max-width:358px;border-radius:16px;text-align:center!important;justify-content:center!important}@media (min-width: 768px){.care-first-alert::part(content){max-width:420px}}.care-first-alert .popover-wrapper{width:100%;padding:48px 24px 24px}\n"] }]
|
|
47
|
+
}], propDecorators: { popover: [{
|
|
48
|
+
type: ViewChild,
|
|
49
|
+
args: ['popover']
|
|
50
|
+
}], data: [{
|
|
48
51
|
type: Input
|
|
49
52
|
}], alertEvent: [{
|
|
50
53
|
type: Output
|
|
51
54
|
}] } });
|
|
52
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
55
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYWxlcnQuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvY2FyZWZpcnN0L2xpYnJhcnkvc3JjL2xpYi9jb21wb25lbnRzL2FsZXJ0L2FsZXJ0LmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2NhcmVmaXJzdC9saWJyYXJ5L3NyYy9saWIvY29tcG9uZW50cy9hbGVydC9hbGVydC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFVQSxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQXNDLFlBQVksRUFBRSxTQUFTLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDdEgsT0FBTyxFQUFFLFdBQVcsRUFBRSxTQUFTLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQzs7Ozs7Ozs7QUFVeEQsTUFBTSxPQUFPLGNBQWM7SUFDSCxPQUFPLENBQWM7SUFFbEMsSUFBSSxHQUEyQixTQUFTLENBQUM7SUFDeEMsVUFBVSxHQUFHLElBQUksWUFBWSxFQUFlLENBQUM7SUFFdkQsV0FBVyxHQUFrQixJQUFJLENBQUM7SUFHbEMsU0FBUyxHQUFHLElBQUksU0FBUyxDQUFDO1FBQ3hCLGdCQUFnQixFQUFFLElBQUksV0FBVyxDQUFDLEVBQUUsQ0FBQztLQUN0QyxDQUFDLENBQUM7SUFRSCxXQUFXLENBQUMsT0FBc0I7UUFDaEMsTUFBTSxHQUFHLEdBQUcsT0FBTyxDQUFDLE1BQU0sQ0FBQyxFQUFFLFlBQWdDLENBQUM7UUFFOUQsSUFBSSxHQUFHLEVBQUUsQ0FBQztZQUNSLElBQUksQ0FBQyxJQUFJLEdBQUcsR0FBRyxDQUFDO1lBQ2hCLElBQUksQ0FBQyxTQUFTLENBQUMsS0FBSyxFQUFFLENBQUM7WUFFdkIsSUFBSSxJQUFJLENBQUMsSUFBSSxDQUFDLEtBQUssRUFBRSxVQUFVO2dCQUFFLElBQUksQ0FBQyxTQUFTLENBQUMsUUFBUSxDQUFDLGdCQUFnQixDQUFDLGFBQWEsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxVQUFVLENBQUMsQ0FBQzs7Z0JBQy9HLElBQUksQ0FBQyxTQUFTLENBQUMsUUFBUSxDQUFDLGdCQUFnQixDQUFDLGVBQWUsRUFBRSxDQUFDO1lBQ2hFLElBQUksQ0FBQyxTQUFTLENBQUMsUUFBUSxDQUFDLGdCQUFnQixDQUFDLHNCQUFzQixFQUFFLENBQUM7WUFFbEUsSUFBSSxJQUFJLENBQUMsSUFBSSxDQUFDLEtBQUssRUFBRSxXQUFXO2dCQUFFLElBQUksQ0FBQyxXQUFXLEdBQUcsSUFBSSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsV0FBVyxDQUFDO1lBRWpGLElBQUksQ0FBQyxPQUFPLEVBQUUsT0FBTyxFQUFFLENBQUM7UUFDMUIsQ0FBQztJQUNILENBQUM7SUFPRCxXQUFXLENBQUMsTUFBZTtRQUN6QixJQUFJLENBQUMsVUFBVSxDQUFDLElBQUksQ0FBQztZQUNuQixVQUFVLEVBQUUsSUFBSSxDQUFDLElBQUksRUFBRSxlQUFlLElBQUksRUFBRTtZQUM1QyxNQUFNLEVBQUUsTUFBTTtZQUNkLEdBQUcsQ0FBQyxJQUFJLENBQUMsSUFBSSxFQUFFLEtBQUssSUFBSSxJQUFJLENBQUMsU0FBUyxDQUFDLEtBQUssQ0FBQyxnQkFBZ0IsQ0FBQyxDQUFDLENBQUMsRUFBRSxVQUFVLEVBQUUsSUFBSSxDQUFDLFNBQVMsQ0FBQyxLQUFLLENBQUMsZ0JBQWdCLEVBQUUsQ0FBQyxDQUFDLENBQUMsRUFBRSxDQUFDO1NBQzVILENBQUMsQ0FBQztRQUNILElBQUksQ0FBQyxPQUFPLEVBQUUsT0FBTyxFQUFFLENBQUM7SUFDMUIsQ0FBQzt3R0FoRFUsY0FBYzs0RkFBZCxjQUFjLDBPQ3JCM0Isa3lDQThCQTs7NEZEVGEsY0FBYztrQkFMMUIsU0FBUzsrQkFDRSxVQUFVOzhCQUtFLE9BQU87c0JBQTVCLFNBQVM7dUJBQUMsU0FBUztnQkFFWCxJQUFJO3NCQUFaLEtBQUs7Z0JBQ0ksVUFBVTtzQkFBbkIsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogQ2FyZUZpcnN0IExpYnJhcnkgQWxlcnRcbiAqXG4gKiBAZmlsZSAgICAgICAgICBhbGVydC5jb21wb25lbnRcbiAqIEBkZXNjcmlwdGlvbiAgIENvbnRhaW5zIGFsbCB0aGUgbG9naWMgZm9yIGdlbmVyYXRpbmcgYSBDYXJlRmlyc3QgQWxlcnRcbiAqIEBhdXRob3IgICAgICAgIEFybm8gSmFuc2VuIHZhbiBWdXVyZW5cbiAqIEBzaW5jZSAgICAgICAgIDIwMjMgLSAxMSAtIDMwXG4gKiBAdXNhZ2UgICAgICAgICA8Y2YtYWxlcnQgZGF0YT1cIntoZWFkaW5nLCBtZXNzYWdlLCBidXR0b25UcnVlLCBidXR0b25GYWxzZX1cIiAoYWxlcnRFdmVudCk+PC9jZi1hbGVydD5cbiAqL1xuXG5pbXBvcnQgeyBDb21wb25lbnQsIElucHV0LCBPdXRwdXQsIHR5cGUgT25DaGFuZ2VzLCB0eXBlIFNpbXBsZUNoYW5nZXMsIEV2ZW50RW1pdHRlciwgVmlld0NoaWxkIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBGb3JtQ29udHJvbCwgRm9ybUdyb3VwIH0gZnJvbSAnQGFuZ3VsYXIvZm9ybXMnO1xuaW1wb3J0IHR5cGUgeyBJb25Qb3BvdmVyIH0gZnJvbSAnQGlvbmljL2FuZ3VsYXInO1xuLy8tLS0gSW50ZXJmYWNlc1xuaW1wb3J0IHR5cGUgeyBBbGVydERhdGFJLCBBbGVydEV2ZW50SSB9IGZyb20gJy4uLy4uL2ludGVyZmFjZXMvYWxlcnQuaW50ZXJmYWNlJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnY2YtYWxlcnQnLFxuICB0ZW1wbGF0ZVVybDogJy4vYWxlcnQuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybDogJy4vYWxlcnQuY29tcG9uZW50LnNjc3MnLFxufSlcbmV4cG9ydCBjbGFzcyBBbGVydENvbXBvbmVudCBpbXBsZW1lbnRzIE9uQ2hhbmdlcyB7XG4gIEBWaWV3Q2hpbGQoJ3BvcG92ZXInKSBwb3BvdmVyPzogSW9uUG9wb3ZlcjtcblxuICBASW5wdXQoKSBkYXRhOiBBbGVydERhdGFJIHwgdW5kZWZpbmVkID0gdW5kZWZpbmVkO1xuICBAT3V0cHV0KCkgYWxlcnRFdmVudCA9IG5ldyBFdmVudEVtaXR0ZXI8QWxlcnRFdmVudEk+KCk7XG5cbiAgY3VzdG9tRXJyb3I6IHN0cmluZyB8IG51bGwgPSBudWxsO1xuXG4gIC8vLS0tIEZvcm1zXG4gIGFsZXJ0Rm9ybSA9IG5ldyBGb3JtR3JvdXAoe1xuICAgIGlucHV0VGV4dENvbnRyb2w6IG5ldyBGb3JtQ29udHJvbCgnJyksXG4gIH0pO1xuXG4gIC8qKi0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS1cbiAgICogQG5hbWUgICAgICAgICAgbmdPbkNoYW5nZXNcbiAgICogQGRlc2NyaXB0aW9uICAgVXBkYXRlIHZhcmlvdXMgdmFsdWVzIG9uIGNvbXBvbmVudCBpbnB1dCBjaGFuZ2VzXG4gICAqIEBwYXJhbSAgICAgICAgIHtTaW1wbGVDaGFuZ2VzfSBjaGFuZ2VzIC0gVGhlIGNoYW5nZWQgaW5wdXQgcHJvcGVydGllc1xuICAgKiBAcmV0dXJucyAgICAgICB7dm9pZH1cbiAgICovXG4gIG5nT25DaGFuZ2VzKGNoYW5nZXM6IFNpbXBsZUNoYW5nZXMpOiB2b2lkIHtcbiAgICBjb25zdCB2YWwgPSBjaGFuZ2VzWydkYXRhJ10/LmN1cnJlbnRWYWx1ZSBhcyB0eXBlb2YgdGhpcy5kYXRhO1xuXG4gICAgaWYgKHZhbCkge1xuICAgICAgdGhpcy5kYXRhID0gdmFsO1xuICAgICAgdGhpcy5hbGVydEZvcm0ucmVzZXQoKTtcbiAgICAgIC8vLS0tIFZhbGlkYXRvcnNcbiAgICAgIGlmICh0aGlzLmRhdGEuaW5wdXQ/LnZhbGlkYXRvcnMpIHRoaXMuYWxlcnRGb3JtLmNvbnRyb2xzLmlucHV0VGV4dENvbnRyb2wuc2V0VmFsaWRhdG9ycyh0aGlzLmRhdGEuaW5wdXQudmFsaWRhdG9ycyk7XG4gICAgICBlbHNlIHRoaXMuYWxlcnRGb3JtLmNvbnRyb2xzLmlucHV0VGV4dENvbnRyb2wuY2xlYXJWYWxpZGF0b3JzKCk7XG4gICAgICB0aGlzLmFsZXJ0Rm9ybS5jb250cm9scy5pbnB1dFRleHRDb250cm9sLnVwZGF0ZVZhbHVlQW5kVmFsaWRpdHkoKTtcbiAgICAgIC8vLS0tIEN1c3RvbSBlcnJvclxuICAgICAgaWYgKHRoaXMuZGF0YS5pbnB1dD8uY3VzdG9tRXJyb3IpIHRoaXMuY3VzdG9tRXJyb3IgPSB0aGlzLmRhdGEuaW5wdXQuY3VzdG9tRXJyb3I7XG4gICAgICAvLy0tLSBPcGVuIGFsZXJ0XG4gICAgICB0aGlzLnBvcG92ZXI/LnByZXNlbnQoKTtcbiAgICB9XG4gIH1cbiAgLyoqLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLVxuICAgKiBAbmFtZSAgICAgICAgICBoYW5kbGVBbGVydFxuICAgKiBAZGVzY3JpcHRpb24gICBEZXNjcmlwdGlvblxuICAgKiBAcGFyYW0gICAgICAgICB7Ym9vbGVhbn0gc3RhdHVzXG4gICAqIEByZXR1cm5zICAgICAgIHt2b2lkfVxuICAgKi9cbiAgaGFuZGxlQWxlcnQoc3RhdHVzOiBib29sZWFuKTogdm9pZCB7XG4gICAgdGhpcy5hbGVydEV2ZW50LmVtaXQoe1xuICAgICAgaWRlbnRpZmllcjogdGhpcy5kYXRhPy5hbGVydElkZW50aWZpZXIgPz8gJycsXG4gICAgICBzdGF0dXM6IHN0YXR1cyxcbiAgICAgIC4uLih0aGlzLmRhdGE/LmlucHV0ICYmIHRoaXMuYWxlcnRGb3JtLnZhbHVlLmlucHV0VGV4dENvbnRyb2wgPyB7IGlucHV0VmFsdWU6IHRoaXMuYWxlcnRGb3JtLnZhbHVlLmlucHV0VGV4dENvbnRyb2wgfSA6IHt9KSxcbiAgICB9KTtcbiAgICB0aGlzLnBvcG92ZXI/LmRpc21pc3MoKTtcbiAgfVxufVxuIiwiPGlvbi1wb3BvdmVyICNwb3BvdmVyIGNzc0NsYXNzPVwiY2FyZS1maXJzdC1hbGVydFwiIGJhY2tkcm9wRGlzbWlzcz1cImZhbHNlXCI+XG4gIDxuZy10ZW1wbGF0ZSAjcG9wb3ZlckNvbnRlbnQ+XG4gICAgPGRpdiBjbGFzcz1cInBvcG92ZXItd3JhcHBlclwiPlxuICAgICAgPG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PlxuICAgICAgPGg0Pnt7IGRhdGE/LmhlYWRpbmcgfX08L2g0PlxuICAgICAgPGNmLXNwYWNlciBkZWZhdWx0PVwiOFwiPjwvY2Ytc3BhY2VyPlxuICAgICAgPHAgY2xhc3M9XCJib2R5LW1lZGl1bVwiPnt7IGRhdGE/Lm1lc3NhZ2UgfX08L3A+XG4gICAgICA8Y2Ytc3BhY2VyIGRlZmF1bHQ9XCIyNFwiPjwvY2Ytc3BhY2VyPlxuICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cImRhdGE/LmlucHV0XCI+XG4gICAgICAgIDxmb3JtIFtmb3JtR3JvdXBdPVwiYWxlcnRGb3JtXCI+XG4gICAgICAgICAgPGNmLWZvcm0taW5wdXRcbiAgICAgICAgICAgIFtwbGFjZWhvbGRlcl09XCJkYXRhPy5pbnB1dD8ucGxhY2Vob2xkZXJcIlxuICAgICAgICAgICAgW2NvbnRyb2xdPVwiYWxlcnRGb3JtLmNvbnRyb2xzLmlucHV0VGV4dENvbnRyb2xcIlxuICAgICAgICAgICAgW2N1c3RvbUVycm9yTWVzc2FnZV09XCJjdXN0b21FcnJvclwiXG4gICAgICAgICAgICAodmFsdWVDaGFuZ2UpPVwiY3VzdG9tRXJyb3IgPSAnJ1wiPjwvY2YtZm9ybS1pbnB1dD5cbiAgICAgICAgPC9mb3JtPlxuICAgICAgICA8Y2Ytc3BhY2VyIGRlZmF1bHQ9XCIyNFwiPjwvY2Ytc3BhY2VyPlxuICAgICAgPC9uZy1jb250YWluZXI+XG5cbiAgICAgIDxkaXYgc3R5bGU9XCJkaXNwbGF5OiBncmlkOyBnYXA6IDEycHhcIj5cbiAgICAgICAgPGNmLWJ0biB0eXBlPVwicHJpbWFyeVwiIGZvbnRTaXplPVwibGFyZ2VcIiBbZGlzYWJsZWRdPVwiZGF0YT8uaW5wdXQ/LnZhbGlkYXRvcnMgJiYgYWxlcnRGb3JtLmludmFsaWRcIiAoY2xpY2spPVwiaGFuZGxlQWxlcnQodHJ1ZSlcIj57e1xuICAgICAgICAgIGRhdGE/LmJ1dHRvblRydWUgfHwgJ09LJ1xuICAgICAgICB9fTwvY2YtYnRuPlxuICAgICAgICA8Y2YtYnRuICpuZ0lmPVwiZGF0YSAmJiBkYXRhLmJ1dHRvbkZhbHNlICE9PSBudWxsXCIgZm9udFNpemU9XCJsYXJnZVwiIHR5cGU9XCJ0ZXJ0aWFyeVwiIGFsZXJ0IChjbGljayk9XCJoYW5kbGVBbGVydChmYWxzZSlcIj57e1xuICAgICAgICAgIGRhdGEuYnV0dG9uRmFsc2UgfHwgJ0NhbmNlbCdcbiAgICAgICAgfX08L2NmLWJ0bj5cbiAgICAgIDwvZGl2PlxuICAgIDwvZGl2PlxuICA8L25nLXRlbXBsYXRlPlxuPC9pb24tcG9wb3Zlcj5cbiJdfQ==
|
|
@@ -714,9 +714,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
714
714
|
}] } });
|
|
715
715
|
|
|
716
716
|
class AlertComponent {
|
|
717
|
+
popover;
|
|
717
718
|
data = undefined;
|
|
718
719
|
alertEvent = new EventEmitter();
|
|
719
|
-
isPopoverOpen = false;
|
|
720
720
|
customError = null;
|
|
721
721
|
alertForm = new FormGroup({
|
|
722
722
|
inputTextControl: new FormControl(''),
|
|
@@ -733,7 +733,7 @@ class AlertComponent {
|
|
|
733
733
|
this.alertForm.controls.inputTextControl.updateValueAndValidity();
|
|
734
734
|
if (this.data.input?.customError)
|
|
735
735
|
this.customError = this.data.input.customError;
|
|
736
|
-
this.
|
|
736
|
+
this.popover?.present();
|
|
737
737
|
}
|
|
738
738
|
}
|
|
739
739
|
handleAlert(status) {
|
|
@@ -742,15 +742,18 @@ class AlertComponent {
|
|
|
742
742
|
status: status,
|
|
743
743
|
...(this.data?.input && this.alertForm.value.inputTextControl ? { inputValue: this.alertForm.value.inputTextControl } : {}),
|
|
744
744
|
});
|
|
745
|
-
this.
|
|
745
|
+
this.popover?.dismiss();
|
|
746
746
|
}
|
|
747
747
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
748
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: AlertComponent, selector: "cf-alert", inputs: { data: "data" }, outputs: { alertEvent: "alertEvent" }, usesOnChanges: true, ngImport: i0, template: "<ion-popover
|
|
748
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: AlertComponent, selector: "cf-alert", inputs: { data: "data" }, outputs: { alertEvent: "alertEvent" }, viewQueries: [{ propertyName: "popover", first: true, predicate: ["popover"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ion-popover #popover cssClass=\"care-first-alert\" backdropDismiss=\"false\">\n <ng-template #popoverContent>\n <div class=\"popover-wrapper\">\n <ng-content></ng-content>\n <h4>{{ data?.heading }}</h4>\n <cf-spacer default=\"8\"></cf-spacer>\n <p class=\"body-medium\">{{ data?.message }}</p>\n <cf-spacer default=\"24\"></cf-spacer>\n <ng-container *ngIf=\"data?.input\">\n <form [formGroup]=\"alertForm\">\n <cf-form-input\n [placeholder]=\"data?.input?.placeholder\"\n [control]=\"alertForm.controls.inputTextControl\"\n [customErrorMessage]=\"customError\"\n (valueChange)=\"customError = ''\"></cf-form-input>\n </form>\n <cf-spacer default=\"24\"></cf-spacer>\n </ng-container>\n\n <div style=\"display: grid; gap: 12px\">\n <cf-btn type=\"primary\" fontSize=\"large\" [disabled]=\"data?.input?.validators && alertForm.invalid\" (click)=\"handleAlert(true)\">{{\n data?.buttonTrue || 'OK'\n }}</cf-btn>\n <cf-btn *ngIf=\"data && data.buttonFalse !== null\" fontSize=\"large\" type=\"tertiary\" alert (click)=\"handleAlert(false)\">{{\n data.buttonFalse || 'Cancel'\n }}</cf-btn>\n </div>\n </div>\n </ng-template>\n</ion-popover>\n", styles: [".care-first-alert::part(content){top:50%!important;left:50%!important;transform:translate(-50%,-50%)!important;width:100%;max-width:358px;border-radius:16px;text-align:center!important;justify-content:center!important}@media (min-width: 768px){.care-first-alert::part(content){max-width:420px}}.care-first-alert .popover-wrapper{width:100%;padding:48px 24px 24px}\n"], dependencies: [{ kind: "component", type: i1.IonPopover, selector: "ion-popover" }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: ButtonComponent, selector: "cf-btn", inputs: ["type", "disabled", "alert", "action", "white", "snug", "accent", "fontSize", "iconStart", "iconEnd", "loading", "loadingText", "customColor"] }, { kind: "component", type: SpacerComponent, selector: "cf-spacer", inputs: ["default", "mobile", "desktop"] }, { kind: "component", type: FormInputComponent, selector: "cf-form-input", inputs: ["label", "min", "max", "labelPlacement", "placeholder", "inputmode", "autoCapitalize", "type", "noClearButton", "control", "textCenter", "maxLength", "greyBackground", "customErrorMessage", "value"], outputs: ["valueChange"] }] });
|
|
749
749
|
}
|
|
750
750
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AlertComponent, decorators: [{
|
|
751
751
|
type: Component,
|
|
752
|
-
args: [{ selector: 'cf-alert', template: "<ion-popover
|
|
753
|
-
}], propDecorators: {
|
|
752
|
+
args: [{ selector: 'cf-alert', template: "<ion-popover #popover cssClass=\"care-first-alert\" backdropDismiss=\"false\">\n <ng-template #popoverContent>\n <div class=\"popover-wrapper\">\n <ng-content></ng-content>\n <h4>{{ data?.heading }}</h4>\n <cf-spacer default=\"8\"></cf-spacer>\n <p class=\"body-medium\">{{ data?.message }}</p>\n <cf-spacer default=\"24\"></cf-spacer>\n <ng-container *ngIf=\"data?.input\">\n <form [formGroup]=\"alertForm\">\n <cf-form-input\n [placeholder]=\"data?.input?.placeholder\"\n [control]=\"alertForm.controls.inputTextControl\"\n [customErrorMessage]=\"customError\"\n (valueChange)=\"customError = ''\"></cf-form-input>\n </form>\n <cf-spacer default=\"24\"></cf-spacer>\n </ng-container>\n\n <div style=\"display: grid; gap: 12px\">\n <cf-btn type=\"primary\" fontSize=\"large\" [disabled]=\"data?.input?.validators && alertForm.invalid\" (click)=\"handleAlert(true)\">{{\n data?.buttonTrue || 'OK'\n }}</cf-btn>\n <cf-btn *ngIf=\"data && data.buttonFalse !== null\" fontSize=\"large\" type=\"tertiary\" alert (click)=\"handleAlert(false)\">{{\n data.buttonFalse || 'Cancel'\n }}</cf-btn>\n </div>\n </div>\n </ng-template>\n</ion-popover>\n", styles: [".care-first-alert::part(content){top:50%!important;left:50%!important;transform:translate(-50%,-50%)!important;width:100%;max-width:358px;border-radius:16px;text-align:center!important;justify-content:center!important}@media (min-width: 768px){.care-first-alert::part(content){max-width:420px}}.care-first-alert .popover-wrapper{width:100%;padding:48px 24px 24px}\n"] }]
|
|
753
|
+
}], propDecorators: { popover: [{
|
|
754
|
+
type: ViewChild,
|
|
755
|
+
args: ['popover']
|
|
756
|
+
}], data: [{
|
|
754
757
|
type: Input
|
|
755
758
|
}], alertEvent: [{
|
|
756
759
|
type: Output
|