@carefirst/library 1.2.2 → 1.2.5
Sign up to get free protection for your applications and to get access to all the features.
- package/esm2022/lib/components/alert/alert.component.mjs +11 -9
- package/esm2022/lib/components/button/button.component.mjs +2 -2
- package/esm2022/lib/components/icon/icon.component.mjs +3 -3
- package/esm2022/lib/components/notification/notification.component.mjs +3 -3
- package/esm2022/lib/interfaces/alert.interface.mjs +1 -1
- package/esm2022/lib/interfaces/icon.interface.mjs +2 -1
- package/esm2022/lib/interfaces/notification.interface.mjs +1 -1
- package/fesm2022/carefirst-library.mjs +17 -14
- package/fesm2022/carefirst-library.mjs.map +1 -1
- package/lib/components/alert/alert.component.d.ts +3 -3
- package/lib/components/notification/notification.component.d.ts +1 -1
- package/lib/interfaces/alert.interface.d.ts +5 -0
- package/lib/interfaces/icon.interface.d.ts +1 -1
- package/lib/interfaces/notification.interface.d.ts +1 -0
- package/package.json +1 -1
@@ -10,35 +10,37 @@ export class AlertComponent {
|
|
10
10
|
this.alertController = alertController;
|
11
11
|
}
|
12
12
|
ngOnChanges(changes) {
|
13
|
-
|
13
|
+
const val = changes['data']?.currentValue;
|
14
|
+
if (val)
|
15
|
+
this.showAlert(val);
|
14
16
|
}
|
15
17
|
async showAlert(data) {
|
16
18
|
const alert = await this.alertController.create({
|
17
|
-
header: data
|
18
|
-
message: data
|
19
|
+
header: data.heading,
|
20
|
+
message: data.message,
|
19
21
|
cssClass: 'care-first-alert',
|
20
22
|
mode: 'md',
|
21
23
|
backdropDismiss: false,
|
22
24
|
buttons: [
|
23
25
|
{
|
24
|
-
text: data
|
26
|
+
text: data.buttonFalse || 'Cancel',
|
25
27
|
handler: () => {
|
26
|
-
this.alertEvent.emit(false);
|
28
|
+
this.alertEvent.emit({ identifier: data.alertIdentifier, status: false });
|
27
29
|
alert.dismiss();
|
28
30
|
},
|
29
31
|
cssClass: 'alert-button-cancel',
|
30
32
|
},
|
31
33
|
{
|
32
|
-
text: data
|
34
|
+
text: data.buttonTrue || 'OK',
|
33
35
|
handler: () => {
|
34
|
-
this.alertEvent.emit(true);
|
36
|
+
this.alertEvent.emit({ identifier: data.alertIdentifier, status: true });
|
35
37
|
alert.dismiss();
|
36
38
|
},
|
37
39
|
cssClass: 'alert-button-confirm',
|
38
40
|
},
|
39
41
|
],
|
40
42
|
});
|
41
|
-
|
43
|
+
alert.present();
|
42
44
|
}
|
43
45
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.3", ngImport: i0, type: AlertComponent, deps: [{ token: i1.AlertController }], target: i0.ɵɵFactoryTarget.Component });
|
44
46
|
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.3", type: AlertComponent, selector: "cf-alert", inputs: { data: "data" }, outputs: { alertEvent: "alertEvent" }, usesOnChanges: true, ngImport: i0, template: "", styles: ["::ng-deep .care-first-alert .alert-wrapper{padding:1.6rem;border-radius:1.6rem;background-color:var(--cf-app-background-light)}::ng-deep .care-first-alert .alert-wrapper>*{text-align:center;padding:0}::ng-deep .care-first-alert .alert-wrapper .alert-title{font-weight:900;font-size:2.8rem;color:var(--cf-app-text-color-default)}::ng-deep .care-first-alert .alert-wrapper .alert-message{font-size:1.8rem;margin-top:1.2rem}::ng-deep .care-first-alert .alert-wrapper .alert-button-group{margin-top:1.6rem;display:flex;justify-content:space-between}::ng-deep .care-first-alert .alert-wrapper button.alert-button{font-size:1.6rem;padding:.7rem 2.1rem}::ng-deep .care-first-alert .alert-wrapper button.alert-button.alert-button-cancel{color:var(--cf-app-system-color-error)}::ng-deep .care-first-alert .alert-wrapper button.alert-button.alert-button-confirm{border-radius:.6rem;background-color:var(--cf-app-color-primary);color:var(--cf-app-text-color-light)}\n"] });
|
@@ -51,4 +53,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.3", ngImpor
|
|
51
53
|
}], alertEvent: [{
|
52
54
|
type: Output
|
53
55
|
}] } });
|
54
|
-
//# sourceMappingURL=data:application/json;base64,
|
56
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYWxlcnQuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvY2FyZWZpcnN0L2xpYnJhcnkvc3JjL2xpYi9jb21wb25lbnRzL2FsZXJ0L2FsZXJ0LmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2NhcmVmaXJzdC9saWJyYXJ5L3NyYy9saWIvY29tcG9uZW50cy9hbGVydC9hbGVydC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFVQSxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQXNDLFlBQVksRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUMzRyxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sZ0JBQWdCLENBQUM7OztBQVFqRCxNQUFNLE9BQU8sY0FBYztJQU9JO0lBTnBCLElBQUksR0FBMkIsU0FBUyxDQUFDO0lBQ3hDLFVBQVUsR0FBRyxJQUFJLFlBQVksRUFBZSxDQUFDO0lBS3ZELFlBQTZCLGVBQWdDO1FBQWhDLG9CQUFlLEdBQWYsZUFBZSxDQUFpQjtJQUFHLENBQUM7SUFPakUsV0FBVyxDQUFDLE9BQXNCO1FBQ2hDLE1BQU0sR0FBRyxHQUFHLE9BQU8sQ0FBQyxNQUFNLENBQUMsRUFBRSxZQUFnQyxDQUFDO1FBQzlELElBQUksR0FBRztZQUFFLElBQUksQ0FBQyxTQUFTLENBQUMsR0FBRyxDQUFDLENBQUM7SUFDL0IsQ0FBQztJQVFELEtBQUssQ0FBQyxTQUFTLENBQUMsSUFBZ0I7UUFDOUIsTUFBTSxLQUFLLEdBQUcsTUFBTSxJQUFJLENBQUMsZUFBZSxDQUFDLE1BQU0sQ0FBQztZQUM5QyxNQUFNLEVBQUUsSUFBSSxDQUFDLE9BQU87WUFDcEIsT0FBTyxFQUFFLElBQUksQ0FBQyxPQUFPO1lBQ3JCLFFBQVEsRUFBRSxrQkFBa0I7WUFDNUIsSUFBSSxFQUFFLElBQUk7WUFDVixlQUFlLEVBQUUsS0FBSztZQUN0QixPQUFPLEVBQUU7Z0JBQ1A7b0JBQ0UsSUFBSSxFQUFFLElBQUksQ0FBQyxXQUFXLElBQUksUUFBUTtvQkFDbEMsT0FBTyxFQUFFLEdBQUcsRUFBRTt3QkFDWixJQUFJLENBQUMsVUFBVSxDQUFDLElBQUksQ0FBQyxFQUFFLFVBQVUsRUFBRSxJQUFJLENBQUMsZUFBZSxFQUFFLE1BQU0sRUFBRSxLQUFLLEVBQUUsQ0FBQyxDQUFDO3dCQUMxRSxLQUFLLENBQUMsT0FBTyxFQUFFLENBQUM7b0JBQ2xCLENBQUM7b0JBQ0QsUUFBUSxFQUFFLHFCQUFxQjtpQkFDaEM7Z0JBQ0Q7b0JBQ0UsSUFBSSxFQUFFLElBQUksQ0FBQyxVQUFVLElBQUksSUFBSTtvQkFDN0IsT0FBTyxFQUFFLEdBQUcsRUFBRTt3QkFDWixJQUFJLENBQUMsVUFBVSxDQUFDLElBQUksQ0FBQyxFQUFFLFVBQVUsRUFBRSxJQUFJLENBQUMsZUFBZSxFQUFFLE1BQU0sRUFBRSxJQUFJLEVBQUUsQ0FBQyxDQUFDO3dCQUN6RSxLQUFLLENBQUMsT0FBTyxFQUFFLENBQUM7b0JBQ2xCLENBQUM7b0JBQ0QsUUFBUSxFQUFFLHNCQUFzQjtpQkFDakM7YUFDRjtTQUNGLENBQUMsQ0FBQztRQUNILEtBQUssQ0FBQyxPQUFPLEVBQUUsQ0FBQztJQUNsQixDQUFDO3VHQXBEVSxjQUFjOzJGQUFkLGNBQWMsc0lDbkIzQixFQUFBOzsyRkRtQmEsY0FBYztrQkFMMUIsU0FBUzsrQkFDRSxVQUFVO29GQUtYLElBQUk7c0JBQVosS0FBSztnQkFDSSxVQUFVO3NCQUFuQixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBDYXJlRmlyc3QgTGlicmFyeSBBbGVydFxuICpcbiAqIEBmaWxlICAgICAgICAgIGFsZXJ0LmNvbXBvbmVudFxuICogQGRlc2NyaXB0aW9uICAgQ29udGFpbnMgYWxsIHRoZSBsb2dpYyBmb3IgZ2VuZXJhdGluZyBhIENhcmVGaXJzdCBBbGVydFxuICogQGF1dGhvciAgICAgICAgQXJubyBKYW5zZW4gdmFuIFZ1dXJlblxuICogQHNpbmNlICAgICAgICAgMjAyMyAtIDExIC0gMzBcbiAqIEB1c2FnZSAgICAgICAgIDxjZi1hbGVydCBkYXRhPVwie2hlYWRpbmcsIG1lc3NhZ2UsIGJ1dHRvblRydWUsIGJ1dHRvbkZhbHNlfVwiIChhbGVydEV2ZW50KT48L2NmLWFsZXJ0PlxuICovXG5cbmltcG9ydCB7IENvbXBvbmVudCwgSW5wdXQsIE91dHB1dCwgdHlwZSBPbkNoYW5nZXMsIHR5cGUgU2ltcGxlQ2hhbmdlcywgRXZlbnRFbWl0dGVyIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBBbGVydENvbnRyb2xsZXIgfSBmcm9tICdAaW9uaWMvYW5ndWxhcic7XG5pbXBvcnQgdHlwZSB7IEFsZXJ0RGF0YUksIEFsZXJ0RXZlbnRJIH0gZnJvbSAnLi4vLi4vaW50ZXJmYWNlcy9hbGVydC5pbnRlcmZhY2UnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdjZi1hbGVydCcsXG4gIHRlbXBsYXRlVXJsOiAnLi9hbGVydC5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsOiAnLi9hbGVydC5jb21wb25lbnQuc2NzcycsXG59KVxuZXhwb3J0IGNsYXNzIEFsZXJ0Q29tcG9uZW50IGltcGxlbWVudHMgT25DaGFuZ2VzIHtcbiAgQElucHV0KCkgZGF0YTogQWxlcnREYXRhSSB8IHVuZGVmaW5lZCA9IHVuZGVmaW5lZDtcbiAgQE91dHB1dCgpIGFsZXJ0RXZlbnQgPSBuZXcgRXZlbnRFbWl0dGVyPEFsZXJ0RXZlbnRJPigpO1xuXG4gIC8qKi0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS1cbiAgICogQG5hbWUgIGNvbnN0cnVjdG9yXG4gICAqL1xuICBjb25zdHJ1Y3Rvcihwcml2YXRlIHJlYWRvbmx5IGFsZXJ0Q29udHJvbGxlcjogQWxlcnRDb250cm9sbGVyKSB7fVxuXG4gIC8qKi0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS1cbiAgICogQG5hbWUgICAgICAgICAgbmdPbmNoYW5nZVxuICAgKiBAZGVzY3JpcHRpb24gICBVcGRhdGUgdmFyaW91cyB2YWx1ZXMgb24gY29tcG9uZW50IGlucHV0IGNoYW5nZXNcbiAgICogQHJldHVybnMgICAgICAge3ZvaWR9XG4gICAqL1xuICBuZ09uQ2hhbmdlcyhjaGFuZ2VzOiBTaW1wbGVDaGFuZ2VzKTogdm9pZCB7XG4gICAgY29uc3QgdmFsID0gY2hhbmdlc1snZGF0YSddPy5jdXJyZW50VmFsdWUgYXMgdHlwZW9mIHRoaXMuZGF0YTtcbiAgICBpZiAodmFsKSB0aGlzLnNob3dBbGVydCh2YWwpO1xuICB9XG5cbiAgLyoqLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLS0tLVxuICAgKiBAbmFtZSAgICAgICAgICBzaG93QWxlcnRcbiAgICogQGRlc2NyaXB0aW9uICAgU2hvd1xuICAgKiBAcGFyYW0gICAgICAgICB7QWxlcnREYXRhSX0gZGF0YVxuICAgKiBAcmV0dXJucyAgICAgICB7UHJvbWlzZTx2b2lkPn1cbiAgICovXG4gIGFzeW5jIHNob3dBbGVydChkYXRhOiBBbGVydERhdGFJKTogUHJvbWlzZTx2b2lkPiB7XG4gICAgY29uc3QgYWxlcnQgPSBhd2FpdCB0aGlzLmFsZXJ0Q29udHJvbGxlci5jcmVhdGUoe1xuICAgICAgaGVhZGVyOiBkYXRhLmhlYWRpbmcsXG4gICAgICBtZXNzYWdlOiBkYXRhLm1lc3NhZ2UsXG4gICAgICBjc3NDbGFzczogJ2NhcmUtZmlyc3QtYWxlcnQnLFxuICAgICAgbW9kZTogJ21kJyxcbiAgICAgIGJhY2tkcm9wRGlzbWlzczogZmFsc2UsXG4gICAgICBidXR0b25zOiBbXG4gICAgICAgIHtcbiAgICAgICAgICB0ZXh0OiBkYXRhLmJ1dHRvbkZhbHNlIHx8ICdDYW5jZWwnLFxuICAgICAgICAgIGhhbmRsZXI6ICgpID0+IHtcbiAgICAgICAgICAgIHRoaXMuYWxlcnRFdmVudC5lbWl0KHsgaWRlbnRpZmllcjogZGF0YS5hbGVydElkZW50aWZpZXIsIHN0YXR1czogZmFsc2UgfSk7XG4gICAgICAgICAgICBhbGVydC5kaXNtaXNzKCk7XG4gICAgICAgICAgfSxcbiAgICAgICAgICBjc3NDbGFzczogJ2FsZXJ0LWJ1dHRvbi1jYW5jZWwnLFxuICAgICAgICB9LFxuICAgICAgICB7XG4gICAgICAgICAgdGV4dDogZGF0YS5idXR0b25UcnVlIHx8ICdPSycsXG4gICAgICAgICAgaGFuZGxlcjogKCkgPT4ge1xuICAgICAgICAgICAgdGhpcy5hbGVydEV2ZW50LmVtaXQoeyBpZGVudGlmaWVyOiBkYXRhLmFsZXJ0SWRlbnRpZmllciwgc3RhdHVzOiB0cnVlIH0pO1xuICAgICAgICAgICAgYWxlcnQuZGlzbWlzcygpO1xuICAgICAgICAgIH0sXG4gICAgICAgICAgY3NzQ2xhc3M6ICdhbGVydC1idXR0b24tY29uZmlybScsXG4gICAgICAgIH0sXG4gICAgICBdLFxuICAgIH0pO1xuICAgIGFsZXJ0LnByZXNlbnQoKTtcbiAgfVxufVxuIiwiIl19
|
@@ -44,11 +44,11 @@ export class ButtonComponent {
|
|
44
44
|
this.inputLoading = checkTruthAttribute(changes, 'loading', this.inputLoading);
|
45
45
|
}
|
46
46
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.3", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
47
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.3", type: ButtonComponent, selector: "cf-btn", inputs: { type: "type", disabled: "disabled", alert: "alert", action: "action", snug: "snug", fontSize: "fontSize", iconStart: "iconStart", iconEnd: "iconEnd", loading: "loading" }, host: { properties: { "style.pointer-events": "this.parentEvents" } }, usesOnChanges: true, ngImport: i0, template: "<ion-button\n [ngClass]=\"{\n 'cf-button-primary': inputType === 'primary',\n 'cf-button-secondary': inputType === 'secondary',\n 'cf-button-tertiary': inputType === 'tertiary',\n 'text-large': inputFontSize === 'large',\n 'text-small': inputFontSize === 'small',\n alert: inputAlert,\n action: inputAction,\n snug: inputSnug\n }\"\n mode=\"md\"\n [disabled]=\"inputDisabled\"\n *cfButtonLoader=\"inputLoading\">\n <cf-icon *ngIf=\"inputIconStart\" [icon]=\"inputIconStart\" style=\"--cf-svg-overwrite-stroke-color: var(--button-text-color)\"></cf-icon>\n <p>\n <ng-content></ng-content>\n </p>\n <cf-icon *ngIf=\"inputIconEnd\" [icon]=\"inputIconEnd\" style=\"--cf-svg-overwrite-stroke-color: var(--button-text-color)\"></cf-icon>\n</ion-button>\n", styles: ["ion-button[class^=cf-button-]{width:100%;min-height:5.6rem;border-radius:1rem .4rem 1rem 1rem;text-transform:capitalize;overflow:hidden;margin:0;--padding-top: 1.6rem;--padding-bottom: 1.6rem;--padding-start: 2.4rem;--padding-end: 2.4rem}ion-button[class^=cf-button-]>p{width:-moz-fit-content;width:fit-content;font-size:1.2rem;font-weight:500;font-style:normal;line-height:auto}ion-button[class^=cf-button-]>:not(:first-child){margin-left:2rem}ion-button[class^=cf-button-].action{border-radius:.6rem;min-height:3.6rem;--padding-top: .7rem;--padding-bottom: .7rem;--padding-start: 2.1rem;--padding-end: 2.1rem}ion-button[class^=cf-button-].snug{width:-moz-fit-content;width:fit-content;min-height:-moz-fit-content;min-height:fit-content}ion-button[class^=cf-button-].text-large>p{font-size:1.6rem}ion-button[class^=cf-button-].text-small>p{font-size:1rem}.cf-button-primary{--background: var(--cf-app-color-primary);--button-text-color: var(--cf-app-text-color-light)}.cf-button-primary p{color:var(--button-text-color)}.cf-button-primary[class*=disabled]{opacity:100%;--background: var(--cf-app-system-color-disabled);--button-text-color: #9d9d9d}.cf-button-primary[class*=disabled] p{color:var(--button-text-color)}.cf-button-primary.alert:not([class*=disabled]){--background: var(--cf-app-system-color-error);--button-text-color: var(--cf-app-text-color-light)}.cf-button-primary.alert:not([class*=disabled]) p{color:var(--button-text-color)}.cf-button-secondary{--background: transparent
|
47
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.3", type: ButtonComponent, selector: "cf-btn", inputs: { type: "type", disabled: "disabled", alert: "alert", action: "action", snug: "snug", fontSize: "fontSize", iconStart: "iconStart", iconEnd: "iconEnd", loading: "loading" }, host: { properties: { "style.pointer-events": "this.parentEvents" } }, usesOnChanges: true, ngImport: i0, template: "<ion-button\n [ngClass]=\"{\n 'cf-button-primary': inputType === 'primary',\n 'cf-button-secondary': inputType === 'secondary',\n 'cf-button-tertiary': inputType === 'tertiary',\n 'text-large': inputFontSize === 'large',\n 'text-small': inputFontSize === 'small',\n alert: inputAlert,\n action: inputAction,\n snug: inputSnug\n }\"\n mode=\"md\"\n [disabled]=\"inputDisabled\"\n *cfButtonLoader=\"inputLoading\">\n <cf-icon *ngIf=\"inputIconStart\" [icon]=\"inputIconStart\" style=\"--cf-svg-overwrite-stroke-color: var(--button-text-color)\"></cf-icon>\n <p>\n <ng-content></ng-content>\n </p>\n <cf-icon *ngIf=\"inputIconEnd\" [icon]=\"inputIconEnd\" style=\"--cf-svg-overwrite-stroke-color: var(--button-text-color)\"></cf-icon>\n</ion-button>\n", styles: ["ion-button[class^=cf-button-]{width:100%;min-height:5.6rem;border-radius:1rem .4rem 1rem 1rem;text-transform:capitalize;overflow:hidden;margin:0;--padding-top: 1.6rem;--padding-bottom: 1.6rem;--padding-start: 2.4rem;--padding-end: 2.4rem}ion-button[class^=cf-button-]>p{width:-moz-fit-content;width:fit-content;font-size:1.2rem;font-weight:500;font-style:normal;line-height:auto}ion-button[class^=cf-button-]>:not(:first-child){margin-left:2rem}ion-button[class^=cf-button-]::part(native){border-radius:1rem .4rem 1rem 1rem;box-shadow:none}ion-button[class^=cf-button-].action{border-radius:.6rem;min-height:3.6rem;--padding-top: .7rem;--padding-bottom: .7rem;--padding-start: 2.1rem;--padding-end: 2.1rem}ion-button[class^=cf-button-].action::part(native){border-radius:.6rem}ion-button[class^=cf-button-].snug{width:-moz-fit-content;width:fit-content;min-height:-moz-fit-content;min-height:fit-content}ion-button[class^=cf-button-].text-large>p{font-size:1.6rem}ion-button[class^=cf-button-].text-small>p{font-size:1rem}.cf-button-primary{--background: var(--cf-app-color-primary);--button-text-color: var(--cf-app-text-color-light)}.cf-button-primary p{color:var(--button-text-color)}.cf-button-primary[class*=disabled]{opacity:100%;--background: var(--cf-app-system-color-disabled);--button-text-color: #9d9d9d}.cf-button-primary[class*=disabled] p{color:var(--button-text-color)}.cf-button-primary.alert:not([class*=disabled]){--background: var(--cf-app-system-color-error);--button-text-color: var(--cf-app-text-color-light)}.cf-button-primary.alert:not([class*=disabled]) p{color:var(--button-text-color)}.cf-button-secondary{--background: transparent;--button-text-color: var(--cf-app-color-primary)}.cf-button-secondary p{color:var(--button-text-color)}.cf-button-secondary::part(native){border:.2rem solid var(--cf-app-color-primary)}.cf-button-secondary[class*=disabled]{opacity:100%;--button-text-color: var(--cf-app-system-color-disabled)}.cf-button-secondary[class*=disabled] p{color:var(--button-text-color)}.cf-button-secondary[class*=disabled]::part(native){border:.2rem solid var(--cf-app-system-color-disabled)}.cf-button-secondary.alert:not([class*=disabled]){--button-text-color: var(--cf-app-system-color-error)}.cf-button-secondary.alert:not([class*=disabled]) p{color:var(--button-text-color)}.cf-button-secondary.alert:not([class*=disabled])::part(native){border:.2rem solid var(--cf-app-system-color-error)}.cf-button-tertiary{--background: transparent;--button-text-color: var(--cf-app-color-primary)}.cf-button-tertiary p{color:var(--button-text-color)}.cf-button-tertiary[class*=disabled]{opacity:100%;--button-text-color: var(--cf-app-system-color-disabled)}.cf-button-tertiary[class*=disabled] p{color:var(--button-text-color)}.cf-button-tertiary.alert:not([class*=disabled]){--button-text-color: var(--cf-app-system-color-error)}.cf-button-tertiary.alert:not([class*=disabled]) p{color:var(--button-text-color)}\n"], dependencies: [{ kind: "component", type: i1.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.IconComponent, selector: "cf-icon", inputs: ["icon", "height", "iconColor"] }, { kind: "directive", type: i4.ButtonLoaderDirective, selector: "[cfButtonLoader]", inputs: ["cfButtonLoader"] }] });
|
48
48
|
}
|
49
49
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.3", ngImport: i0, type: ButtonComponent, decorators: [{
|
50
50
|
type: Component,
|
51
|
-
args: [{ selector: 'cf-btn', template: "<ion-button\n [ngClass]=\"{\n 'cf-button-primary': inputType === 'primary',\n 'cf-button-secondary': inputType === 'secondary',\n 'cf-button-tertiary': inputType === 'tertiary',\n 'text-large': inputFontSize === 'large',\n 'text-small': inputFontSize === 'small',\n alert: inputAlert,\n action: inputAction,\n snug: inputSnug\n }\"\n mode=\"md\"\n [disabled]=\"inputDisabled\"\n *cfButtonLoader=\"inputLoading\">\n <cf-icon *ngIf=\"inputIconStart\" [icon]=\"inputIconStart\" style=\"--cf-svg-overwrite-stroke-color: var(--button-text-color)\"></cf-icon>\n <p>\n <ng-content></ng-content>\n </p>\n <cf-icon *ngIf=\"inputIconEnd\" [icon]=\"inputIconEnd\" style=\"--cf-svg-overwrite-stroke-color: var(--button-text-color)\"></cf-icon>\n</ion-button>\n", styles: ["ion-button[class^=cf-button-]{width:100%;min-height:5.6rem;border-radius:1rem .4rem 1rem 1rem;text-transform:capitalize;overflow:hidden;margin:0;--padding-top: 1.6rem;--padding-bottom: 1.6rem;--padding-start: 2.4rem;--padding-end: 2.4rem}ion-button[class^=cf-button-]>p{width:-moz-fit-content;width:fit-content;font-size:1.2rem;font-weight:500;font-style:normal;line-height:auto}ion-button[class^=cf-button-]>:not(:first-child){margin-left:2rem}ion-button[class^=cf-button-].action{border-radius:.6rem;min-height:3.6rem;--padding-top: .7rem;--padding-bottom: .7rem;--padding-start: 2.1rem;--padding-end: 2.1rem}ion-button[class^=cf-button-].snug{width:-moz-fit-content;width:fit-content;min-height:-moz-fit-content;min-height:fit-content}ion-button[class^=cf-button-].text-large>p{font-size:1.6rem}ion-button[class^=cf-button-].text-small>p{font-size:1rem}.cf-button-primary{--background: var(--cf-app-color-primary);--button-text-color: var(--cf-app-text-color-light)}.cf-button-primary p{color:var(--button-text-color)}.cf-button-primary[class*=disabled]{opacity:100%;--background: var(--cf-app-system-color-disabled);--button-text-color: #9d9d9d}.cf-button-primary[class*=disabled] p{color:var(--button-text-color)}.cf-button-primary.alert:not([class*=disabled]){--background: var(--cf-app-system-color-error);--button-text-color: var(--cf-app-text-color-light)}.cf-button-primary.alert:not([class*=disabled]) p{color:var(--button-text-color)}.cf-button-secondary{--background: transparent
|
51
|
+
args: [{ selector: 'cf-btn', template: "<ion-button\n [ngClass]=\"{\n 'cf-button-primary': inputType === 'primary',\n 'cf-button-secondary': inputType === 'secondary',\n 'cf-button-tertiary': inputType === 'tertiary',\n 'text-large': inputFontSize === 'large',\n 'text-small': inputFontSize === 'small',\n alert: inputAlert,\n action: inputAction,\n snug: inputSnug\n }\"\n mode=\"md\"\n [disabled]=\"inputDisabled\"\n *cfButtonLoader=\"inputLoading\">\n <cf-icon *ngIf=\"inputIconStart\" [icon]=\"inputIconStart\" style=\"--cf-svg-overwrite-stroke-color: var(--button-text-color)\"></cf-icon>\n <p>\n <ng-content></ng-content>\n </p>\n <cf-icon *ngIf=\"inputIconEnd\" [icon]=\"inputIconEnd\" style=\"--cf-svg-overwrite-stroke-color: var(--button-text-color)\"></cf-icon>\n</ion-button>\n", styles: ["ion-button[class^=cf-button-]{width:100%;min-height:5.6rem;border-radius:1rem .4rem 1rem 1rem;text-transform:capitalize;overflow:hidden;margin:0;--padding-top: 1.6rem;--padding-bottom: 1.6rem;--padding-start: 2.4rem;--padding-end: 2.4rem}ion-button[class^=cf-button-]>p{width:-moz-fit-content;width:fit-content;font-size:1.2rem;font-weight:500;font-style:normal;line-height:auto}ion-button[class^=cf-button-]>:not(:first-child){margin-left:2rem}ion-button[class^=cf-button-]::part(native){border-radius:1rem .4rem 1rem 1rem;box-shadow:none}ion-button[class^=cf-button-].action{border-radius:.6rem;min-height:3.6rem;--padding-top: .7rem;--padding-bottom: .7rem;--padding-start: 2.1rem;--padding-end: 2.1rem}ion-button[class^=cf-button-].action::part(native){border-radius:.6rem}ion-button[class^=cf-button-].snug{width:-moz-fit-content;width:fit-content;min-height:-moz-fit-content;min-height:fit-content}ion-button[class^=cf-button-].text-large>p{font-size:1.6rem}ion-button[class^=cf-button-].text-small>p{font-size:1rem}.cf-button-primary{--background: var(--cf-app-color-primary);--button-text-color: var(--cf-app-text-color-light)}.cf-button-primary p{color:var(--button-text-color)}.cf-button-primary[class*=disabled]{opacity:100%;--background: var(--cf-app-system-color-disabled);--button-text-color: #9d9d9d}.cf-button-primary[class*=disabled] p{color:var(--button-text-color)}.cf-button-primary.alert:not([class*=disabled]){--background: var(--cf-app-system-color-error);--button-text-color: var(--cf-app-text-color-light)}.cf-button-primary.alert:not([class*=disabled]) p{color:var(--button-text-color)}.cf-button-secondary{--background: transparent;--button-text-color: var(--cf-app-color-primary)}.cf-button-secondary p{color:var(--button-text-color)}.cf-button-secondary::part(native){border:.2rem solid var(--cf-app-color-primary)}.cf-button-secondary[class*=disabled]{opacity:100%;--button-text-color: var(--cf-app-system-color-disabled)}.cf-button-secondary[class*=disabled] p{color:var(--button-text-color)}.cf-button-secondary[class*=disabled]::part(native){border:.2rem solid var(--cf-app-system-color-disabled)}.cf-button-secondary.alert:not([class*=disabled]){--button-text-color: var(--cf-app-system-color-error)}.cf-button-secondary.alert:not([class*=disabled]) p{color:var(--button-text-color)}.cf-button-secondary.alert:not([class*=disabled])::part(native){border:.2rem solid var(--cf-app-system-color-error)}.cf-button-tertiary{--background: transparent;--button-text-color: var(--cf-app-color-primary)}.cf-button-tertiary p{color:var(--button-text-color)}.cf-button-tertiary[class*=disabled]{opacity:100%;--button-text-color: var(--cf-app-system-color-disabled)}.cf-button-tertiary[class*=disabled] p{color:var(--button-text-color)}.cf-button-tertiary.alert:not([class*=disabled]){--button-text-color: var(--cf-app-system-color-error)}.cf-button-tertiary.alert:not([class*=disabled]) p{color:var(--button-text-color)}\n"] }]
|
52
52
|
}], propDecorators: { type: [{
|
53
53
|
type: Input
|
54
54
|
}], disabled: [{
|