@eui/mobile-core 17.4.0-snapshot-1724951526138 → 17.4.0-snapshot-1726214281497
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/docs/components/EuiMUserProfileInfosComponent.html +96 -36
- package/docs/components/EuimSliderInfoScreenComponent.html +124 -46
- package/docs/components/EuimUserProfileComponent.html +88 -32
- package/docs/dependencies.html +5 -5
- package/docs/js/search/search_index.js +2 -2
- package/esm2022/lib/components/euim-badge/euim-badge.component.mjs +2 -2
- package/esm2022/lib/components/euim-chip-selector/euim-chip-selector.component.mjs +2 -2
- package/esm2022/lib/components/euim-slider-info-screen/euim-slider-info-screen.component.mjs +30 -9
- package/esm2022/lib/components/layout/euim-user-profile/euim-user-profile-infos/euim-user-profile-infos.component.mjs +17 -8
- package/esm2022/lib/components/layout/euim-user-profile/euim-user-profile.component.mjs +15 -7
- package/fesm2022/eui-mobile-core.mjs +61 -23
- package/fesm2022/eui-mobile-core.mjs.map +1 -1
- package/lib/components/euim-slider-info-screen/euim-slider-info-screen.component.d.ts +5 -2
- package/lib/components/euim-slider-info-screen/euim-slider-info-screen.component.d.ts.map +1 -1
- package/lib/components/layout/euim-user-profile/euim-user-profile-infos/euim-user-profile-infos.component.d.ts +4 -2
- package/lib/components/layout/euim-user-profile/euim-user-profile-infos/euim-user-profile-infos.component.d.ts.map +1 -1
- package/lib/components/layout/euim-user-profile/euim-user-profile.component.d.ts +4 -2
- package/lib/components/layout/euim-user-profile/euim-user-profile.component.d.ts.map +1 -1
- package/package.json +1 -1
|
@@ -714,16 +714,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImpor
|
|
|
714
714
|
}] });
|
|
715
715
|
|
|
716
716
|
class EuimUserProfileComponent {
|
|
717
|
-
|
|
718
|
-
this.
|
|
717
|
+
get cssClasses() {
|
|
718
|
+
return this.getCssClasses();
|
|
719
|
+
}
|
|
720
|
+
getCssClasses() {
|
|
721
|
+
return [
|
|
722
|
+
'euim-user-profile',
|
|
723
|
+
this.color ? `euim-user-profile__backgroundcolor-${this.color}` : '',
|
|
724
|
+
].join(' ').trim();
|
|
719
725
|
}
|
|
720
726
|
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: EuimUserProfileComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
721
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.7", type: EuimUserProfileComponent, selector: "euim-user-profile", host: { properties: { "class": "this.
|
|
727
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.7", type: EuimUserProfileComponent, selector: "euim-user-profile", inputs: { color: "color" }, host: { properties: { "class": "this.cssClasses" } }, ngImport: i0, template: "<ng-content select=\"euim-user-profile-avatar\"></ng-content>\n<ng-content select=\"euim-user-profile-infos\"></ng-content>\n<ng-content select=\"euim-user-profile-action\"></ng-content>\n", styles: [".euim-user-profile{display:flex;padding:var(--eui-base-spacing-m);background-color:var(--eui-base-color-grey-5)}.euim-user-profile__backgroundcolor-primary{background-color:var(--eui-base-color-primary-100)}.euim-user-profile-avatar{margin-right:var(--eui-base-spacing-m)}.euim-user-profile-action ion-buttons{margin-top:calc(-1 * var(--eui-base-spacing-s));margin-right:calc(-1 * var(--eui-base-spacing-s));margin-left:var(--eui-base-spacing-2xs);color:var(--eui-base-color-primary-100)}.euim-user-profile-infos{width:calc(100% - (var(--eui-base-spacing-2xl) + var(--eui-base-spacing-l) + 2 * var(--eui-base-spacing-m)))}.euim-user-profile-infos [euimLabel]{color:var(--eui-base-color-grey-75)}.euim-user-profile-infos [euimLabelTitle]{color:var(--eui-base-color-grey-100)}.euim-user-profile-infos__color-white [euimLabel]{color:var(--eui-base-color-white)}.euim-user-profile-infos euim-user-profile-infos-item:not(:last-child){margin-bottom:var(--eui-base-spacing-2xs)}.euim-user-profile-infos-item{display:flex;margin-right:var(--eui-base-spacing-2xl);width:100%}.euim-user-profile-infos-item ion-icon{margin-right:var(--eui-base-spacing-2xs);min-width:var(--eui-base-spacing-m);min-height:var(--eui-base-spacing-m)}.euim-user-profile-infos-item p{text-overflow:ellipsis;overflow:hidden;white-space:nowrap;display:block}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
722
728
|
}
|
|
723
729
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: EuimUserProfileComponent, decorators: [{
|
|
724
730
|
type: Component,
|
|
725
|
-
args: [{ selector: 'euim-user-profile', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-content select=\"euim-user-profile-avatar\"></ng-content>\n<ng-content select=\"euim-user-profile-infos\"></ng-content>\n<ng-content select=\"euim-user-profile-action\"></ng-content>\n", styles: [".euim-user-profile{display:flex;padding:var(--eui-base-spacing-m);background-color:var(--eui-base-color-grey-5)}.euim-user-profile-avatar{margin-right:var(--eui-base-spacing-m)}.euim-user-profile-action ion-buttons{margin-top:calc(-1 * var(--eui-base-spacing-s));margin-right:calc(-1 * var(--eui-base-spacing-s));margin-left:var(--eui-base-spacing-2xs);color:var(--eui-base-color-primary-100)}.euim-user-profile-infos{width:calc(100% - (var(--eui-base-spacing-2xl) + var(--eui-base-spacing-l) + 2 * var(--eui-base-spacing-m)))}.euim-user-profile-infos [euimLabel]{color:var(--eui-base-color-grey-75)}.euim-user-profile-infos [euimLabelTitle]{color:var(--eui-base-color-grey-100)}.euim-user-profile-infos euim-user-profile-infos-item:not(:last-child){margin-bottom:var(--eui-base-spacing-2xs)}.euim-user-profile-infos-item{display:flex;margin-right:var(--eui-base-spacing-2xl);width:100%}.euim-user-profile-infos-item ion-icon{margin-right:var(--eui-base-spacing-2xs);min-width:var(--eui-base-spacing-m);min-height:var(--eui-base-spacing-m)}.euim-user-profile-infos-item p{text-overflow:ellipsis;overflow:hidden;white-space:nowrap;display:block}\n"] }]
|
|
726
|
-
}], propDecorators: {
|
|
731
|
+
args: [{ selector: 'euim-user-profile', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-content select=\"euim-user-profile-avatar\"></ng-content>\n<ng-content select=\"euim-user-profile-infos\"></ng-content>\n<ng-content select=\"euim-user-profile-action\"></ng-content>\n", styles: [".euim-user-profile{display:flex;padding:var(--eui-base-spacing-m);background-color:var(--eui-base-color-grey-5)}.euim-user-profile__backgroundcolor-primary{background-color:var(--eui-base-color-primary-100)}.euim-user-profile-avatar{margin-right:var(--eui-base-spacing-m)}.euim-user-profile-action ion-buttons{margin-top:calc(-1 * var(--eui-base-spacing-s));margin-right:calc(-1 * var(--eui-base-spacing-s));margin-left:var(--eui-base-spacing-2xs);color:var(--eui-base-color-primary-100)}.euim-user-profile-infos{width:calc(100% - (var(--eui-base-spacing-2xl) + var(--eui-base-spacing-l) + 2 * var(--eui-base-spacing-m)))}.euim-user-profile-infos [euimLabel]{color:var(--eui-base-color-grey-75)}.euim-user-profile-infos [euimLabelTitle]{color:var(--eui-base-color-grey-100)}.euim-user-profile-infos__color-white [euimLabel]{color:var(--eui-base-color-white)}.euim-user-profile-infos euim-user-profile-infos-item:not(:last-child){margin-bottom:var(--eui-base-spacing-2xs)}.euim-user-profile-infos-item{display:flex;margin-right:var(--eui-base-spacing-2xl);width:100%}.euim-user-profile-infos-item ion-icon{margin-right:var(--eui-base-spacing-2xs);min-width:var(--eui-base-spacing-m);min-height:var(--eui-base-spacing-m)}.euim-user-profile-infos-item p{text-overflow:ellipsis;overflow:hidden;white-space:nowrap;display:block}\n"] }]
|
|
732
|
+
}], propDecorators: { color: [{
|
|
733
|
+
type: Input
|
|
734
|
+
}], cssClasses: [{
|
|
727
735
|
type: HostBinding,
|
|
728
736
|
args: ['class']
|
|
729
737
|
}] } });
|
|
@@ -743,17 +751,26 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImpor
|
|
|
743
751
|
}] } });
|
|
744
752
|
|
|
745
753
|
class EuiMUserProfileInfosComponent {
|
|
746
|
-
|
|
747
|
-
this.
|
|
754
|
+
get cssClasses() {
|
|
755
|
+
return this.getCssClasses();
|
|
756
|
+
}
|
|
757
|
+
getCssClasses() {
|
|
758
|
+
return [
|
|
759
|
+
'euim-user-profile-infos',
|
|
760
|
+
this.color ? `euim-user-profile-infos__color-${this.color}` : '',
|
|
761
|
+
].join(' ').trim();
|
|
748
762
|
}
|
|
749
763
|
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: EuiMUserProfileInfosComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
750
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.7", type: EuiMUserProfileInfosComponent, selector: "euim-user-profile-infos", host: { properties: { "
|
|
764
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.7", type: EuiMUserProfileInfosComponent, selector: "euim-user-profile-infos", inputs: { color: "color" }, host: { properties: { "class": "this.cssClasses" } }, ngImport: i0, template: "<ng-content></ng-content>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
751
765
|
}
|
|
752
766
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: EuiMUserProfileInfosComponent, decorators: [{
|
|
753
767
|
type: Component,
|
|
754
|
-
args: [{ selector: 'euim-user-profile-infos', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content></ng-content>\n" }]
|
|
755
|
-
}], propDecorators: {
|
|
756
|
-
type:
|
|
768
|
+
args: [{ selector: 'euim-user-profile-infos', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<ng-content></ng-content>\n" }]
|
|
769
|
+
}], propDecorators: { color: [{
|
|
770
|
+
type: Input
|
|
771
|
+
}], cssClasses: [{
|
|
772
|
+
type: HostBinding,
|
|
773
|
+
args: ['class']
|
|
757
774
|
}] } });
|
|
758
775
|
|
|
759
776
|
class EuiMUserProfileInfosItemComponent {
|
|
@@ -1342,7 +1359,7 @@ class EuimBadgeComponent {
|
|
|
1342
1359
|
].join(' ').trim();
|
|
1343
1360
|
}
|
|
1344
1361
|
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: EuimBadgeComponent, deps: [{ token: BaseStatesDirective }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1345
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.7", type: EuimBadgeComponent, selector: "euim-badge", host: { properties: { "class": "this.cssClasses" } }, hostDirectives: [{ directive: BaseStatesDirective, inputs: ["euimPositionTopEnd", "euimPositionTopEnd", "euimSizeM", "euimSizeM", "euimSizeS", "euimSizeS", "euimSizeL", "euimSizeL", "color", "color"] }], ngImport: i0, template: "<ng-content></ng-content>\n", styles: [".euim-badge{display:inline-flex;align-items:center;justify-content:center;border-radius:50px;height:var(--eui-base-spacing-l);min-width:var(--eui-base-spacing-l);padding:var(--eui-base-spacing-2xs) var(--eui-base-spacing-xs);color:var(--eui-base-color-white);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--eui-base-font-size-s)!important;line-height:var(--eui-base-font-size-m)!important;font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700;box-sizing:border-box;letter-spacing:normal}.euim-badge[slot=start]{margin-inline-end:var(--eui-base-spacing-m)}.euim-badge[slot=end]{margin-inline-start:var(--eui-base-spacing-m)}.euim-avatar-icon{position:relative;overflow:visible}.euim-avatar-icon .euim-badge--position-top-end{position:absolute;right:-6px;top:-6px}ion-button .euim-badge--position-top-end,ion-tab-button span .euim-badge--position-top-end{position:absolute;top:calc(-1 * var(--eui-base-spacing-s));left:var(--eui-base-spacing-s)}ion-button .euim-badge--size-l.euim-badge--position-top-end,ion-tab-button span .euim-badge--size-l.euim-badge--position-top-end{position:absolute;top:calc(-1 * var(--eui-base-spacing-s));left:var(--eui-base-spacing-s)}ion-button .euim-badge--size-m.euim-badge--position-top-end,ion-tab-button span .euim-badge--size-m.euim-badge--position-top-end{position:absolute;top:calc(-1 * var(--eui-base-spacing-xs));left:var(--eui-base-spacing-s)}ion-button .euim-badge--size-s.euim-badge--position-top-end,ion-tab-button span .euim-badge--size-s.euim-badge--position-top-end{position:absolute;top:calc(-1 * var(--eui-base-spacing-2xs));left:var(--eui-base-spacing-s)}ion-button::part(native){overflow:visible}ion-tab-button span{position:relative}ion-tab-button span ion-icon{font-size:var(--eui-base-font-size-2xl)}.euim-badge--info{background:var(--eui-base-color-info-100)}.euim-badge--success{background:var(--eui-base-color-success-100)}.euim-badge--warning{background:var(--eui-base-color-warning-100)}.euim-badge--danger{background:var(--eui-base-color-danger-100)}.euim-badge--default{background:var(--eui-base-color-grey-20);color:var(--eui-base-color-grey-100)}.euim-badge--size-s{min-width:var(--eui-base-spacing-m);height:var(--eui-base-spacing-m);padding:0 var(--eui-base-spacing-2xs);font-size:var(--eui-base-font-size-xs)!important;line-height:var(--eui-base-font-size-m)!important}.euim-badge--size-m{min-width:calc(var(--eui-base-spacing-m) + var(--eui-base-spacing-2xs));height:calc(var(--eui-base-spacing-m) + var(--eui-base-spacing-2xs));padding:calc(var(--eui-base-spacing-2xs) / 2) calc(var(--eui-base-spacing-s) / 2);font-size:var(--eui-base-font-size-xs)!important;line-height:var(--eui-base-font-size-m)!important}.euim-badge--size-l{height:var(--eui-base-spacing-l);min-width:var(--eui-base-spacing-l);padding:var(--eui-base-spacing-2xs) var(--eui-base-spacing-xs);font-size:var(--eui-base-font-size-s)!important;line-height:var(--eui-base-font-size-m)!important}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1362
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.7", type: EuimBadgeComponent, selector: "euim-badge", host: { properties: { "class": "this.cssClasses" } }, hostDirectives: [{ directive: BaseStatesDirective, inputs: ["euimPositionTopEnd", "euimPositionTopEnd", "euimSizeM", "euimSizeM", "euimSizeS", "euimSizeS", "euimSizeL", "euimSizeL", "color", "color"] }], ngImport: i0, template: "<ng-content></ng-content>\n", styles: [".euim-badge{display:inline-flex;align-items:center;justify-content:center;border-radius:50px;height:var(--eui-base-spacing-l);min-width:var(--eui-base-spacing-l);padding:var(--eui-base-spacing-2xs) var(--eui-base-spacing-xs);color:var(--eui-base-color-white);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--eui-base-font-size-s)!important;line-height:var(--eui-base-font-size-m)!important;font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700;box-sizing:border-box;letter-spacing:normal}.euim-badge[slot=start]{margin-inline-end:var(--eui-base-spacing-m)}.euim-badge[slot=end]{margin-inline-start:var(--eui-base-spacing-m)}.euim-avatar-icon{position:relative;overflow:visible}.euim-avatar-icon .euim-badge--position-top-end{position:absolute;right:-6px;top:-6px}ion-button .euim-badge--position-top-end,ion-tab-button span .euim-badge--position-top-end{position:absolute;top:calc(-1 * var(--eui-base-spacing-s));left:var(--eui-base-spacing-s)}ion-button .euim-badge--size-l.euim-badge--position-top-end,ion-tab-button span .euim-badge--size-l.euim-badge--position-top-end{position:absolute;top:calc(-1 * var(--eui-base-spacing-s));left:var(--eui-base-spacing-s)}ion-button .euim-badge--size-m.euim-badge--position-top-end,ion-tab-button span .euim-badge--size-m.euim-badge--position-top-end{position:absolute;top:calc(-1 * var(--eui-base-spacing-xs));left:var(--eui-base-spacing-s)}ion-button .euim-badge--size-s.euim-badge--position-top-end,ion-tab-button span .euim-badge--size-s.euim-badge--position-top-end{position:absolute;top:calc(-1 * var(--eui-base-spacing-2xs));left:var(--eui-base-spacing-s)}ion-button::part(native){overflow:visible}ion-tab-button span{position:relative}ion-tab-button span ion-icon{font-size:var(--eui-base-font-size-2xl)}.euim-badge--info{background:var(--eui-base-color-info-100)}.euim-badge--success{background:var(--eui-base-color-success-100)}.euim-badge--warning{background:var(--eui-base-color-warning-100)}.euim-badge--danger{background:var(--eui-base-color-danger-100)}.euim-badge--white{background:var(--eui-base-color-white);color:var(--eui-base-color-primary-100)}.euim-badge--default{background:var(--eui-base-color-grey-20);color:var(--eui-base-color-grey-100)}.euim-badge--size-s{min-width:var(--eui-base-spacing-m);height:var(--eui-base-spacing-m);padding:0 var(--eui-base-spacing-2xs);font-size:var(--eui-base-font-size-xs)!important;line-height:var(--eui-base-font-size-m)!important}.euim-badge--size-m{min-width:calc(var(--eui-base-spacing-m) + var(--eui-base-spacing-2xs));height:calc(var(--eui-base-spacing-m) + var(--eui-base-spacing-2xs));padding:calc(var(--eui-base-spacing-2xs) / 2) calc(var(--eui-base-spacing-s) / 2);font-size:var(--eui-base-font-size-xs)!important;line-height:var(--eui-base-font-size-m)!important}.euim-badge--size-l{height:var(--eui-base-spacing-l);min-width:var(--eui-base-spacing-l);padding:var(--eui-base-spacing-2xs) var(--eui-base-spacing-xs);font-size:var(--eui-base-font-size-s)!important;line-height:var(--eui-base-font-size-m)!important}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1346
1363
|
}
|
|
1347
1364
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: EuimBadgeComponent, decorators: [{
|
|
1348
1365
|
type: Component,
|
|
@@ -1357,7 +1374,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImpor
|
|
|
1357
1374
|
'color',
|
|
1358
1375
|
],
|
|
1359
1376
|
},
|
|
1360
|
-
], template: "<ng-content></ng-content>\n", styles: [".euim-badge{display:inline-flex;align-items:center;justify-content:center;border-radius:50px;height:var(--eui-base-spacing-l);min-width:var(--eui-base-spacing-l);padding:var(--eui-base-spacing-2xs) var(--eui-base-spacing-xs);color:var(--eui-base-color-white);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--eui-base-font-size-s)!important;line-height:var(--eui-base-font-size-m)!important;font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700;box-sizing:border-box;letter-spacing:normal}.euim-badge[slot=start]{margin-inline-end:var(--eui-base-spacing-m)}.euim-badge[slot=end]{margin-inline-start:var(--eui-base-spacing-m)}.euim-avatar-icon{position:relative;overflow:visible}.euim-avatar-icon .euim-badge--position-top-end{position:absolute;right:-6px;top:-6px}ion-button .euim-badge--position-top-end,ion-tab-button span .euim-badge--position-top-end{position:absolute;top:calc(-1 * var(--eui-base-spacing-s));left:var(--eui-base-spacing-s)}ion-button .euim-badge--size-l.euim-badge--position-top-end,ion-tab-button span .euim-badge--size-l.euim-badge--position-top-end{position:absolute;top:calc(-1 * var(--eui-base-spacing-s));left:var(--eui-base-spacing-s)}ion-button .euim-badge--size-m.euim-badge--position-top-end,ion-tab-button span .euim-badge--size-m.euim-badge--position-top-end{position:absolute;top:calc(-1 * var(--eui-base-spacing-xs));left:var(--eui-base-spacing-s)}ion-button .euim-badge--size-s.euim-badge--position-top-end,ion-tab-button span .euim-badge--size-s.euim-badge--position-top-end{position:absolute;top:calc(-1 * var(--eui-base-spacing-2xs));left:var(--eui-base-spacing-s)}ion-button::part(native){overflow:visible}ion-tab-button span{position:relative}ion-tab-button span ion-icon{font-size:var(--eui-base-font-size-2xl)}.euim-badge--info{background:var(--eui-base-color-info-100)}.euim-badge--success{background:var(--eui-base-color-success-100)}.euim-badge--warning{background:var(--eui-base-color-warning-100)}.euim-badge--danger{background:var(--eui-base-color-danger-100)}.euim-badge--default{background:var(--eui-base-color-grey-20);color:var(--eui-base-color-grey-100)}.euim-badge--size-s{min-width:var(--eui-base-spacing-m);height:var(--eui-base-spacing-m);padding:0 var(--eui-base-spacing-2xs);font-size:var(--eui-base-font-size-xs)!important;line-height:var(--eui-base-font-size-m)!important}.euim-badge--size-m{min-width:calc(var(--eui-base-spacing-m) + var(--eui-base-spacing-2xs));height:calc(var(--eui-base-spacing-m) + var(--eui-base-spacing-2xs));padding:calc(var(--eui-base-spacing-2xs) / 2) calc(var(--eui-base-spacing-s) / 2);font-size:var(--eui-base-font-size-xs)!important;line-height:var(--eui-base-font-size-m)!important}.euim-badge--size-l{height:var(--eui-base-spacing-l);min-width:var(--eui-base-spacing-l);padding:var(--eui-base-spacing-2xs) var(--eui-base-spacing-xs);font-size:var(--eui-base-font-size-s)!important;line-height:var(--eui-base-font-size-m)!important}\n"] }]
|
|
1377
|
+
], template: "<ng-content></ng-content>\n", styles: [".euim-badge{display:inline-flex;align-items:center;justify-content:center;border-radius:50px;height:var(--eui-base-spacing-l);min-width:var(--eui-base-spacing-l);padding:var(--eui-base-spacing-2xs) var(--eui-base-spacing-xs);color:var(--eui-base-color-white);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--eui-base-font-size-s)!important;line-height:var(--eui-base-font-size-m)!important;font:normal normal 400 1rem/1.25rem var(--eui-base-font-family);font-weight:700;box-sizing:border-box;letter-spacing:normal}.euim-badge[slot=start]{margin-inline-end:var(--eui-base-spacing-m)}.euim-badge[slot=end]{margin-inline-start:var(--eui-base-spacing-m)}.euim-avatar-icon{position:relative;overflow:visible}.euim-avatar-icon .euim-badge--position-top-end{position:absolute;right:-6px;top:-6px}ion-button .euim-badge--position-top-end,ion-tab-button span .euim-badge--position-top-end{position:absolute;top:calc(-1 * var(--eui-base-spacing-s));left:var(--eui-base-spacing-s)}ion-button .euim-badge--size-l.euim-badge--position-top-end,ion-tab-button span .euim-badge--size-l.euim-badge--position-top-end{position:absolute;top:calc(-1 * var(--eui-base-spacing-s));left:var(--eui-base-spacing-s)}ion-button .euim-badge--size-m.euim-badge--position-top-end,ion-tab-button span .euim-badge--size-m.euim-badge--position-top-end{position:absolute;top:calc(-1 * var(--eui-base-spacing-xs));left:var(--eui-base-spacing-s)}ion-button .euim-badge--size-s.euim-badge--position-top-end,ion-tab-button span .euim-badge--size-s.euim-badge--position-top-end{position:absolute;top:calc(-1 * var(--eui-base-spacing-2xs));left:var(--eui-base-spacing-s)}ion-button::part(native){overflow:visible}ion-tab-button span{position:relative}ion-tab-button span ion-icon{font-size:var(--eui-base-font-size-2xl)}.euim-badge--info{background:var(--eui-base-color-info-100)}.euim-badge--success{background:var(--eui-base-color-success-100)}.euim-badge--warning{background:var(--eui-base-color-warning-100)}.euim-badge--danger{background:var(--eui-base-color-danger-100)}.euim-badge--white{background:var(--eui-base-color-white);color:var(--eui-base-color-primary-100)}.euim-badge--default{background:var(--eui-base-color-grey-20);color:var(--eui-base-color-grey-100)}.euim-badge--size-s{min-width:var(--eui-base-spacing-m);height:var(--eui-base-spacing-m);padding:0 var(--eui-base-spacing-2xs);font-size:var(--eui-base-font-size-xs)!important;line-height:var(--eui-base-font-size-m)!important}.euim-badge--size-m{min-width:calc(var(--eui-base-spacing-m) + var(--eui-base-spacing-2xs));height:calc(var(--eui-base-spacing-m) + var(--eui-base-spacing-2xs));padding:calc(var(--eui-base-spacing-2xs) / 2) calc(var(--eui-base-spacing-s) / 2);font-size:var(--eui-base-font-size-xs)!important;line-height:var(--eui-base-font-size-m)!important}.euim-badge--size-l{height:var(--eui-base-spacing-l);min-width:var(--eui-base-spacing-l);padding:var(--eui-base-spacing-2xs) var(--eui-base-spacing-xs);font-size:var(--eui-base-font-size-s)!important;line-height:var(--eui-base-font-size-m)!important}\n"] }]
|
|
1361
1378
|
}], ctorParameters: () => [{ type: BaseStatesDirective }], propDecorators: { cssClasses: [{
|
|
1362
1379
|
type: HostBinding,
|
|
1363
1380
|
args: ['class']
|
|
@@ -2072,7 +2089,6 @@ class EuimSliderInfoScreenComponent {
|
|
|
2072
2089
|
leftBtnName: '',
|
|
2073
2090
|
};
|
|
2074
2091
|
this.showLeftBtnAsPrevious = false;
|
|
2075
|
-
this.className = 'euim-slider-info-screen';
|
|
2076
2092
|
this.slidesArray = [];
|
|
2077
2093
|
this.currentSlide = 0;
|
|
2078
2094
|
this.startX = 0;
|
|
@@ -2080,6 +2096,9 @@ class EuimSliderInfoScreenComponent {
|
|
|
2080
2096
|
onResize(event) {
|
|
2081
2097
|
this.setSliderStyles();
|
|
2082
2098
|
}
|
|
2099
|
+
get cssClasses() {
|
|
2100
|
+
return this.getCssClasses();
|
|
2101
|
+
}
|
|
2083
2102
|
ngAfterViewInit() {
|
|
2084
2103
|
this.setSliderStyles();
|
|
2085
2104
|
}
|
|
@@ -2105,10 +2124,11 @@ class EuimSliderInfoScreenComponent {
|
|
|
2105
2124
|
this.renderer.setStyle(this.slides.nativeElement, 'width', `${this.slidesArray.length * 100}%`);
|
|
2106
2125
|
for (const slide of this.slidesArray) {
|
|
2107
2126
|
this.renderer.setStyle(slide, 'width', `${100 / this.slidesArray.length}%`);
|
|
2108
|
-
this.
|
|
2127
|
+
if (!this.isImageOnly()) {
|
|
2128
|
+
this.renderer.setStyle(slide, 'maxHeight', `${slideHeight}px`);
|
|
2129
|
+
}
|
|
2109
2130
|
this.renderer.setStyle(slide, 'overflow', 'auto');
|
|
2110
2131
|
}
|
|
2111
|
-
// to calculate the case when there is only one slide
|
|
2112
2132
|
if (!this.isLastItemReached && this.slidesArray.length < 2) {
|
|
2113
2133
|
this.isLastItemReached = true;
|
|
2114
2134
|
}
|
|
@@ -2179,12 +2199,28 @@ class EuimSliderInfoScreenComponent {
|
|
|
2179
2199
|
}
|
|
2180
2200
|
this.leftActionClicked.emit(event);
|
|
2181
2201
|
}
|
|
2202
|
+
isImageOnly() {
|
|
2203
|
+
return (this.slidesArray.length > 0 &&
|
|
2204
|
+
!document.querySelector('.euim-slider-info-screen__title') &&
|
|
2205
|
+
!document.querySelector('.euim-slider-info-screen__sub-title') &&
|
|
2206
|
+
!document.querySelector('.euim-slider-info-screen__content'));
|
|
2207
|
+
}
|
|
2208
|
+
getCssClasses() {
|
|
2209
|
+
const paginationClass = !this.paginationColor
|
|
2210
|
+
? 'pagination-color-primary'
|
|
2211
|
+
: `pagination-color-${this.paginationColor}`;
|
|
2212
|
+
return [
|
|
2213
|
+
'euim-slider-info-screen',
|
|
2214
|
+
this.isImageOnly() ? 'image-only' : '',
|
|
2215
|
+
paginationClass,
|
|
2216
|
+
].join(' ').trim();
|
|
2217
|
+
}
|
|
2182
2218
|
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: EuimSliderInfoScreenComponent, deps: [{ token: i0.Renderer2 }, { token: i1.GestureController }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2183
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.7", type: EuimSliderInfoScreenComponent, selector: "euim-slider-info-screen", inputs: { isCarousel: ["isCarousel", "isCarousel", booleanAttribute], showLeftBtn: ["showLeftBtn", "showLeftBtn", booleanAttribute], showRightBtn: ["showRightBtn", "showRightBtn", booleanAttribute], isPreviousBtn: ["isPreviousBtn", "isPreviousBtn", booleanAttribute], isNextBtn: ["isNextBtn", "isNextBtn", booleanAttribute], actionBtnNames: "actionBtnNames" }, outputs: { rightActionClicked: "rightActionClicked", lastStepActionClicked: "lastStepActionClicked", leftActionClicked: "leftActionClicked" }, host: { listeners: { "window:resize": "onResize($event)" }, properties: { "class": "this.
|
|
2219
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.7", type: EuimSliderInfoScreenComponent, selector: "euim-slider-info-screen", inputs: { isCarousel: ["isCarousel", "isCarousel", booleanAttribute], showLeftBtn: ["showLeftBtn", "showLeftBtn", booleanAttribute], showRightBtn: ["showRightBtn", "showRightBtn", booleanAttribute], isPreviousBtn: ["isPreviousBtn", "isPreviousBtn", booleanAttribute], isNextBtn: ["isNextBtn", "isNextBtn", booleanAttribute], paginationColor: "paginationColor", actionBtnNames: "actionBtnNames" }, outputs: { rightActionClicked: "rightActionClicked", lastStepActionClicked: "lastStepActionClicked", leftActionClicked: "leftActionClicked" }, host: { listeners: { "window:resize": "onResize($event)" }, properties: { "class": "this.cssClasses" } }, viewQueries: [{ propertyName: "slides", first: true, predicate: ["slides"], descendants: true, static: true }], ngImport: i0, template: "<div #sliderElement class=\"euim-slider-info-screen__slider-container\" >\n <div #slides class=\"euim-slider-info-screen__slides\">\n <ng-content></ng-content>\n </div>\n\n @if (!isImageOnly()) {\n <div class=\"euim-slider-info-screen__pagination-container\">\n @if (showLeftBtn || showRightBtn || isCarousel || isLastItemReached){\n <div class=\"euim-slider-info-screen__pagination-container\">\n @if (showLeftBtn && !showLeftBtnAsPrevious && !isPreviousBtn) {\n <ion-button (click)=\"onLeftBtnAction($event)\"\n class=\"euim-slider-info-screen__action-button euim-slider-info-screen__action-button--left\"\n fill=\"clear\">{{actionBtnNames.leftBtnName}}</ion-button>\n }\n @if (showLeftBtnAsPrevious) {\n <ion-button (click)=\"onLeftBtnAction($event)\"\n class=\"euim-slider-info-screen__action-button euim-slider-info-screen__action-button--left\"\n fill=\"clear\">{{actionBtnNames.leftBtnName || 'euim.slider-info-screen.LEFT-BTN-NAME' |\n translate}}</ion-button>\n }\n @if (isCarousel){\n <div class=\"euim-slider-info-screen__pagination\">\n <span (click)=\"goToSlide(i)\" *ngFor=\"let slide of slidesArray; let i = index\"\n [ngClass]=\"{ 'active': currentSlide === i }\" class=\"euim-slider-info-screen__span\"></span>\n </div>\n }\n @if (!isLastItemReached && !isNextBtn || isNextBtn && showRightBtn) {\n <ion-button (click)=\"onRightBtnAction($event)\"\n class=\"euim-slider-info-screen__action-button euim-slider-info-screen__action-button--right\"\n fill=\"clear\">{{actionBtnNames.rightBtnName || 'euim.slider-info-screen.RIGHT-BTN-NAME' |\n translate}}</ion-button>\n }\n\n @if (isLastItemReached) {\n <ion-button (click)=\"onLastStepAction($event)\"\n class=\"euim-slider-info-screen__action-button euim-slider-info-screen__action-button--right\"\n fill=\"clear\">{{actionBtnNames.lastStepActionBtnName ||\n 'euim.slider-info-screen.LAST-STEP-ACTION-BTN-NAME' | translate}}</ion-button>\n }\n </div>\n }\n </div>\n }\n\n @if (isImageOnly()) {\n <div class=\"euim-slider-info-screen__pagination-container--over-image\">\n <div class=\"euim-slider-info-screen__pagination\">\n <span (click)=\"goToSlide(i)\" *ngFor=\"let slide of slidesArray; let i = index\"\n [ngClass]=\"{ 'active': currentSlide === i }\" \n class=\"euim-slider-info-screen__span\" ></span>\n </div>\n </div>\n }\n\n</div>", styles: [".euim-slider-info-screen__slider-container{overflow:hidden;position:relative;height:100vh}.euim-slider-info-screen__slides{display:flex;transition:all .5s ease;height:100%;width:100%}.euim-slider-info-screen__slide{width:100%;height:100%}.euim-slider-info-screen__pagination-container--over-image{position:absolute;bottom:20px;left:50%;transform:translate(-50%);display:flex;align-items:center;justify-content:center;z-index:1}.euim-slider-info-screen__pagination-container{position:fixed;bottom:0;left:0;right:0;display:flex;align-items:center;justify-content:center;height:60px}.euim-slider-info-screen__pagination{display:flex}.euim-slider-info-screen__span{width:calc(var(--eui-base-spacing-xs) + var(--eui-base-spacing-2xs) / 2);height:calc(var(--eui-base-spacing-xs) + var(--eui-base-spacing-2xs) / 2);border-radius:50%;cursor:pointer}.euim-slider-info-screen__span:not(:last-child){margin-right:var(--eui-base-spacing-xs)}.euim-slider-info-screen.pagination-color-primary .euim-slider-info-screen__span{border:1px solid var(--eui-base-color-primary-100)!important;background-color:transparent}.euim-slider-info-screen.pagination-color-primary .euim-slider-info-screen__span.active{background-color:var(--eui-base-color-primary-100)!important}.euim-slider-info-screen.pagination-color-white .euim-slider-info-screen__span{border:1px solid var(--eui-base-color-white)!important;background-color:transparent}.euim-slider-info-screen.pagination-color-white .euim-slider-info-screen__span.active{background-color:var(--eui-base-color-white)!important}.euim-slider-info-screen.pagination-color-success .euim-slider-info-screen__span{border:1px solid var(--eui-base-color-success-100)!important;background-color:transparent}.euim-slider-info-screen.pagination-color-success .euim-slider-info-screen__span.active{background-color:var(--eui-base-color-success-100)!important}.euim-slider-info-screen.pagination-color-warning .euim-slider-info-screen__span{border:1px solid var(--eui-base-color-warning-100)!important;background-color:transparent}.euim-slider-info-screen.pagination-color-warning .euim-slider-info-screen__span.active{background-color:var(--eui-base-color-warning-100)!important}.euim-slider-info-screen.pagination-color-warning .euim-slider-info-screen__span{border:1px solid var(--eui-base-color-info-100)!important;background-color:transparent}.euim-slider-info-screen.pagination-color-warning .euim-slider-info-screen__span.active{background-color:var(--eui-base-color-info-100)!important}.euim-slider-info-screen.pagination-color-dark .euim-slider-info-screen__span{border:1px solid var(--eui-base-color-grey-100)!important;background-color:transparent}.euim-slider-info-screen.pagination-color-dark .euim-slider-info-screen__span.active{background-color:var(--eui-base-color-grey-100)!important}.euim-slider-info-screen.pagination-color-danger .euim-slider-info-screen__span{border:1px solid var(--eui-base-color-danger-100)!important;background-color:transparent}.euim-slider-info-screen.pagination-color-danger .euim-slider-info-screen__span.active{background-color:var(--eui-base-color-danger-100)!important}.euim-slider-info-screen__action-button{position:absolute;color:var(--eui-base-color-primary-100);font-weight:700;top:50%;transform:translateY(-50%)}.euim-slider-info-screen__action-button::part(native){padding:0 var(--eui-base-spacing-m)}.euim-slider-info-screen__action-button--right{right:0;margin:0 var(--eui-base-spacing-xs) 0 var(--eui-base-spacing-m)}.euim-slider-info-screen__action-button--left{margin:0 var(--eui-base-spacing-m) 0 var(--eui-base-spacing-xs);left:0}.euim-slider-info-screen__title{font:normal normal 400 1.75rem/2rem var(--eui-base-font-family);font-weight:700;color:var(--eui-base-color-grey-100);margin-top:var(--eui-base-spacing-l);padding-left:var(--eui-base-spacing-l);padding-right:var(--eui-base-spacing-l)}.euim-slider-info-screen__sub-title{color:var(--eui-base-color-grey-75);padding-left:var(--eui-base-spacing-l);padding-right:var(--eui-base-spacing-l);font:normal normal 400 1.125rem/1.5rem var(--eui-base-font-family)}.euim-slider-info-screen__content{color:var(--eui-base-color-grey-100);padding-left:var(--eui-base-spacing-l);padding-right:var(--eui-base-spacing-l);font:normal normal 400 1.125rem/1.5rem var(--eui-base-font-family)}.euim-slider-info-screen__content--centered{text-align:center}.euim-slider-info-screen__title+.euim-slider-info-screen__sub-title{margin-top:var(--eui-base-spacing-2xs)}.euim-slider-info-screen__sub-title+.euim-slider-info-screen__content,title+.euim-slider-info-screen__content{margin-top:var(--eui-base-spacing-m)}.euim-slider-info-screen.image-only .euim-slider-info-screen__slider-container{height:auto}\n"], dependencies: [{ kind: "directive", type: i2$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { 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: "pipe", type: i1$1.TranslatePipe, name: "translate" }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
2184
2220
|
}
|
|
2185
2221
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: EuimSliderInfoScreenComponent, decorators: [{
|
|
2186
2222
|
type: Component,
|
|
2187
|
-
args: [{ selector: 'euim-slider-info-screen', encapsulation: ViewEncapsulation.None, template: "<div #sliderElement class=\"euim-slider-info-screen__slider-container\">\n <div #slides class=\"euim-slider-info-screen__slides\">\n <ng-content></ng-content>\n </div>\n @if (showLeftBtn || showRightBtn || isCarousel || isLastItemReached){\n <div class=\"euim-slider-info-screen__pagination-container\">\n @if (showLeftBtn && !showLeftBtnAsPrevious && !isPreviousBtn) {\n
|
|
2223
|
+
args: [{ selector: 'euim-slider-info-screen', encapsulation: ViewEncapsulation.None, template: "<div #sliderElement class=\"euim-slider-info-screen__slider-container\" >\n <div #slides class=\"euim-slider-info-screen__slides\">\n <ng-content></ng-content>\n </div>\n\n @if (!isImageOnly()) {\n <div class=\"euim-slider-info-screen__pagination-container\">\n @if (showLeftBtn || showRightBtn || isCarousel || isLastItemReached){\n <div class=\"euim-slider-info-screen__pagination-container\">\n @if (showLeftBtn && !showLeftBtnAsPrevious && !isPreviousBtn) {\n <ion-button (click)=\"onLeftBtnAction($event)\"\n class=\"euim-slider-info-screen__action-button euim-slider-info-screen__action-button--left\"\n fill=\"clear\">{{actionBtnNames.leftBtnName}}</ion-button>\n }\n @if (showLeftBtnAsPrevious) {\n <ion-button (click)=\"onLeftBtnAction($event)\"\n class=\"euim-slider-info-screen__action-button euim-slider-info-screen__action-button--left\"\n fill=\"clear\">{{actionBtnNames.leftBtnName || 'euim.slider-info-screen.LEFT-BTN-NAME' |\n translate}}</ion-button>\n }\n @if (isCarousel){\n <div class=\"euim-slider-info-screen__pagination\">\n <span (click)=\"goToSlide(i)\" *ngFor=\"let slide of slidesArray; let i = index\"\n [ngClass]=\"{ 'active': currentSlide === i }\" class=\"euim-slider-info-screen__span\"></span>\n </div>\n }\n @if (!isLastItemReached && !isNextBtn || isNextBtn && showRightBtn) {\n <ion-button (click)=\"onRightBtnAction($event)\"\n class=\"euim-slider-info-screen__action-button euim-slider-info-screen__action-button--right\"\n fill=\"clear\">{{actionBtnNames.rightBtnName || 'euim.slider-info-screen.RIGHT-BTN-NAME' |\n translate}}</ion-button>\n }\n\n @if (isLastItemReached) {\n <ion-button (click)=\"onLastStepAction($event)\"\n class=\"euim-slider-info-screen__action-button euim-slider-info-screen__action-button--right\"\n fill=\"clear\">{{actionBtnNames.lastStepActionBtnName ||\n 'euim.slider-info-screen.LAST-STEP-ACTION-BTN-NAME' | translate}}</ion-button>\n }\n </div>\n }\n </div>\n }\n\n @if (isImageOnly()) {\n <div class=\"euim-slider-info-screen__pagination-container--over-image\">\n <div class=\"euim-slider-info-screen__pagination\">\n <span (click)=\"goToSlide(i)\" *ngFor=\"let slide of slidesArray; let i = index\"\n [ngClass]=\"{ 'active': currentSlide === i }\" \n class=\"euim-slider-info-screen__span\" ></span>\n </div>\n </div>\n }\n\n</div>", styles: [".euim-slider-info-screen__slider-container{overflow:hidden;position:relative;height:100vh}.euim-slider-info-screen__slides{display:flex;transition:all .5s ease;height:100%;width:100%}.euim-slider-info-screen__slide{width:100%;height:100%}.euim-slider-info-screen__pagination-container--over-image{position:absolute;bottom:20px;left:50%;transform:translate(-50%);display:flex;align-items:center;justify-content:center;z-index:1}.euim-slider-info-screen__pagination-container{position:fixed;bottom:0;left:0;right:0;display:flex;align-items:center;justify-content:center;height:60px}.euim-slider-info-screen__pagination{display:flex}.euim-slider-info-screen__span{width:calc(var(--eui-base-spacing-xs) + var(--eui-base-spacing-2xs) / 2);height:calc(var(--eui-base-spacing-xs) + var(--eui-base-spacing-2xs) / 2);border-radius:50%;cursor:pointer}.euim-slider-info-screen__span:not(:last-child){margin-right:var(--eui-base-spacing-xs)}.euim-slider-info-screen.pagination-color-primary .euim-slider-info-screen__span{border:1px solid var(--eui-base-color-primary-100)!important;background-color:transparent}.euim-slider-info-screen.pagination-color-primary .euim-slider-info-screen__span.active{background-color:var(--eui-base-color-primary-100)!important}.euim-slider-info-screen.pagination-color-white .euim-slider-info-screen__span{border:1px solid var(--eui-base-color-white)!important;background-color:transparent}.euim-slider-info-screen.pagination-color-white .euim-slider-info-screen__span.active{background-color:var(--eui-base-color-white)!important}.euim-slider-info-screen.pagination-color-success .euim-slider-info-screen__span{border:1px solid var(--eui-base-color-success-100)!important;background-color:transparent}.euim-slider-info-screen.pagination-color-success .euim-slider-info-screen__span.active{background-color:var(--eui-base-color-success-100)!important}.euim-slider-info-screen.pagination-color-warning .euim-slider-info-screen__span{border:1px solid var(--eui-base-color-warning-100)!important;background-color:transparent}.euim-slider-info-screen.pagination-color-warning .euim-slider-info-screen__span.active{background-color:var(--eui-base-color-warning-100)!important}.euim-slider-info-screen.pagination-color-warning .euim-slider-info-screen__span{border:1px solid var(--eui-base-color-info-100)!important;background-color:transparent}.euim-slider-info-screen.pagination-color-warning .euim-slider-info-screen__span.active{background-color:var(--eui-base-color-info-100)!important}.euim-slider-info-screen.pagination-color-dark .euim-slider-info-screen__span{border:1px solid var(--eui-base-color-grey-100)!important;background-color:transparent}.euim-slider-info-screen.pagination-color-dark .euim-slider-info-screen__span.active{background-color:var(--eui-base-color-grey-100)!important}.euim-slider-info-screen.pagination-color-danger .euim-slider-info-screen__span{border:1px solid var(--eui-base-color-danger-100)!important;background-color:transparent}.euim-slider-info-screen.pagination-color-danger .euim-slider-info-screen__span.active{background-color:var(--eui-base-color-danger-100)!important}.euim-slider-info-screen__action-button{position:absolute;color:var(--eui-base-color-primary-100);font-weight:700;top:50%;transform:translateY(-50%)}.euim-slider-info-screen__action-button::part(native){padding:0 var(--eui-base-spacing-m)}.euim-slider-info-screen__action-button--right{right:0;margin:0 var(--eui-base-spacing-xs) 0 var(--eui-base-spacing-m)}.euim-slider-info-screen__action-button--left{margin:0 var(--eui-base-spacing-m) 0 var(--eui-base-spacing-xs);left:0}.euim-slider-info-screen__title{font:normal normal 400 1.75rem/2rem var(--eui-base-font-family);font-weight:700;color:var(--eui-base-color-grey-100);margin-top:var(--eui-base-spacing-l);padding-left:var(--eui-base-spacing-l);padding-right:var(--eui-base-spacing-l)}.euim-slider-info-screen__sub-title{color:var(--eui-base-color-grey-75);padding-left:var(--eui-base-spacing-l);padding-right:var(--eui-base-spacing-l);font:normal normal 400 1.125rem/1.5rem var(--eui-base-font-family)}.euim-slider-info-screen__content{color:var(--eui-base-color-grey-100);padding-left:var(--eui-base-spacing-l);padding-right:var(--eui-base-spacing-l);font:normal normal 400 1.125rem/1.5rem var(--eui-base-font-family)}.euim-slider-info-screen__content--centered{text-align:center}.euim-slider-info-screen__title+.euim-slider-info-screen__sub-title{margin-top:var(--eui-base-spacing-2xs)}.euim-slider-info-screen__sub-title+.euim-slider-info-screen__content,title+.euim-slider-info-screen__content{margin-top:var(--eui-base-spacing-m)}.euim-slider-info-screen.image-only .euim-slider-info-screen__slider-container{height:auto}\n"] }]
|
|
2188
2224
|
}], ctorParameters: () => [{ type: i0.Renderer2 }, { type: i1.GestureController }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }], propDecorators: { slides: [{
|
|
2189
2225
|
type: ViewChild,
|
|
2190
2226
|
args: ['slides', { static: true }]
|
|
@@ -2209,14 +2245,16 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImpor
|
|
|
2209
2245
|
}], isNextBtn: [{
|
|
2210
2246
|
type: Input,
|
|
2211
2247
|
args: [{ transform: booleanAttribute }]
|
|
2248
|
+
}], paginationColor: [{
|
|
2249
|
+
type: Input
|
|
2212
2250
|
}], actionBtnNames: [{
|
|
2213
2251
|
type: Input
|
|
2214
|
-
}], className: [{
|
|
2215
|
-
type: HostBinding,
|
|
2216
|
-
args: ['class']
|
|
2217
2252
|
}], onResize: [{
|
|
2218
2253
|
type: HostListener,
|
|
2219
2254
|
args: ['window:resize', ['$event']]
|
|
2255
|
+
}], cssClasses: [{
|
|
2256
|
+
type: HostBinding,
|
|
2257
|
+
args: ['class']
|
|
2220
2258
|
}] } });
|
|
2221
2259
|
|
|
2222
2260
|
class EuimSlideInfoScreenComponent {
|
|
@@ -2639,11 +2677,11 @@ class EuimChipSelectorComponent {
|
|
|
2639
2677
|
return data.filter(item => multipleFilterConditions.includes(item.filterId));
|
|
2640
2678
|
}
|
|
2641
2679
|
/** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: EuimChipSelectorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
2642
|
-
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.7", type: EuimChipSelectorComponent, selector: "euim-chip-selector", inputs: { backgroundColor: "backgroundColor", color: "color", chipSelectedColor: "chipSelectedColor", chipFill: "chipFill", sourceData: "sourceData", selectedChips: "selectedChips", isMultiSelectionMode: ["isMultiSelectionMode", "isMultiSelectionMode", booleanAttribute], isCustomMode: ["isCustomMode", "isCustomMode", booleanAttribute], euimKeepSelection: ["euimKeepSelection", "euimKeepSelection", booleanAttribute], hasSearchbar: ["hasSearchbar", "hasSearchbar", booleanAttribute] }, outputs: { filterData: "filterData", clickItems: "clickItems", selectedChipsChange: "selectedChipsChange" }, host: { properties: { "class": "this.cssClasses" } }, queries: [{ propertyName: "euimChipSelectorItemComponent", predicate: EuimChipSelectorItemDirective, descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (hasSearchbar) {\n <ion-searchbar (ionChange)=\"handleChange($event)\"\n class=\"euim-chip-selector__searchbar\"></ion-searchbar>\n}\n<euim-scroller-x>\n <ng-content></ng-content>\n</euim-scroller-x>\n\n", styles: [".euim-chip-selector{padding:var(--eui-base-spacing-xs) 0 var(--eui-base-spacing-xs) var(--eui-base-spacing-xs);display:flex;justify-content:center;flex-direction:column}.euim-chip-selector ion-chip{margin:
|
|
2680
|
+
/** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.7", type: EuimChipSelectorComponent, selector: "euim-chip-selector", inputs: { backgroundColor: "backgroundColor", color: "color", chipSelectedColor: "chipSelectedColor", chipFill: "chipFill", sourceData: "sourceData", selectedChips: "selectedChips", isMultiSelectionMode: ["isMultiSelectionMode", "isMultiSelectionMode", booleanAttribute], isCustomMode: ["isCustomMode", "isCustomMode", booleanAttribute], euimKeepSelection: ["euimKeepSelection", "euimKeepSelection", booleanAttribute], hasSearchbar: ["hasSearchbar", "hasSearchbar", booleanAttribute] }, outputs: { filterData: "filterData", clickItems: "clickItems", selectedChipsChange: "selectedChipsChange" }, host: { properties: { "class": "this.cssClasses" } }, queries: [{ propertyName: "euimChipSelectorItemComponent", predicate: EuimChipSelectorItemDirective, descendants: true }], usesOnChanges: true, ngImport: i0, template: "@if (hasSearchbar) {\n <ion-searchbar (ionChange)=\"handleChange($event)\"\n class=\"euim-chip-selector__searchbar\"></ion-searchbar>\n}\n<euim-scroller-x>\n <ng-content></ng-content>\n</euim-scroller-x>\n\n", styles: [".euim-chip-selector{padding:var(--eui-base-spacing-xs) 0 var(--eui-base-spacing-xs) var(--eui-base-spacing-xs);display:flex;justify-content:center;flex-direction:column}.euim-chip-selector ion-chip{margin:calc(var(--eui-base-spacing-2xs) / 2) var(--eui-base-spacing-xs) calc(var(--eui-base-spacing-2xs) / 2) 0;padding:0 var(--eui-base-spacing-s)}.euim-chip-selector ion-searchbar{padding-inline-start:0;padding-top:0;padding-bottom:var(--eui-base-spacing-s)}@media (min-width: 768px){.euim-chip-selector .euim-scroller-x{flex-wrap:wrap;gap:var(--eui-base-spacing-xs)}}.euim-chip-selector__item--fill-default,.euim-chip-selector--fill-solid{border:none}.euim-chip-selector__item--fill-outline{background-color:transparent!important;border-width:1px;border-style:solid}.euim-chip-selector__item--fill-clear{background-color:transparent!important;border:none}.euim-chip-selector__item--fill-outline-solid{border-width:1px;border-style:solid}.euim-chip-selector--background-color-primary{background-color:var(--eui-base-color-primary-100)}.euim-chip-selector__item--color-success{background-color:var(--eui-base-color-success-25);border-color:var(--eui-base-color-success-25);color:var(--eui-base-color-success-100)}.euim-chip-selector__item--color-success ion-icon{color:var(--eui-base-color-success-100)}.euim-chip-selector__item--color-success.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-success-50)}.euim-chip-selector__item--color-warning{background-color:var(--eui-base-color-warning-25);border-color:var(--eui-base-color-warning-25);color:var(--eui-base-color-warning-140)}.euim-chip-selector__item--color-warning ion-icon{color:var(--eui-base-color-warning-140)}.euim-chip-selector__item--color-warning.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-warning-50)}.euim-chip-selector__item--color-danger{background-color:var(--eui-base-color-danger-25);border-color:var(--eui-base-color-danger-25);color:var(--eui-base-color-danger-100)}.euim-chip-selector__item--color-danger ion-icon{color:var(--eui-base-color-danger-100)}.euim-chip-selector__item--color-danger.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-danger-50)}.euim-chip-selector__item--color-primary{background-color:var(--eui-base-color-primary-25);border-color:var(--eui-base-color-primary-25);color:var(--eui-base-color-primary-100)}.euim-chip-selector__item--color-primary ion-icon{color:var(--eui-base-color-primary-100)}.euim-chip-selector__item--color-primary.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-primary-100)}.euim-chip-selector__item--color-info{background-color:var(--eui-base-color-info-25);border-color:var(--eui-base-color-info-25);color:var(--eui-base-color-info-100)}.euim-chip-selector__item--color-info ion-icon{color:var(--eui-base-color-info-100)}.euim-chip-selector__item--color-info.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-info-50)}.euim-chip-selector__item--color-dark{background-color:var(--eui-base-color-grey-100);border-color:var(--eui-base-color-grey-100);color:var(--eui-base-color-white)}.euim-chip-selector__item--color-dark ion-icon{color:var(--eui-base-color-grey-100)}.euim-chip-selector__item--color-dark.euim-chip-selector__item--fill-outline{color:var(--eui-base-color-grey-100)}.euim-chip-selector__item--color-white{background-color:var(--eui-base-color-white);border-color:var(--eui-base-color-white);color:var(--eui-base-color-grey-100)}.euim-chip-selector__item--color-white ion-icon{color:var(--eui-base-color-white)}.euim-chip-selector__item--color-white.euim-chip-selector__item--fill-outline{color:var(--eui-base-color-white)}.euim-chip-selector__item--color-default{background-color:var(--eui-base-grey-15);border-color:var(--eui-base-color-grey-15);color:var(--eui-base-color-grey-100)}.euim-chip-selector__item--color-default.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-grey-50)}ion-chip.euim-chip-selector__item-selected--color-white{background-color:var(--eui-base-color-white)!important;border-color:var(--eui-base-color-white)!important;color:var(--eui-base-color-grey-100)!important}ion-chip.euim-chip-selector__item-selected--color-white ion-icon{color:var(--eui-base-color-grey-100)!important}ion-chip.euim-chip-selector__item-selected--color-dark{background-color:var(--eui-base-color-grey-100)!important;border-color:var(--eui-base-color-grey-100)!important;color:var(--eui-base-color-white)!important}ion-chip.euim-chip-selector__item-selected--color-dark ion-icon{color:var(--eui-base-color-white)!important}ion-chip.euim-chip-selector__item-selected--color-primary{background-color:var(--eui-base-color-primary-100)!important;border-color:var(--eui-base-color-primary-100)!important;color:var(--eui-base-color-white)!important}ion-chip.euim-chip-selector__item-selected--color-primary ion-icon{color:var(--eui-base-color-white)!important}ion-chip.euim-chip-selector__item-selected--color-info{background-color:var(--eui-base-color-info-100)!important;border-color:var(--eui-base-color-info-100)!important;color:var(--eui-base-color-white)!important}ion-chip.euim-chip-selector__item-selected--color-info ion-icon{color:var(--eui-base-color-white)!important}ion-chip.euim-chip-selector__item-selected--color-success{background-color:var(--eui-base-color-success-100)!important;border-color:var(--eui-base-color-success-100)!important;color:var(--eui-base-color-white)!important}ion-chip.euim-chip-selector__item-selected--color-success ion-icon{color:var(--eui-base-color-white)!important}ion-chip.euim-chip-selector__item-selected--color-danger{background-color:var(--eui-base-color-danger-100)!important;border-color:var(--eui-base-color-danger-100)!important;color:var(--eui-base-color-white)!important}ion-chip.euim-chip-selector__item-selected--color-danger ion-icon{color:var(--eui-base-color-white)!important}ion-chip.euim-chip-selector__item-selected--color-warning{background-color:var(--eui-base-color-warning-100)!important;border-color:var(--eui-base-color-warning-100)!important;color:var(--eui-base-color-warning-100-contrast)!important}ion-chip.euim-chip-selector__item-selected--color-warning ion-icon{color:var(--eui-base-color-warning-100-contrast)!important}\n"], dependencies: [{ kind: "component", type: i1.IonSearchbar, selector: "ion-searchbar", inputs: ["animated", "autocomplete", "autocorrect", "cancelButtonIcon", "cancelButtonText", "clearIcon", "color", "debounce", "disabled", "enterkeyhint", "inputmode", "mode", "placeholder", "searchIcon", "showCancelButton", "showClearButton", "spellcheck", "type", "value"] }, { kind: "directive", type: i1.TextValueAccessor, selector: "ion-input:not([type=number]),ion-textarea,ion-searchbar" }, { kind: "component", type: EuimScrollerXComponent, selector: "euim-scroller-x" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
|
|
2643
2681
|
}
|
|
2644
2682
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.7", ngImport: i0, type: EuimChipSelectorComponent, decorators: [{
|
|
2645
2683
|
type: Component,
|
|
2646
|
-
args: [{ selector: 'euim-chip-selector', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (hasSearchbar) {\n <ion-searchbar (ionChange)=\"handleChange($event)\"\n class=\"euim-chip-selector__searchbar\"></ion-searchbar>\n}\n<euim-scroller-x>\n <ng-content></ng-content>\n</euim-scroller-x>\n\n", styles: [".euim-chip-selector{padding:var(--eui-base-spacing-xs) 0 var(--eui-base-spacing-xs) var(--eui-base-spacing-xs);display:flex;justify-content:center;flex-direction:column}.euim-chip-selector ion-chip{margin:
|
|
2684
|
+
args: [{ selector: 'euim-chip-selector', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (hasSearchbar) {\n <ion-searchbar (ionChange)=\"handleChange($event)\"\n class=\"euim-chip-selector__searchbar\"></ion-searchbar>\n}\n<euim-scroller-x>\n <ng-content></ng-content>\n</euim-scroller-x>\n\n", styles: [".euim-chip-selector{padding:var(--eui-base-spacing-xs) 0 var(--eui-base-spacing-xs) var(--eui-base-spacing-xs);display:flex;justify-content:center;flex-direction:column}.euim-chip-selector ion-chip{margin:calc(var(--eui-base-spacing-2xs) / 2) var(--eui-base-spacing-xs) calc(var(--eui-base-spacing-2xs) / 2) 0;padding:0 var(--eui-base-spacing-s)}.euim-chip-selector ion-searchbar{padding-inline-start:0;padding-top:0;padding-bottom:var(--eui-base-spacing-s)}@media (min-width: 768px){.euim-chip-selector .euim-scroller-x{flex-wrap:wrap;gap:var(--eui-base-spacing-xs)}}.euim-chip-selector__item--fill-default,.euim-chip-selector--fill-solid{border:none}.euim-chip-selector__item--fill-outline{background-color:transparent!important;border-width:1px;border-style:solid}.euim-chip-selector__item--fill-clear{background-color:transparent!important;border:none}.euim-chip-selector__item--fill-outline-solid{border-width:1px;border-style:solid}.euim-chip-selector--background-color-primary{background-color:var(--eui-base-color-primary-100)}.euim-chip-selector__item--color-success{background-color:var(--eui-base-color-success-25);border-color:var(--eui-base-color-success-25);color:var(--eui-base-color-success-100)}.euim-chip-selector__item--color-success ion-icon{color:var(--eui-base-color-success-100)}.euim-chip-selector__item--color-success.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-success-50)}.euim-chip-selector__item--color-warning{background-color:var(--eui-base-color-warning-25);border-color:var(--eui-base-color-warning-25);color:var(--eui-base-color-warning-140)}.euim-chip-selector__item--color-warning ion-icon{color:var(--eui-base-color-warning-140)}.euim-chip-selector__item--color-warning.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-warning-50)}.euim-chip-selector__item--color-danger{background-color:var(--eui-base-color-danger-25);border-color:var(--eui-base-color-danger-25);color:var(--eui-base-color-danger-100)}.euim-chip-selector__item--color-danger ion-icon{color:var(--eui-base-color-danger-100)}.euim-chip-selector__item--color-danger.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-danger-50)}.euim-chip-selector__item--color-primary{background-color:var(--eui-base-color-primary-25);border-color:var(--eui-base-color-primary-25);color:var(--eui-base-color-primary-100)}.euim-chip-selector__item--color-primary ion-icon{color:var(--eui-base-color-primary-100)}.euim-chip-selector__item--color-primary.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-primary-100)}.euim-chip-selector__item--color-info{background-color:var(--eui-base-color-info-25);border-color:var(--eui-base-color-info-25);color:var(--eui-base-color-info-100)}.euim-chip-selector__item--color-info ion-icon{color:var(--eui-base-color-info-100)}.euim-chip-selector__item--color-info.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-info-50)}.euim-chip-selector__item--color-dark{background-color:var(--eui-base-color-grey-100);border-color:var(--eui-base-color-grey-100);color:var(--eui-base-color-white)}.euim-chip-selector__item--color-dark ion-icon{color:var(--eui-base-color-grey-100)}.euim-chip-selector__item--color-dark.euim-chip-selector__item--fill-outline{color:var(--eui-base-color-grey-100)}.euim-chip-selector__item--color-white{background-color:var(--eui-base-color-white);border-color:var(--eui-base-color-white);color:var(--eui-base-color-grey-100)}.euim-chip-selector__item--color-white ion-icon{color:var(--eui-base-color-white)}.euim-chip-selector__item--color-white.euim-chip-selector__item--fill-outline{color:var(--eui-base-color-white)}.euim-chip-selector__item--color-default{background-color:var(--eui-base-grey-15);border-color:var(--eui-base-color-grey-15);color:var(--eui-base-color-grey-100)}.euim-chip-selector__item--color-default.euim-chip-selector__item--fill-outline{border-color:var(--eui-base-color-grey-50)}ion-chip.euim-chip-selector__item-selected--color-white{background-color:var(--eui-base-color-white)!important;border-color:var(--eui-base-color-white)!important;color:var(--eui-base-color-grey-100)!important}ion-chip.euim-chip-selector__item-selected--color-white ion-icon{color:var(--eui-base-color-grey-100)!important}ion-chip.euim-chip-selector__item-selected--color-dark{background-color:var(--eui-base-color-grey-100)!important;border-color:var(--eui-base-color-grey-100)!important;color:var(--eui-base-color-white)!important}ion-chip.euim-chip-selector__item-selected--color-dark ion-icon{color:var(--eui-base-color-white)!important}ion-chip.euim-chip-selector__item-selected--color-primary{background-color:var(--eui-base-color-primary-100)!important;border-color:var(--eui-base-color-primary-100)!important;color:var(--eui-base-color-white)!important}ion-chip.euim-chip-selector__item-selected--color-primary ion-icon{color:var(--eui-base-color-white)!important}ion-chip.euim-chip-selector__item-selected--color-info{background-color:var(--eui-base-color-info-100)!important;border-color:var(--eui-base-color-info-100)!important;color:var(--eui-base-color-white)!important}ion-chip.euim-chip-selector__item-selected--color-info ion-icon{color:var(--eui-base-color-white)!important}ion-chip.euim-chip-selector__item-selected--color-success{background-color:var(--eui-base-color-success-100)!important;border-color:var(--eui-base-color-success-100)!important;color:var(--eui-base-color-white)!important}ion-chip.euim-chip-selector__item-selected--color-success ion-icon{color:var(--eui-base-color-white)!important}ion-chip.euim-chip-selector__item-selected--color-danger{background-color:var(--eui-base-color-danger-100)!important;border-color:var(--eui-base-color-danger-100)!important;color:var(--eui-base-color-white)!important}ion-chip.euim-chip-selector__item-selected--color-danger ion-icon{color:var(--eui-base-color-white)!important}ion-chip.euim-chip-selector__item-selected--color-warning{background-color:var(--eui-base-color-warning-100)!important;border-color:var(--eui-base-color-warning-100)!important;color:var(--eui-base-color-warning-100-contrast)!important}ion-chip.euim-chip-selector__item-selected--color-warning ion-icon{color:var(--eui-base-color-warning-100-contrast)!important}\n"] }]
|
|
2647
2685
|
}], propDecorators: { backgroundColor: [{
|
|
2648
2686
|
type: Input
|
|
2649
2687
|
}], color: [{
|