igniteui-angular 22.1.4 → 22.2.0-rc.0
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/README.md +2 -2
- package/combo/README.md +19 -0
- package/drop-down/README.md +40 -4
- package/fesm2022/igniteui-angular-accordion.mjs +7 -7
- package/fesm2022/igniteui-angular-action-strip.mjs +10 -10
- package/fesm2022/igniteui-angular-avatar.mjs +7 -7
- package/fesm2022/igniteui-angular-badge.mjs +7 -7
- package/fesm2022/igniteui-angular-banner.mjs +10 -10
- package/fesm2022/igniteui-angular-bottom-nav.mjs +22 -22
- package/fesm2022/igniteui-angular-button-group.mjs +12 -13
- package/fesm2022/igniteui-angular-button-group.mjs.map +1 -1
- package/fesm2022/igniteui-angular-calendar.mjs +61 -61
- package/fesm2022/igniteui-angular-card.mjs +31 -31
- package/fesm2022/igniteui-angular-carousel.mjs +22 -22
- package/fesm2022/igniteui-angular-chat-extras.mjs +6 -6
- package/fesm2022/igniteui-angular-chat.mjs +12 -12
- package/fesm2022/igniteui-angular-checkbox.mjs +7 -7
- package/fesm2022/igniteui-angular-chips.mjs +10 -10
- package/fesm2022/igniteui-angular-combo.mjs +268 -120
- package/fesm2022/igniteui-angular-combo.mjs.map +1 -1
- package/fesm2022/igniteui-angular-core.mjs +188 -59
- package/fesm2022/igniteui-angular-core.mjs.map +1 -1
- package/fesm2022/igniteui-angular-date-picker.mjs +71 -80
- package/fesm2022/igniteui-angular-date-picker.mjs.map +1 -1
- package/fesm2022/igniteui-angular-dialog.mjs +13 -13
- package/fesm2022/igniteui-angular-directives.mjs +321 -457
- package/fesm2022/igniteui-angular-directives.mjs.map +1 -1
- package/fesm2022/igniteui-angular-drop-down.mjs +331 -104
- package/fesm2022/igniteui-angular-drop-down.mjs.map +1 -1
- package/fesm2022/igniteui-angular-expansion-panel.mjs +28 -28
- package/fesm2022/igniteui-angular-grids-core.mjs +552 -516
- package/fesm2022/igniteui-angular-grids-core.mjs.map +1 -1
- package/fesm2022/igniteui-angular-grids-grid.mjs +79 -80
- package/fesm2022/igniteui-angular-grids-grid.mjs.map +1 -1
- package/fesm2022/igniteui-angular-grids-hierarchical-grid.mjs +59 -46
- package/fesm2022/igniteui-angular-grids-hierarchical-grid.mjs.map +1 -1
- package/fesm2022/igniteui-angular-grids-lite.mjs +12 -12
- package/fesm2022/igniteui-angular-grids-pivot-grid.mjs +113 -86
- package/fesm2022/igniteui-angular-grids-pivot-grid.mjs.map +1 -1
- package/fesm2022/igniteui-angular-grids-tree-grid.mjs +57 -57
- package/fesm2022/igniteui-angular-grids-tree-grid.mjs.map +1 -1
- package/fesm2022/igniteui-angular-icon.mjs +10 -10
- package/fesm2022/igniteui-angular-input-group.mjs +47 -61
- package/fesm2022/igniteui-angular-input-group.mjs.map +1 -1
- package/fesm2022/igniteui-angular-list.mjs +40 -40
- package/fesm2022/igniteui-angular-navbar.mjs +13 -13
- package/fesm2022/igniteui-angular-navigation-drawer.mjs +16 -16
- package/fesm2022/igniteui-angular-paginator.mjs +19 -19
- package/fesm2022/igniteui-angular-progressbar.mjs +19 -19
- package/fesm2022/igniteui-angular-query-builder.mjs +23 -23
- package/fesm2022/igniteui-angular-query-builder.mjs.map +1 -1
- package/fesm2022/igniteui-angular-radio.mjs +59 -35
- package/fesm2022/igniteui-angular-radio.mjs.map +1 -1
- package/fesm2022/igniteui-angular-select.mjs +35 -43
- package/fesm2022/igniteui-angular-select.mjs.map +1 -1
- package/fesm2022/igniteui-angular-simple-combo.mjs +44 -33
- package/fesm2022/igniteui-angular-simple-combo.mjs.map +1 -1
- package/fesm2022/igniteui-angular-slider.mjs +28 -28
- package/fesm2022/igniteui-angular-snackbar.mjs +7 -7
- package/fesm2022/igniteui-angular-splitter.mjs +13 -13
- package/fesm2022/igniteui-angular-stepper.mjs +34 -34
- package/fesm2022/igniteui-angular-switch.mjs +7 -7
- package/fesm2022/igniteui-angular-tabs.mjs +34 -34
- package/fesm2022/igniteui-angular-time-picker.mjs +29 -38
- package/fesm2022/igniteui-angular-time-picker.mjs.map +1 -1
- package/fesm2022/igniteui-angular-toast.mjs +7 -7
- package/fesm2022/igniteui-angular-tree.mjs +28 -28
- package/fesm2022/igniteui-angular-virtual-scroll.mjs +1257 -0
- package/fesm2022/igniteui-angular-virtual-scroll.mjs.map +1 -0
- package/fesm2022/igniteui-angular.mjs +1 -0
- package/fesm2022/igniteui-angular.mjs.map +1 -1
- package/input-group/README.md +2 -0
- package/lib/core/styles/components/scrollbar/scrollbar-component.scss +0 -2
- package/lib/core/styles/components/scrollbar/scrollbar-theme.scss +23 -51
- package/lib/grids/core/src/column-actions/themes/_derived.scss +3 -3
- package/lib/grids/core/src/filtering/excel-style/themes/_derived.scss +3 -3
- package/lib/grids/themes/_derived.scss +3 -3
- package/lib/query-builder/src/query-builder/themes/_derived.scss +3 -3
- package/migrations/migration-collection.json +10 -0
- package/migrations/update-22_2_0/changes/theme-changes.json +77 -0
- package/migrations/update-22_2_0/index.d.ts +3 -0
- package/migrations/update-22_2_0/index.js +18 -0
- package/migrations/update-22_2_0/index.spec.d.ts +1 -0
- package/migrations/update-22_2_0/index.spec.js +88 -0
- package/migrations/update-22_2_0_grid-summary-borders/changes/theme-changes.json +17 -0
- package/migrations/update-22_2_0_grid-summary-borders/index.d.ts +3 -0
- package/migrations/update-22_2_0_grid-summary-borders/index.js +64 -0
- package/migrations/update-22_2_0_grid-summary-borders/index.spec.d.ts +1 -0
- package/migrations/update-22_2_0_grid-summary-borders/index.spec.js +100 -0
- package/package.json +6 -2
- package/schematics/tsconfig.tsbuildinfo +1 -1
- package/simple-combo/README.md +3 -0
- package/skills/igniteui-angular-components/references/form-controls.md +58 -0
- package/styles/igniteui-angular-dark.css +1 -1
- package/styles/igniteui-angular.css +1 -1
- package/styles/igniteui-bootstrap-dark.css +1 -1
- package/styles/igniteui-bootstrap-light.css +1 -1
- package/styles/igniteui-dark-green.css +1 -1
- package/styles/igniteui-fluent-dark-excel.css +1 -1
- package/styles/igniteui-fluent-dark-word.css +1 -1
- package/styles/igniteui-fluent-dark.css +1 -1
- package/styles/igniteui-fluent-light-excel.css +1 -1
- package/styles/igniteui-fluent-light-word.css +1 -1
- package/styles/igniteui-fluent-light.css +1 -1
- package/styles/igniteui-indigo-dark.css +1 -1
- package/styles/igniteui-indigo-light.css +1 -1
- package/styles/maps/igniteui-angular-dark.css.map +1 -1
- package/styles/maps/igniteui-angular.css.map +1 -1
- package/styles/maps/igniteui-bootstrap-dark.css.map +1 -1
- package/styles/maps/igniteui-bootstrap-light.css.map +1 -1
- package/styles/maps/igniteui-dark-green.css.map +1 -1
- package/styles/maps/igniteui-fluent-dark-excel.css.map +1 -1
- package/styles/maps/igniteui-fluent-dark-word.css.map +1 -1
- package/styles/maps/igniteui-fluent-dark.css.map +1 -1
- package/styles/maps/igniteui-fluent-light-excel.css.map +1 -1
- package/styles/maps/igniteui-fluent-light-word.css.map +1 -1
- package/styles/maps/igniteui-fluent-light.css.map +1 -1
- package/styles/maps/igniteui-indigo-dark.css.map +1 -1
- package/styles/maps/igniteui-indigo-light.css.map +1 -1
- package/types/igniteui-angular-calendar.d.ts +1 -1
- package/types/igniteui-angular-combo.d.ts +55 -12
- package/types/igniteui-angular-core.d.ts +64 -11
- package/types/igniteui-angular-date-picker.d.ts +3 -4
- package/types/igniteui-angular-directives.d.ts +50 -164
- package/types/igniteui-angular-drop-down.d.ts +76 -4
- package/types/igniteui-angular-grids-core.d.ts +63 -28
- package/types/igniteui-angular-grids-grid.d.ts +2 -7
- package/types/igniteui-angular-grids-hierarchical-grid.d.ts +5 -4
- package/types/igniteui-angular-grids-pivot-grid.d.ts +11 -5
- package/types/igniteui-angular-grids-tree-grid.d.ts +1 -1
- package/types/igniteui-angular-icon.d.ts +1 -1
- package/types/igniteui-angular-input-group.d.ts +1 -2
- package/types/igniteui-angular-query-builder.d.ts +1 -1
- package/types/igniteui-angular-radio.d.ts +16 -1
- package/types/igniteui-angular-select.d.ts +1 -2
- package/types/igniteui-angular-simple-combo.d.ts +7 -0
- package/types/igniteui-angular-stepper.d.ts +1 -1
- package/types/igniteui-angular-time-picker.d.ts +1 -2
- package/types/igniteui-angular-tree.d.ts +3 -3
- package/types/igniteui-angular-virtual-scroll.d.ts +408 -0
- package/types/igniteui-angular.d.ts +1 -0
- package/virtual-scroll/README.md +332 -0
|
@@ -37,10 +37,10 @@ class IgxCardMediaDirective {
|
|
|
37
37
|
*/
|
|
38
38
|
this.role = 'img';
|
|
39
39
|
}
|
|
40
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
41
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.
|
|
40
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCardMediaDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
41
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: IgxCardMediaDirective, isStandalone: true, selector: "igx-card-media", inputs: { width: "width", height: "height", role: "role" }, host: { properties: { "class.igx-card__media": "this.cssClass", "style.width": "this.width", "style.min-width": "this.width", "style.height": "this.height", "attr.role": "this.role" } }, ngImport: i0 }); }
|
|
42
42
|
}
|
|
43
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
43
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCardMediaDirective, decorators: [{
|
|
44
44
|
type: Directive,
|
|
45
45
|
args: [{
|
|
46
46
|
// eslint-disable-next-line @angular-eslint/directive-selector
|
|
@@ -87,10 +87,10 @@ class IgxCardHeaderComponent {
|
|
|
87
87
|
*/
|
|
88
88
|
this.vertical = false;
|
|
89
89
|
}
|
|
90
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
91
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "22.1.
|
|
90
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCardHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
91
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "22.1.7", type: IgxCardHeaderComponent, isStandalone: true, selector: "igx-card-header", inputs: { vertical: ["vertical", "vertical", booleanAttribute] }, host: { properties: { "class.igx-card-header": "this.cssClass", "class.igx-card-header--vertical": "this.vertical" } }, hostDirectives: [{ directive: i1.IgxNoTypographyDirective }], ngImport: i0, template: "<div class=\"igx-card-header__thumbnail\">\n <ng-content select=\"igx-avatar, igx-card-media, [igxCardThumbnail]\"></ng-content>\n</div>\n\n<div class=\"igx-card-header__titles\">\n <ng-content select=\"\n [igxCardHeaderTitle],\n [igxCardHeaderSubtitle],\n .igx-card-header__title,\n .igx-card-header__title--small,\n .igx-card-header__subtitle\">\n </ng-content>\n</div>\n\n<ng-content></ng-content>\n", changeDetection: i0.ChangeDetectionStrategy.Eager }); }
|
|
92
92
|
}
|
|
93
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
93
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCardHeaderComponent, decorators: [{
|
|
94
94
|
type: Component,
|
|
95
95
|
args: [{ selector: 'igx-card-header', changeDetection: ChangeDetectionStrategy.Eager, standalone: true, hostDirectives: [IgxNoTypographyDirective], template: "<div class=\"igx-card-header__thumbnail\">\n <ng-content select=\"igx-avatar, igx-card-media, [igxCardThumbnail]\"></ng-content>\n</div>\n\n<div class=\"igx-card-header__titles\">\n <ng-content select=\"\n [igxCardHeaderTitle],\n [igxCardHeaderSubtitle],\n .igx-card-header__title,\n .igx-card-header__title--small,\n .igx-card-header__subtitle\">\n </ng-content>\n</div>\n\n<ng-content></ng-content>\n" }]
|
|
96
96
|
}], propDecorators: { cssClass: [{
|
|
@@ -108,10 +108,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImpor
|
|
|
108
108
|
* Use it to wrap anything you want to be used as a thumbnail.
|
|
109
109
|
*/
|
|
110
110
|
class IgxCardThumbnailDirective {
|
|
111
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
112
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.
|
|
111
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCardThumbnailDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
112
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: IgxCardThumbnailDirective, isStandalone: true, selector: "[igxCardThumbnail]", ngImport: i0 }); }
|
|
113
113
|
}
|
|
114
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
114
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCardThumbnailDirective, decorators: [{
|
|
115
115
|
type: Directive,
|
|
116
116
|
args: [{
|
|
117
117
|
selector: '[igxCardThumbnail]',
|
|
@@ -127,10 +127,10 @@ class IgxCardHeaderTitleDirective {
|
|
|
127
127
|
/** @hidden @internal */
|
|
128
128
|
this.cssClass = 'igx-card__header__title';
|
|
129
129
|
}
|
|
130
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
131
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.
|
|
130
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCardHeaderTitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
131
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: IgxCardHeaderTitleDirective, isStandalone: true, selector: "[igxCardHeaderTitle]", host: { properties: { "class.igx-card-header__title": "this.cssClass" } }, hostDirectives: [{ directive: i1.IgxNoTypographyDirective }], ngImport: i0 }); }
|
|
132
132
|
}
|
|
133
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
133
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCardHeaderTitleDirective, decorators: [{
|
|
134
134
|
type: Directive,
|
|
135
135
|
args: [{
|
|
136
136
|
selector: '[igxCardHeaderTitle]',
|
|
@@ -150,10 +150,10 @@ class IgxCardHeaderSubtitleDirective {
|
|
|
150
150
|
/** @hidden @internal */
|
|
151
151
|
this.cssClass = 'igx-card-header__subtitle';
|
|
152
152
|
}
|
|
153
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
154
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.
|
|
153
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCardHeaderSubtitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
154
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: IgxCardHeaderSubtitleDirective, isStandalone: true, selector: "[igxCardHeaderSubtitle]", host: { properties: { "class.igx-card-header__subtitle": "this.cssClass" } }, hostDirectives: [{ directive: i1.IgxNoTypographyDirective }], ngImport: i0 }); }
|
|
155
155
|
}
|
|
156
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
156
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCardHeaderSubtitleDirective, decorators: [{
|
|
157
157
|
type: Directive,
|
|
158
158
|
args: [{
|
|
159
159
|
selector: '[igxCardHeaderSubtitle]',
|
|
@@ -172,10 +172,10 @@ class IgxCardContentDirective {
|
|
|
172
172
|
/** @hidden @internal */
|
|
173
173
|
this.cssClass = 'igx-card-content';
|
|
174
174
|
}
|
|
175
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
176
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.
|
|
175
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCardContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
176
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: IgxCardContentDirective, isStandalone: true, selector: "igx-card-content", host: { properties: { "class.igx-card-content": "this.cssClass" } }, hostDirectives: [{ directive: i1.IgxNoTypographyDirective }], ngImport: i0 }); }
|
|
177
177
|
}
|
|
178
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
178
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCardContentDirective, decorators: [{
|
|
179
179
|
type: Directive,
|
|
180
180
|
args: [{
|
|
181
181
|
// eslint-disable-next-line @angular-eslint/directive-selector
|
|
@@ -203,10 +203,10 @@ class IgxCardFooterDirective {
|
|
|
203
203
|
*/
|
|
204
204
|
this.role = 'footer';
|
|
205
205
|
}
|
|
206
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
207
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.
|
|
206
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCardFooterDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
207
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: IgxCardFooterDirective, isStandalone: true, selector: "igx-card-footer", inputs: { role: "role" }, host: { properties: { "attr.role": "this.role" } }, ngImport: i0 }); }
|
|
208
208
|
}
|
|
209
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
209
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCardFooterDirective, decorators: [{
|
|
210
210
|
type: Directive,
|
|
211
211
|
args: [{
|
|
212
212
|
// eslint-disable-next-line @angular-eslint/directive-selector
|
|
@@ -305,10 +305,10 @@ class IgxCardComponent {
|
|
|
305
305
|
*/
|
|
306
306
|
this.horizontal = false;
|
|
307
307
|
}
|
|
308
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
309
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "22.1.1", type: IgxCardComponent, isStandalone: true, selector: "igx-card", inputs: { id: "id", role: "role", elevated: ["elevated", "elevated", booleanAttribute], horizontal: ["horizontal", "horizontal", booleanAttribute] }, host: { properties: { "attr.id": "this.id", "class.igx-card": "this.cssClass", "attr.role": "this.role", "class.igx-card--elevated": "this.elevated", "class.igx-card--horizontal": "this.horizontal" } }, ngImport: i0, template: "<ng-content></ng-content>\n", styles: ["@layer ig.base{.igx-card-actions__end,.igx-card-actions__start{display:flex;align-items:center;gap:.5rem;color:var(--actions-text-color)}.igx-card-actions__end:empty,.igx-card-actions__start:empty{display:none}.igx-card-actions--vertical .igx-card-actions__end,.igx-card-actions--vertical .igx-card-actions__start{flex-direction:column}.igx-card-actions--vertical .igx-card-actions__end [igxButton]~[igxButton],.igx-card-actions--vertical .igx-card-actions__start [igxButton]~[igxButton]{margin-inline-start:0;margin-top:.5rem}.igx-card-actions--justify .igx-card-actions__end,.igx-card-actions--justify .igx-card-actions__start{justify-content:space-around;flex-grow:1}.igx-card-actions--justify .igx-card-actions__end:empty,.igx-card-actions--justify .igx-card-actions__start:empty{display:none}.igx-card{display:flex;flex-direction:column;overflow:hidden;border-radius:var(--border-radius);background:var(--background);transition:box-shadow .3s cubic-bezier(.25,.8,.25,1);backface-visibility:hidden;border:.0625rem solid var(--outline-color)}.igx-card:hover{box-shadow:none}.igx-card igx-avatar{--ig-size: 1}.igx-card__media{display:block;overflow:hidden;line-height:0}.igx-card__media>*{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.igx-card__media--right{width:auto;margin-inline-start:auto;order:9999}.igx-card--elevated{box-shadow:var(--resting-elevation);border:.0625rem solid var(--outline-color)}.igx-card--elevated:hover{box-shadow:var(--hover-elevation)}.igx-card--horizontal{flex-direction:row}.igx-card-header{display:flex;flex-flow:row wrap;align-items:center;width:100%;padding:1rem;color:var(--header-text-color)}.igx-card-header:empty{display:block;padding:0}.igx-card-header__thumbnail{margin-inline-end:1rem}.igx-card-header__thumbnail:empty{display:none}.igx-card-header__titles{display:flex;flex-flow:column nowrap;overflow:hidden;flex:1 1 auto;justify-content:center}.igx-card-header__titles:empty{display:none}.igx-card-header__subtitle{color:var(--subtitle-text-color)}.igx-card-header--vertical{flex-flow:column nowrap}.igx-card-header--vertical .igx-card-header__titles{text-align:center}.igx-card-header--vertical .igx-card-header__thumbnail{display:flex;justify-content:center;align-self:unset;margin-inline-end:0;margin-bottom:1rem}.igx-card-content{display:block;width:100%;padding:1rem;color:var(--content-text-color);overflow:auto}.igx-card-actions{display:flex;flex-flow:row wrap;justify-content:space-between;align-items:center;padding:.5rem 1rem}.igx-card-actions:first-child{margin-block-end:auto}.igx-card-actions:last-child{margin-block-start:auto}.igx-card-actions__start{order:0}.igx-card-actions__end{order:1;margin-inline-start:auto;gap:.5rem}.igx-card-actions__end:empty{display:none}.igx-card-actions--vertical{flex-direction:column}.igx-card-actions--vertical:is(:first-child,:last-child){margin-block:initial}[dir=rtl] .igx-card-actions--vertical{order:-1}.igx-card-actions--vertical .igx-card-actions__end{margin-top:auto;margin-inline-start:0}.igx-card-actions--reverse .igx-card-actions__start{order:1;margin-inline-start:auto}.igx-card-actions--reverse .igx-card-actions__end{order:0;margin-inline-start:0}.igx-card-actions--vertical.igx-card-actions--reverse .igx-card-actions__start{margin:auto 0 0}.igx-card-actions--vertical.igx-card-actions--reverse .igx-card-actions__end{margin:0 0 auto}}@layer ig.material{@container style(--ig-theme: material){.igx-card-header__title{font-family:var(--ig-h6-font-family, var(--ig-font-family));font-size:var(--ig-h6-font-size);font-weight:var(--ig-h6-font-weight);font-style:var(--ig-h6-font-style);line-height:var(--ig-h6-line-height);letter-spacing:var(--ig-h6-letter-spacing);text-transform:var(--ig-h6-text-transform);margin-top:var(--ig-h6-margin-top);margin-bottom:var(--ig-h6-margin-bottom);margin:0}.igx-card-header__title--small,.igx-card-header__subtitle{font-family:var(--ig-subtitle-2-font-family, var(--ig-font-family));font-size:var(--ig-subtitle-2-font-size);font-weight:var(--ig-subtitle-2-font-weight);font-style:var(--ig-subtitle-2-font-style);line-height:var(--ig-subtitle-2-line-height);letter-spacing:var(--ig-subtitle-2-letter-spacing);text-transform:var(--ig-subtitle-2-text-transform);margin-top:var(--ig-subtitle-2-margin-top);margin-bottom:var(--ig-subtitle-2-margin-bottom);margin:0}}}@layer ig.material{@container style(--ig-theme: material){.igx-card-content>*:not(igx-icon){font-family:var(--ig-body-2-font-family, var(--ig-font-family));font-size:var(--ig-body-2-font-size);font-weight:var(--ig-body-2-font-weight);font-style:var(--ig-body-2-font-style);line-height:var(--ig-body-2-line-height);letter-spacing:var(--ig-body-2-letter-spacing);text-transform:var(--ig-body-2-text-transform);margin-top:var(--ig-body-2-margin-top);margin-bottom:var(--ig-body-2-margin-bottom);margin:0}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-card-header__title{font-family:var(--ig-h5-font-family, var(--ig-font-family));font-size:var(--ig-h5-font-size);font-weight:var(--ig-h5-font-weight);font-style:var(--ig-h5-font-style);line-height:var(--ig-h5-line-height);letter-spacing:var(--ig-h5-letter-spacing);text-transform:var(--ig-h5-text-transform);margin-top:var(--ig-h5-margin-top);margin-bottom:var(--ig-h5-margin-bottom);margin:0}.igx-card-header__title--small{font-family:var(--ig-subtitle-2-font-family, var(--ig-font-family));font-size:var(--ig-subtitle-2-font-size);font-weight:var(--ig-subtitle-2-font-weight);font-style:var(--ig-subtitle-2-font-style);line-height:var(--ig-subtitle-2-line-height);letter-spacing:var(--ig-subtitle-2-letter-spacing);text-transform:var(--ig-subtitle-2-text-transform);margin-top:var(--ig-subtitle-2-margin-top);margin-bottom:var(--ig-subtitle-2-margin-bottom);margin:0}.igx-card-header__subtitle{font-family:var(--ig-body-1-font-family, var(--ig-font-family));font-size:var(--ig-body-1-font-size);font-weight:var(--ig-body-1-font-weight);font-style:var(--ig-body-1-font-style);line-height:var(--ig-body-1-line-height);letter-spacing:var(--ig-body-1-letter-spacing);text-transform:var(--ig-body-1-text-transform);margin-top:var(--ig-body-1-margin-top);margin-bottom:var(--ig-body-1-margin-bottom);margin:0}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-card-content{padding-block:1rem 1.5rem;padding-inline:1rem}.igx-card-content>*:not(igx-icon){font-family:var(--ig-body-1-font-family, var(--ig-font-family));font-size:var(--ig-body-1-font-size);font-weight:var(--ig-body-1-font-weight);font-style:var(--ig-body-1-font-style);line-height:var(--ig-body-1-line-height);letter-spacing:var(--ig-body-1-letter-spacing);text-transform:var(--ig-body-1-text-transform);margin-top:var(--ig-body-1-margin-top);margin-bottom:var(--ig-body-1-margin-bottom);margin:0}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-card-actions{padding:1rem}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-card-header__title{font-family:var(--ig-subtitle-1-font-family, var(--ig-font-family));font-size:var(--ig-subtitle-1-font-size);font-weight:var(--ig-subtitle-1-font-weight);font-style:var(--ig-subtitle-1-font-style);line-height:var(--ig-subtitle-1-line-height);letter-spacing:var(--ig-subtitle-1-letter-spacing);text-transform:var(--ig-subtitle-1-text-transform);margin-top:var(--ig-subtitle-1-margin-top);margin-bottom:var(--ig-subtitle-1-margin-bottom);margin:0}.igx-card-header__title--small{font-family:var(--ig-subtitle-2-font-family, var(--ig-font-family));font-size:var(--ig-subtitle-2-font-size);font-weight:var(--ig-subtitle-2-font-weight);font-style:var(--ig-subtitle-2-font-style);line-height:var(--ig-subtitle-2-line-height);letter-spacing:var(--ig-subtitle-2-letter-spacing);text-transform:var(--ig-subtitle-2-text-transform);margin-top:var(--ig-subtitle-2-margin-top);margin-bottom:var(--ig-subtitle-2-margin-bottom);margin:0}.igx-card-header__subtitle{font-family:var(--ig-body-2-font-family, var(--ig-font-family));font-size:var(--ig-body-2-font-size);font-weight:var(--ig-body-2-font-weight);font-style:var(--ig-body-2-font-style);line-height:var(--ig-body-2-line-height);letter-spacing:var(--ig-body-2-letter-spacing);text-transform:var(--ig-body-2-text-transform);margin-top:var(--ig-body-2-margin-top);margin-bottom:var(--ig-body-2-margin-bottom);margin:0}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-card-content>*:not(igx-icon){font-family:var(--ig-body-2-font-family, var(--ig-font-family));font-size:var(--ig-body-2-font-size);font-weight:var(--ig-body-2-font-weight);font-style:var(--ig-body-2-font-style);line-height:var(--ig-body-2-line-height);letter-spacing:var(--ig-body-2-letter-spacing);text-transform:var(--ig-body-2-text-transform);margin-top:var(--ig-body-2-margin-top);margin-bottom:var(--ig-body-2-margin-bottom);margin:0}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-card igx-avatar{--ig-size: 3}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-card-header+.igx-card-content{padding-block-start:0}.igx-card-header__thumbnail{margin-inline-end:.5rem;margin-block:auto}.igx-card-header__titles{gap:.125rem}.igx-card-header__titles .igx-card-header__subtitle{margin-block-end:.125rem}.igx-card-header__title{font-family:var(--ig-h6-font-family, var(--ig-font-family));font-size:var(--ig-h6-font-size);font-weight:var(--ig-h6-font-weight);font-style:var(--ig-h6-font-style);line-height:var(--ig-h6-line-height);letter-spacing:var(--ig-h6-letter-spacing);text-transform:var(--ig-h6-text-transform);margin-top:var(--ig-h6-margin-top);margin-bottom:var(--ig-h6-margin-bottom);margin:0}.igx-card-header__title--small,.igx-card-header__subtitle{font-family:var(--ig-body-2-font-family, var(--ig-font-family));font-size:var(--ig-body-2-font-size);font-weight:var(--ig-body-2-font-weight);font-style:var(--ig-body-2-font-style);line-height:var(--ig-body-2-line-height);letter-spacing:var(--ig-body-2-letter-spacing);text-transform:var(--ig-body-2-text-transform);margin-top:var(--ig-body-2-margin-top);margin-bottom:var(--ig-body-2-margin-bottom);margin:0}.igx-card-header--vertical .igx-card-header__thumbnail{margin-bottom:.5rem}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-card-content{padding:1rem}.igx-card-content+.igx-card-actions{padding-block-start:.5rem}.igx-card-content>*:not(igx-icon){font-family:var(--ig-body-2-font-family, var(--ig-font-family));font-size:var(--ig-body-2-font-size);font-weight:var(--ig-body-2-font-weight);font-style:var(--ig-body-2-font-style);line-height:var(--ig-body-2-line-height);letter-spacing:var(--ig-body-2-letter-spacing);text-transform:var(--ig-body-2-text-transform);margin-top:var(--ig-body-2-margin-top);margin-bottom:var(--ig-body-2-margin-bottom);margin:0}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-card-actions{padding:1rem}.igx-card-actions [igxButton],.igx-card-actions [igxIconButton]{--ig-size: 2}}}\n"], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None }); }
|
|
308
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
309
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "22.1.7", type: IgxCardComponent, isStandalone: true, selector: "igx-card", inputs: { id: "id", role: "role", elevated: ["elevated", "elevated", booleanAttribute], horizontal: ["horizontal", "horizontal", booleanAttribute] }, host: { properties: { "attr.id": "this.id", "class.igx-card": "this.cssClass", "attr.role": "this.role", "class.igx-card--elevated": "this.elevated", "class.igx-card--horizontal": "this.horizontal" } }, ngImport: i0, template: "<ng-content></ng-content>\n", styles: ["@layer ig.base{.igx-card-actions__end,.igx-card-actions__start{display:flex;align-items:center;gap:.5rem;color:var(--actions-text-color)}.igx-card-actions__end:empty,.igx-card-actions__start:empty{display:none}.igx-card-actions--vertical .igx-card-actions__end,.igx-card-actions--vertical .igx-card-actions__start{flex-direction:column}.igx-card-actions--vertical .igx-card-actions__end [igxButton]~[igxButton],.igx-card-actions--vertical .igx-card-actions__start [igxButton]~[igxButton]{margin-inline-start:0;margin-top:.5rem}.igx-card-actions--justify .igx-card-actions__end,.igx-card-actions--justify .igx-card-actions__start{justify-content:space-around;flex-grow:1}.igx-card-actions--justify .igx-card-actions__end:empty,.igx-card-actions--justify .igx-card-actions__start:empty{display:none}.igx-card{display:flex;flex-direction:column;overflow:hidden;border-radius:var(--border-radius);background:var(--background);transition:box-shadow .3s cubic-bezier(.25,.8,.25,1);backface-visibility:hidden;border:.0625rem solid var(--outline-color)}.igx-card:hover{box-shadow:none}.igx-card igx-avatar{--ig-size: 1}.igx-card__media{display:block;overflow:hidden;line-height:0}.igx-card__media>*{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.igx-card__media--right{width:auto;margin-inline-start:auto;order:9999}.igx-card--elevated{box-shadow:var(--resting-elevation);border:.0625rem solid var(--outline-color)}.igx-card--elevated:hover{box-shadow:var(--hover-elevation)}.igx-card--horizontal{flex-direction:row}.igx-card-header{display:flex;flex-flow:row wrap;align-items:center;width:100%;padding:1rem;color:var(--header-text-color)}.igx-card-header:empty{display:block;padding:0}.igx-card-header__thumbnail{margin-inline-end:1rem}.igx-card-header__thumbnail:empty{display:none}.igx-card-header__titles{display:flex;flex-flow:column nowrap;overflow:hidden;flex:1 1 auto;justify-content:center}.igx-card-header__titles:empty{display:none}.igx-card-header__subtitle{color:var(--subtitle-text-color)}.igx-card-header--vertical{flex-flow:column nowrap}.igx-card-header--vertical .igx-card-header__titles{text-align:center}.igx-card-header--vertical .igx-card-header__thumbnail{display:flex;justify-content:center;align-self:unset;margin-inline-end:0;margin-bottom:1rem}.igx-card-content{display:block;width:100%;padding:1rem;color:var(--content-text-color);overflow:auto}.igx-card-actions{display:flex;flex-flow:row wrap;justify-content:space-between;align-items:center;padding:.5rem 1rem}.igx-card-actions:first-child{margin-block-end:auto}.igx-card-actions:last-child{margin-block-start:auto}.igx-card-actions__start{order:0}.igx-card-actions__end{order:1;margin-inline-start:auto;gap:.5rem}.igx-card-actions__end:empty{display:none}.igx-card-actions--vertical{flex-direction:column}.igx-card-actions--vertical:is(:first-child,:last-child){margin-block:initial}[dir=rtl] .igx-card-actions--vertical{order:-1}.igx-card-actions--vertical .igx-card-actions__end{margin-top:auto;margin-inline-start:0}.igx-card-actions--reverse .igx-card-actions__start{order:1;margin-inline-start:auto}.igx-card-actions--reverse .igx-card-actions__end{order:0;margin-inline-start:0}.igx-card-actions--vertical.igx-card-actions--reverse .igx-card-actions__start{margin:auto 0 0}.igx-card-actions--vertical.igx-card-actions--reverse .igx-card-actions__end{margin:0 0 auto}}@layer ig.material{@container style(--ig-theme: material){.igx-card-header__title{font-family:var(--ig-h6-font-family, var(--ig-font-family));font-size:var(--ig-h6-font-size);font-weight:var(--ig-h6-font-weight);font-style:var(--ig-h6-font-style);line-height:var(--ig-h6-line-height);letter-spacing:var(--ig-h6-letter-spacing);text-transform:var(--ig-h6-text-transform);margin-top:var(--ig-h6-margin-top);margin-bottom:var(--ig-h6-margin-bottom);margin:0}.igx-card-header__title--small,.igx-card-header__subtitle{font-family:var(--ig-subtitle-2-font-family, var(--ig-font-family));font-size:var(--ig-subtitle-2-font-size);font-weight:var(--ig-subtitle-2-font-weight);font-style:var(--ig-subtitle-2-font-style);line-height:var(--ig-subtitle-2-line-height);letter-spacing:var(--ig-subtitle-2-letter-spacing);text-transform:var(--ig-subtitle-2-text-transform);margin-top:var(--ig-subtitle-2-margin-top);margin-bottom:var(--ig-subtitle-2-margin-bottom);margin:0}}}@layer ig.material{@container style(--ig-theme: material){.igx-card-content>*:not(igx-icon){font-family:var(--ig-body-2-font-family, var(--ig-font-family));font-size:var(--ig-body-2-font-size);font-weight:var(--ig-body-2-font-weight);font-style:var(--ig-body-2-font-style);line-height:var(--ig-body-2-line-height);letter-spacing:var(--ig-body-2-letter-spacing);text-transform:var(--ig-body-2-text-transform);margin-top:var(--ig-body-2-margin-top);margin-bottom:var(--ig-body-2-margin-bottom);margin:0}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-card-header__title{font-family:var(--ig-h5-font-family, var(--ig-font-family));font-size:var(--ig-h5-font-size);font-weight:var(--ig-h5-font-weight);font-style:var(--ig-h5-font-style);line-height:var(--ig-h5-line-height);letter-spacing:var(--ig-h5-letter-spacing);text-transform:var(--ig-h5-text-transform);margin-top:var(--ig-h5-margin-top);margin-bottom:var(--ig-h5-margin-bottom);margin:0}.igx-card-header__title--small{font-family:var(--ig-subtitle-2-font-family, var(--ig-font-family));font-size:var(--ig-subtitle-2-font-size);font-weight:var(--ig-subtitle-2-font-weight);font-style:var(--ig-subtitle-2-font-style);line-height:var(--ig-subtitle-2-line-height);letter-spacing:var(--ig-subtitle-2-letter-spacing);text-transform:var(--ig-subtitle-2-text-transform);margin-top:var(--ig-subtitle-2-margin-top);margin-bottom:var(--ig-subtitle-2-margin-bottom);margin:0}.igx-card-header__subtitle{font-family:var(--ig-body-1-font-family, var(--ig-font-family));font-size:var(--ig-body-1-font-size);font-weight:var(--ig-body-1-font-weight);font-style:var(--ig-body-1-font-style);line-height:var(--ig-body-1-line-height);letter-spacing:var(--ig-body-1-letter-spacing);text-transform:var(--ig-body-1-text-transform);margin-top:var(--ig-body-1-margin-top);margin-bottom:var(--ig-body-1-margin-bottom);margin:0}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-card-content{padding-block:1rem 1.5rem;padding-inline:1rem}.igx-card-content>*:not(igx-icon){font-family:var(--ig-body-1-font-family, var(--ig-font-family));font-size:var(--ig-body-1-font-size);font-weight:var(--ig-body-1-font-weight);font-style:var(--ig-body-1-font-style);line-height:var(--ig-body-1-line-height);letter-spacing:var(--ig-body-1-letter-spacing);text-transform:var(--ig-body-1-text-transform);margin-top:var(--ig-body-1-margin-top);margin-bottom:var(--ig-body-1-margin-bottom);margin:0}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-card-actions{padding:1rem}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-card-header__title{font-family:var(--ig-subtitle-1-font-family, var(--ig-font-family));font-size:var(--ig-subtitle-1-font-size);font-weight:var(--ig-subtitle-1-font-weight);font-style:var(--ig-subtitle-1-font-style);line-height:var(--ig-subtitle-1-line-height);letter-spacing:var(--ig-subtitle-1-letter-spacing);text-transform:var(--ig-subtitle-1-text-transform);margin-top:var(--ig-subtitle-1-margin-top);margin-bottom:var(--ig-subtitle-1-margin-bottom);margin:0}.igx-card-header__title--small{font-family:var(--ig-subtitle-2-font-family, var(--ig-font-family));font-size:var(--ig-subtitle-2-font-size);font-weight:var(--ig-subtitle-2-font-weight);font-style:var(--ig-subtitle-2-font-style);line-height:var(--ig-subtitle-2-line-height);letter-spacing:var(--ig-subtitle-2-letter-spacing);text-transform:var(--ig-subtitle-2-text-transform);margin-top:var(--ig-subtitle-2-margin-top);margin-bottom:var(--ig-subtitle-2-margin-bottom);margin:0}.igx-card-header__subtitle{font-family:var(--ig-body-2-font-family, var(--ig-font-family));font-size:var(--ig-body-2-font-size);font-weight:var(--ig-body-2-font-weight);font-style:var(--ig-body-2-font-style);line-height:var(--ig-body-2-line-height);letter-spacing:var(--ig-body-2-letter-spacing);text-transform:var(--ig-body-2-text-transform);margin-top:var(--ig-body-2-margin-top);margin-bottom:var(--ig-body-2-margin-bottom);margin:0}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-card-content>*:not(igx-icon){font-family:var(--ig-body-2-font-family, var(--ig-font-family));font-size:var(--ig-body-2-font-size);font-weight:var(--ig-body-2-font-weight);font-style:var(--ig-body-2-font-style);line-height:var(--ig-body-2-line-height);letter-spacing:var(--ig-body-2-letter-spacing);text-transform:var(--ig-body-2-text-transform);margin-top:var(--ig-body-2-margin-top);margin-bottom:var(--ig-body-2-margin-bottom);margin:0}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-card igx-avatar{--ig-size: 3}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-card-header+.igx-card-content{padding-block-start:0}.igx-card-header__thumbnail{margin-inline-end:.5rem;margin-block:auto}.igx-card-header__titles{gap:.125rem}.igx-card-header__titles .igx-card-header__subtitle{margin-block-end:.125rem}.igx-card-header__title{font-family:var(--ig-h6-font-family, var(--ig-font-family));font-size:var(--ig-h6-font-size);font-weight:var(--ig-h6-font-weight);font-style:var(--ig-h6-font-style);line-height:var(--ig-h6-line-height);letter-spacing:var(--ig-h6-letter-spacing);text-transform:var(--ig-h6-text-transform);margin-top:var(--ig-h6-margin-top);margin-bottom:var(--ig-h6-margin-bottom);margin:0}.igx-card-header__title--small,.igx-card-header__subtitle{font-family:var(--ig-body-2-font-family, var(--ig-font-family));font-size:var(--ig-body-2-font-size);font-weight:var(--ig-body-2-font-weight);font-style:var(--ig-body-2-font-style);line-height:var(--ig-body-2-line-height);letter-spacing:var(--ig-body-2-letter-spacing);text-transform:var(--ig-body-2-text-transform);margin-top:var(--ig-body-2-margin-top);margin-bottom:var(--ig-body-2-margin-bottom);margin:0}.igx-card-header--vertical .igx-card-header__thumbnail{margin-bottom:.5rem}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-card-content{padding:1rem}.igx-card-content+.igx-card-actions{padding-block-start:.5rem}.igx-card-content>*:not(igx-icon){font-family:var(--ig-body-2-font-family, var(--ig-font-family));font-size:var(--ig-body-2-font-size);font-weight:var(--ig-body-2-font-weight);font-style:var(--ig-body-2-font-style);line-height:var(--ig-body-2-line-height);letter-spacing:var(--ig-body-2-letter-spacing);text-transform:var(--ig-body-2-text-transform);margin-top:var(--ig-body-2-margin-top);margin-bottom:var(--ig-body-2-margin-bottom);margin:0}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-card-actions{padding:1rem}.igx-card-actions [igxButton],.igx-card-actions [igxIconButton]{--ig-size: 2}}}\n"], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None }); }
|
|
310
310
|
}
|
|
311
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
311
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCardComponent, decorators: [{
|
|
312
312
|
type: Component,
|
|
313
313
|
args: [{ selector: 'igx-card', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.Eager, standalone: true, template: "<ng-content></ng-content>\n", styles: ["@layer ig.base{.igx-card-actions__end,.igx-card-actions__start{display:flex;align-items:center;gap:.5rem;color:var(--actions-text-color)}.igx-card-actions__end:empty,.igx-card-actions__start:empty{display:none}.igx-card-actions--vertical .igx-card-actions__end,.igx-card-actions--vertical .igx-card-actions__start{flex-direction:column}.igx-card-actions--vertical .igx-card-actions__end [igxButton]~[igxButton],.igx-card-actions--vertical .igx-card-actions__start [igxButton]~[igxButton]{margin-inline-start:0;margin-top:.5rem}.igx-card-actions--justify .igx-card-actions__end,.igx-card-actions--justify .igx-card-actions__start{justify-content:space-around;flex-grow:1}.igx-card-actions--justify .igx-card-actions__end:empty,.igx-card-actions--justify .igx-card-actions__start:empty{display:none}.igx-card{display:flex;flex-direction:column;overflow:hidden;border-radius:var(--border-radius);background:var(--background);transition:box-shadow .3s cubic-bezier(.25,.8,.25,1);backface-visibility:hidden;border:.0625rem solid var(--outline-color)}.igx-card:hover{box-shadow:none}.igx-card igx-avatar{--ig-size: 1}.igx-card__media{display:block;overflow:hidden;line-height:0}.igx-card__media>*{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.igx-card__media--right{width:auto;margin-inline-start:auto;order:9999}.igx-card--elevated{box-shadow:var(--resting-elevation);border:.0625rem solid var(--outline-color)}.igx-card--elevated:hover{box-shadow:var(--hover-elevation)}.igx-card--horizontal{flex-direction:row}.igx-card-header{display:flex;flex-flow:row wrap;align-items:center;width:100%;padding:1rem;color:var(--header-text-color)}.igx-card-header:empty{display:block;padding:0}.igx-card-header__thumbnail{margin-inline-end:1rem}.igx-card-header__thumbnail:empty{display:none}.igx-card-header__titles{display:flex;flex-flow:column nowrap;overflow:hidden;flex:1 1 auto;justify-content:center}.igx-card-header__titles:empty{display:none}.igx-card-header__subtitle{color:var(--subtitle-text-color)}.igx-card-header--vertical{flex-flow:column nowrap}.igx-card-header--vertical .igx-card-header__titles{text-align:center}.igx-card-header--vertical .igx-card-header__thumbnail{display:flex;justify-content:center;align-self:unset;margin-inline-end:0;margin-bottom:1rem}.igx-card-content{display:block;width:100%;padding:1rem;color:var(--content-text-color);overflow:auto}.igx-card-actions{display:flex;flex-flow:row wrap;justify-content:space-between;align-items:center;padding:.5rem 1rem}.igx-card-actions:first-child{margin-block-end:auto}.igx-card-actions:last-child{margin-block-start:auto}.igx-card-actions__start{order:0}.igx-card-actions__end{order:1;margin-inline-start:auto;gap:.5rem}.igx-card-actions__end:empty{display:none}.igx-card-actions--vertical{flex-direction:column}.igx-card-actions--vertical:is(:first-child,:last-child){margin-block:initial}[dir=rtl] .igx-card-actions--vertical{order:-1}.igx-card-actions--vertical .igx-card-actions__end{margin-top:auto;margin-inline-start:0}.igx-card-actions--reverse .igx-card-actions__start{order:1;margin-inline-start:auto}.igx-card-actions--reverse .igx-card-actions__end{order:0;margin-inline-start:0}.igx-card-actions--vertical.igx-card-actions--reverse .igx-card-actions__start{margin:auto 0 0}.igx-card-actions--vertical.igx-card-actions--reverse .igx-card-actions__end{margin:0 0 auto}}@layer ig.material{@container style(--ig-theme: material){.igx-card-header__title{font-family:var(--ig-h6-font-family, var(--ig-font-family));font-size:var(--ig-h6-font-size);font-weight:var(--ig-h6-font-weight);font-style:var(--ig-h6-font-style);line-height:var(--ig-h6-line-height);letter-spacing:var(--ig-h6-letter-spacing);text-transform:var(--ig-h6-text-transform);margin-top:var(--ig-h6-margin-top);margin-bottom:var(--ig-h6-margin-bottom);margin:0}.igx-card-header__title--small,.igx-card-header__subtitle{font-family:var(--ig-subtitle-2-font-family, var(--ig-font-family));font-size:var(--ig-subtitle-2-font-size);font-weight:var(--ig-subtitle-2-font-weight);font-style:var(--ig-subtitle-2-font-style);line-height:var(--ig-subtitle-2-line-height);letter-spacing:var(--ig-subtitle-2-letter-spacing);text-transform:var(--ig-subtitle-2-text-transform);margin-top:var(--ig-subtitle-2-margin-top);margin-bottom:var(--ig-subtitle-2-margin-bottom);margin:0}}}@layer ig.material{@container style(--ig-theme: material){.igx-card-content>*:not(igx-icon){font-family:var(--ig-body-2-font-family, var(--ig-font-family));font-size:var(--ig-body-2-font-size);font-weight:var(--ig-body-2-font-weight);font-style:var(--ig-body-2-font-style);line-height:var(--ig-body-2-line-height);letter-spacing:var(--ig-body-2-letter-spacing);text-transform:var(--ig-body-2-text-transform);margin-top:var(--ig-body-2-margin-top);margin-bottom:var(--ig-body-2-margin-bottom);margin:0}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-card-header__title{font-family:var(--ig-h5-font-family, var(--ig-font-family));font-size:var(--ig-h5-font-size);font-weight:var(--ig-h5-font-weight);font-style:var(--ig-h5-font-style);line-height:var(--ig-h5-line-height);letter-spacing:var(--ig-h5-letter-spacing);text-transform:var(--ig-h5-text-transform);margin-top:var(--ig-h5-margin-top);margin-bottom:var(--ig-h5-margin-bottom);margin:0}.igx-card-header__title--small{font-family:var(--ig-subtitle-2-font-family, var(--ig-font-family));font-size:var(--ig-subtitle-2-font-size);font-weight:var(--ig-subtitle-2-font-weight);font-style:var(--ig-subtitle-2-font-style);line-height:var(--ig-subtitle-2-line-height);letter-spacing:var(--ig-subtitle-2-letter-spacing);text-transform:var(--ig-subtitle-2-text-transform);margin-top:var(--ig-subtitle-2-margin-top);margin-bottom:var(--ig-subtitle-2-margin-bottom);margin:0}.igx-card-header__subtitle{font-family:var(--ig-body-1-font-family, var(--ig-font-family));font-size:var(--ig-body-1-font-size);font-weight:var(--ig-body-1-font-weight);font-style:var(--ig-body-1-font-style);line-height:var(--ig-body-1-line-height);letter-spacing:var(--ig-body-1-letter-spacing);text-transform:var(--ig-body-1-text-transform);margin-top:var(--ig-body-1-margin-top);margin-bottom:var(--ig-body-1-margin-bottom);margin:0}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-card-content{padding-block:1rem 1.5rem;padding-inline:1rem}.igx-card-content>*:not(igx-icon){font-family:var(--ig-body-1-font-family, var(--ig-font-family));font-size:var(--ig-body-1-font-size);font-weight:var(--ig-body-1-font-weight);font-style:var(--ig-body-1-font-style);line-height:var(--ig-body-1-line-height);letter-spacing:var(--ig-body-1-letter-spacing);text-transform:var(--ig-body-1-text-transform);margin-top:var(--ig-body-1-margin-top);margin-bottom:var(--ig-body-1-margin-bottom);margin:0}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-card-actions{padding:1rem}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-card-header__title{font-family:var(--ig-subtitle-1-font-family, var(--ig-font-family));font-size:var(--ig-subtitle-1-font-size);font-weight:var(--ig-subtitle-1-font-weight);font-style:var(--ig-subtitle-1-font-style);line-height:var(--ig-subtitle-1-line-height);letter-spacing:var(--ig-subtitle-1-letter-spacing);text-transform:var(--ig-subtitle-1-text-transform);margin-top:var(--ig-subtitle-1-margin-top);margin-bottom:var(--ig-subtitle-1-margin-bottom);margin:0}.igx-card-header__title--small{font-family:var(--ig-subtitle-2-font-family, var(--ig-font-family));font-size:var(--ig-subtitle-2-font-size);font-weight:var(--ig-subtitle-2-font-weight);font-style:var(--ig-subtitle-2-font-style);line-height:var(--ig-subtitle-2-line-height);letter-spacing:var(--ig-subtitle-2-letter-spacing);text-transform:var(--ig-subtitle-2-text-transform);margin-top:var(--ig-subtitle-2-margin-top);margin-bottom:var(--ig-subtitle-2-margin-bottom);margin:0}.igx-card-header__subtitle{font-family:var(--ig-body-2-font-family, var(--ig-font-family));font-size:var(--ig-body-2-font-size);font-weight:var(--ig-body-2-font-weight);font-style:var(--ig-body-2-font-style);line-height:var(--ig-body-2-line-height);letter-spacing:var(--ig-body-2-letter-spacing);text-transform:var(--ig-body-2-text-transform);margin-top:var(--ig-body-2-margin-top);margin-bottom:var(--ig-body-2-margin-bottom);margin:0}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-card-content>*:not(igx-icon){font-family:var(--ig-body-2-font-family, var(--ig-font-family));font-size:var(--ig-body-2-font-size);font-weight:var(--ig-body-2-font-weight);font-style:var(--ig-body-2-font-style);line-height:var(--ig-body-2-line-height);letter-spacing:var(--ig-body-2-letter-spacing);text-transform:var(--ig-body-2-text-transform);margin-top:var(--ig-body-2-margin-top);margin-bottom:var(--ig-body-2-margin-bottom);margin:0}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-card igx-avatar{--ig-size: 3}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-card-header+.igx-card-content{padding-block-start:0}.igx-card-header__thumbnail{margin-inline-end:.5rem;margin-block:auto}.igx-card-header__titles{gap:.125rem}.igx-card-header__titles .igx-card-header__subtitle{margin-block-end:.125rem}.igx-card-header__title{font-family:var(--ig-h6-font-family, var(--ig-font-family));font-size:var(--ig-h6-font-size);font-weight:var(--ig-h6-font-weight);font-style:var(--ig-h6-font-style);line-height:var(--ig-h6-line-height);letter-spacing:var(--ig-h6-letter-spacing);text-transform:var(--ig-h6-text-transform);margin-top:var(--ig-h6-margin-top);margin-bottom:var(--ig-h6-margin-bottom);margin:0}.igx-card-header__title--small,.igx-card-header__subtitle{font-family:var(--ig-body-2-font-family, var(--ig-font-family));font-size:var(--ig-body-2-font-size);font-weight:var(--ig-body-2-font-weight);font-style:var(--ig-body-2-font-style);line-height:var(--ig-body-2-line-height);letter-spacing:var(--ig-body-2-letter-spacing);text-transform:var(--ig-body-2-text-transform);margin-top:var(--ig-body-2-margin-top);margin-bottom:var(--ig-body-2-margin-bottom);margin:0}.igx-card-header--vertical .igx-card-header__thumbnail{margin-bottom:.5rem}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-card-content{padding:1rem}.igx-card-content+.igx-card-actions{padding-block-start:.5rem}.igx-card-content>*:not(igx-icon){font-family:var(--ig-body-2-font-family, var(--ig-font-family));font-size:var(--ig-body-2-font-size);font-weight:var(--ig-body-2-font-weight);font-style:var(--ig-body-2-font-style);line-height:var(--ig-body-2-line-height);letter-spacing:var(--ig-body-2-letter-spacing);text-transform:var(--ig-body-2-text-transform);margin-top:var(--ig-body-2-margin-top);margin-bottom:var(--ig-body-2-margin-bottom);margin:0}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-card-actions{padding:1rem}.igx-card-actions [igxButton],.igx-card-actions [igxIconButton]{--ig-size: 2}}}\n"] }]
|
|
314
314
|
}], propDecorators: { id: [{
|
|
@@ -393,10 +393,10 @@ class IgxCardActionsComponent {
|
|
|
393
393
|
this.vertical = true;
|
|
394
394
|
}
|
|
395
395
|
}
|
|
396
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
397
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "22.1.
|
|
396
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCardActionsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
397
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "22.1.7", type: IgxCardActionsComponent, isStandalone: true, selector: "igx-card-actions", inputs: { layout: "layout", vertical: ["vertical", "vertical", booleanAttribute] }, host: { properties: { "class.igx-card-actions": "this.layout", "class.igx-card-actions--vertical": "this.vertical", "class.igx-card-actions--justify": "this.isJustifyLayout" } }, usesOnChanges: true, ngImport: i0, template: "<div #buttons class=\"igx-card-actions__start\">\n <ng-content select=\"[igxStart], [igxButton]:not([igxEnd])\"></ng-content>\n</div>\n\n<ng-content></ng-content>\n\n<div class=\"igx-card-actions__end\">\n <ng-content select=\"[igxEnd], [igxIconButton]:not([igxStart]), igx-icon:not([igxStart])\"></ng-content>\n</div>\n", changeDetection: i0.ChangeDetectionStrategy.Eager }); }
|
|
398
398
|
}
|
|
399
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
399
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCardActionsComponent, decorators: [{
|
|
400
400
|
type: Component,
|
|
401
401
|
args: [{ selector: 'igx-card-actions', changeDetection: ChangeDetectionStrategy.Eager, standalone: true, template: "<div #buttons class=\"igx-card-actions__start\">\n <ng-content select=\"[igxStart], [igxButton]:not([igxEnd])\"></ng-content>\n</div>\n\n<ng-content></ng-content>\n\n<div class=\"igx-card-actions__end\">\n <ng-content select=\"[igxEnd], [igxIconButton]:not([igxStart]), igx-icon:not([igxStart])\"></ng-content>\n</div>\n" }]
|
|
402
402
|
}], propDecorators: { layout: [{
|
|
@@ -433,11 +433,11 @@ const IGX_CARD_DIRECTIVES = [
|
|
|
433
433
|
* IMPORTANT: The following is NgModule exported for backwards-compatibility before standalone components
|
|
434
434
|
*/
|
|
435
435
|
class IgxCardModule {
|
|
436
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
437
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.
|
|
438
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.
|
|
436
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCardModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
437
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.7", ngImport: i0, type: IgxCardModule, imports: [IgxCardComponent, IgxCardHeaderComponent, IgxCardMediaDirective, IgxCardContentDirective, IgxCardActionsComponent, IgxCardFooterDirective, IgxCardHeaderTitleDirective, IgxCardHeaderSubtitleDirective, IgxCardThumbnailDirective], exports: [IgxCardComponent, IgxCardHeaderComponent, IgxCardMediaDirective, IgxCardContentDirective, IgxCardActionsComponent, IgxCardFooterDirective, IgxCardHeaderTitleDirective, IgxCardHeaderSubtitleDirective, IgxCardThumbnailDirective] }); }
|
|
438
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCardModule }); }
|
|
439
439
|
}
|
|
440
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
440
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCardModule, decorators: [{
|
|
441
441
|
type: NgModule,
|
|
442
442
|
args: [{
|
|
443
443
|
imports: [
|
|
@@ -180,18 +180,18 @@ class IgxCarouselComponentBase {
|
|
|
180
180
|
});
|
|
181
181
|
this.leaveAnimationPlayer.play();
|
|
182
182
|
}
|
|
183
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
184
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.
|
|
183
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCarouselComponentBase, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
184
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: IgxCarouselComponentBase, isStandalone: true, ngImport: i0 }); }
|
|
185
185
|
}
|
|
186
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
186
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCarouselComponentBase, decorators: [{
|
|
187
187
|
type: Directive
|
|
188
188
|
}] });
|
|
189
189
|
|
|
190
190
|
class IgxCarouselIndicatorDirective {
|
|
191
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
192
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.
|
|
191
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCarouselIndicatorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
192
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: IgxCarouselIndicatorDirective, isStandalone: true, selector: "[igxCarouselIndicator]", ngImport: i0 }); }
|
|
193
193
|
}
|
|
194
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
194
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCarouselIndicatorDirective, decorators: [{
|
|
195
195
|
type: Directive,
|
|
196
196
|
args: [{
|
|
197
197
|
selector: '[igxCarouselIndicator]',
|
|
@@ -199,10 +199,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImpor
|
|
|
199
199
|
}]
|
|
200
200
|
}] });
|
|
201
201
|
class IgxCarouselNextButtonDirective {
|
|
202
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
203
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.
|
|
202
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCarouselNextButtonDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
203
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: IgxCarouselNextButtonDirective, isStandalone: true, selector: "[igxCarouselNextButton]", ngImport: i0 }); }
|
|
204
204
|
}
|
|
205
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
205
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCarouselNextButtonDirective, decorators: [{
|
|
206
206
|
type: Directive,
|
|
207
207
|
args: [{
|
|
208
208
|
selector: '[igxCarouselNextButton]',
|
|
@@ -210,10 +210,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImpor
|
|
|
210
210
|
}]
|
|
211
211
|
}] });
|
|
212
212
|
class IgxCarouselPrevButtonDirective {
|
|
213
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
214
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.
|
|
213
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCarouselPrevButtonDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
214
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: IgxCarouselPrevButtonDirective, isStandalone: true, selector: "[igxCarouselPrevButton]", ngImport: i0 }); }
|
|
215
215
|
}
|
|
216
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
216
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCarouselPrevButtonDirective, decorators: [{
|
|
217
217
|
type: Directive,
|
|
218
218
|
args: [{
|
|
219
219
|
selector: '[igxCarouselPrevButton]',
|
|
@@ -324,10 +324,10 @@ class IgxSlideComponent {
|
|
|
324
324
|
this._destroy$.next(true);
|
|
325
325
|
this._destroy$.complete();
|
|
326
326
|
}
|
|
327
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
328
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "22.1.
|
|
327
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxSlideComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
328
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "22.1.7", type: IgxSlideComponent, isStandalone: true, selector: "igx-slide", inputs: { index: "index", direction: "direction", total: "total", active: ["active", "active", booleanAttribute], previous: ["previous", "previous", booleanAttribute] }, outputs: { activeChange: "activeChange" }, host: { properties: { "attr.tabindex": "this.tabIndex", "attr.id": "this.id", "attr.role": "this.tab", "attr.aria-labelledby": "this.ariaLabelledBy", "class.igx-slide": "this.cssClass", "class.igx-slide--current": "this.active", "class.igx-slide--previous": "this.previous" } }, ngImport: i0, template: "<ng-content></ng-content>\n", changeDetection: i0.ChangeDetectionStrategy.Eager }); }
|
|
329
329
|
}
|
|
330
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
330
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxSlideComponent, decorators: [{
|
|
331
331
|
type: Component,
|
|
332
332
|
args: [{ selector: 'igx-slide', changeDetection: ChangeDetectionStrategy.Eager, standalone: true, template: "<ng-content></ng-content>\n" }]
|
|
333
333
|
}], propDecorators: { index: [{
|
|
@@ -1294,10 +1294,10 @@ class IgxCarouselComponent extends IgxCarouselComponentBase {
|
|
|
1294
1294
|
});
|
|
1295
1295
|
}
|
|
1296
1296
|
}
|
|
1297
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
1298
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: IgxCarouselComponent, isStandalone: true, selector: "igx-carousel", inputs: { id: "id", loop: ["loop", "loop", booleanAttribute], pause: ["pause", "pause", booleanAttribute], navigation: ["navigation", "navigation", booleanAttribute], indicators: ["indicators", "indicators", booleanAttribute], vertical: ["vertical", "vertical", booleanAttribute], gesturesSupport: ["gesturesSupport", "gesturesSupport", booleanAttribute], maximumIndicatorsCount: "maximumIndicatorsCount", indicatorsOrientation: "indicatorsOrientation", animationType: "animationType", resourceStrings: "resourceStrings", interval: "interval" }, outputs: { slideChanged: "slideChanged", slideAdded: "slideAdded", slideRemoved: "slideRemoved", carouselPaused: "carouselPaused", carouselPlaying: "carouselPlaying" }, host: { listeners: { "mouseenter": "onMouseEnter()", "mouseleave": "onMouseLeave()" }, properties: { "attr.id": "this.id", "attr.role": "this.role", "attr.aria-roledescription": "this.roleDescription", "attr.aria-labelledby": "this.labelId", "class.igx-carousel--vertical": "this.isVertical", "class.igx-carousel": "this.cssClass", "style.touch-action": "this.touchAction" } }, queries: [{ propertyName: "indicatorTemplate", first: true, predicate: IgxCarouselIndicatorDirective, descendants: true, read: TemplateRef }, { propertyName: "nextButtonTemplate", first: true, predicate: IgxCarouselNextButtonDirective, descendants: true, read: TemplateRef }, { propertyName: "prevButtonTemplate", first: true, predicate: IgxCarouselPrevButtonDirective, descendants: true, read: TemplateRef }, { propertyName: "slides", predicate: IgxSlideComponent }], viewQueries: [{ propertyName: "defaultIndicator", first: true, predicate: ["defaultIndicator"], descendants: true, read: TemplateRef, static: true }, { propertyName: "defaultNextButton", first: true, predicate: ["defaultNextButton"], descendants: true, read: TemplateRef, static: true }, { propertyName: "defaultPrevButton", first: true, predicate: ["defaultPrevButton"], descendants: true, read: TemplateRef, static: true }, { propertyName: "_indicators", predicate: ["indicators"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: "<ng-template #defaultIndicator let-slide>\n <div class=\"igx-nav-dot\"\n [class.igx-nav-dot--active]=\"slide.active\">\n </div>\n</ng-template>\n\n<ng-template #defaultNextButton>\n <igx-icon aria-hidden=\"true\" family=\"default\" name=\"carousel_next\"\n class=\"igx-nav-arrow\">\n </igx-icon>\n</ng-template>\n\n<ng-template #defaultPrevButton>\n <igx-icon aria-hidden=\"true\" family=\"default\" name=\"carousel_prev\"\n class=\"igx-nav-arrow\">\n </igx-icon>\n</ng-template>\n\n@if (showIndicators) {\n <div [ngClass]=\"indicatorsClass\" [attr.role]=\"'tablist'\" (keyup)=\"handleKeyUp($event)\" (focusout)=\"handleFocusOut($event)\" (click)=\"handleClick()\" (keydown)=\"handleKeydown($event)\">\n @for (slide of slides; track slide) {\n <div #indicators\n class=\"igx-carousel-indicators__indicator\"\n (click)=\"select(slide)\"\n [id]=\"'tab-'+ slide.index + '-' + total\"\n [attr.role]=\"'tab'\"\n [attr.tabindex]=\"slide.active ? 0 : -1\"\n [attr.aria-label]=\"resourceStrings.igx_carousel_slide + ' ' + (slide.index + 1) + ' ' + resourceStrings.igx_carousel_of + ' ' + this.total\"\n [attr.aria-controls]=\"'panel-' + slide.index\"\n [attr.aria-selected]=\"slide.active\">\n <ng-container *ngTemplateOutlet=\"getIndicatorTemplate; context: {$implicit: slide};\"></ng-container>\n </div>\n }\n </div>\n}\n\n@if (navigation && slides.length) {\n <button\n igxButton\n class=\"igx-carousel__arrow igx-carousel__arrow--prev\"\n [attr.aria-label]=\"resourceStrings.igx_carousel_previous_slide\"\n [disabled]=\"prevButtonDisabled\"\n (click)=\"prev()\"\n (keydown)=\"handleKeydownPrev($event)\">\n <ng-container *ngTemplateOutlet=\"getPrevButtonTemplate; context: {$implicit: prevButtonDisabled};\"></ng-container>\n </button>\n}\n\n@if (navigation && slides.length) {\n <button\n igxButton\n class=\"igx-carousel__arrow igx-carousel__arrow--next\"\n [attr.aria-label]=\"resourceStrings.igx_carousel_next_slide\"\n [disabled]=\"nextButtonDisabled\"\n (click)=\"next()\"\n (keydown)=\"handleKeydownNext($event)\">\n <ng-container *ngTemplateOutlet=\"getNextButtonTemplate; context: {$implicit: nextButtonDisabled};\"></ng-container>\n </button>\n}\n\n\n@if (showIndicatorsLabel) {\n <div [ngClass]=\"indicatorsClass\" class=\"igx-carousel-label-indicator\" [class.igx-carousel-label-indicator--vertical]=\"isVertical\">\n <span [id]=\"labelId\" class=\"igx-carousel__label\">{{getCarouselLabel}}</span>\n </div>\n}\n\n<div class=\"igx-carousel__inner\" [attr.aria-live]=\"!interval || stoppedByInteraction ? 'polite' : 'off'\">\n <ng-content></ng-content>\n</div>\n", styles: ["@layer ig.base{@keyframes scale-in-center{0%{transform:scale(0);opacity:1}to{transform:scale(1);opacity:1}}@keyframes scale-out-center{0%{transform:scale(1);opacity:1}to{transform:scale(0);opacity:1}}.igx-carousel{--nav-btn-border-radius: var(--border-radius);display:flex;position:relative;justify-content:center;width:100%;height:100%;align-items:center;flex-flow:column nowrap}.igx-carousel__inner{position:relative;width:100%;height:inherit;overflow:hidden;outline-style:none;min-height:15rem;min-width:18.75rem}.igx-carousel__label{align-items:center}.igx-carousel__arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:3;outline:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;display:flex;justify-content:center;align-items:center;min-width:unset;width:2.875rem;height:2.875rem;cursor:pointer;outline-style:none;transition:all .15s ease-in-out;background:var(--button-background);box-shadow:var(--button-elevation);border:.0625rem solid var(--button-border-color);border-radius:var(--nav-btn-border-radius)}[dir=rtl] .igx-carousel__arrow{transform:scaleX(-1)}.igx-carousel__arrow igx-icon{--component-size: 1;color:var(--button-arrow-color)}.igx-carousel__arrow:hover{background:var(--button-hover-background);border-color:var(--button-hover-border-color)}.igx-carousel__arrow:hover igx-icon{color:var(--button-hover-arrow-color)}.igx-carousel__arrow[igxButton].igx-button--focused{background:var(--button-background);border:.125rem solid var(--button-focus-border-color)}.igx-carousel__arrow[igxButton].igx-button--focused igx-icon{color:var(--button-focus-border-color)}.igx-carousel__arrow[igxButton].igx-button--disabled{background:var(--button-disabled-background);color:var(--button-disabled-arrow-color);border-color:var(--button-disabled-border-color);pointer-events:none;box-shadow:none}.igx-carousel__arrow[igxButton].igx-button--disabled igx-icon{color:currentColor}.igx-carousel__arrow--prev{inset-inline-start:0;margin-inline-start:1rem}.igx-carousel__arrow--next{inset-inline-end:0;margin-inline-end:1rem}.igx-carousel--vertical .igx-carousel__arrow{inset-inline-start:unset;inset-block-start:unset;inset-inline-end:0;margin-inline-end:1rem;transform:none}.igx-carousel--vertical .igx-carousel__arrow igx-icon{transform:rotate(90deg)}.igx-carousel--vertical .igx-carousel__arrow--prev{inset-block-start:0;margin-block-start:1rem}.igx-carousel--vertical .igx-carousel__arrow--next{inset-block-end:0;margin-block-end:1rem}.igx-carousel-indicators{position:absolute;display:flex;justify-content:center;align-items:center;margin:1rem 0;padding:.25rem .375rem;gap:.5rem;list-style:none;z-index:10;inset-inline-start:50%;transform:translate(-50%);background:var(--indicator-background);box-shadow:var(--button-elevation);border-radius:var(--border-radius)}[dir=rtl] .igx-carousel-indicators{transform:translate(50%)}.igx-carousel-indicators__indicator{display:flex;align-items:center;justify-content:center;cursor:pointer}.igx-carousel-indicators__indicator:focus-visible{outline-style:none}.igx-carousel-indicators--start{top:0}.igx-carousel-indicators--end{bottom:0}.igx-carousel-indicators--focused:after{position:absolute;content:\"\";pointer-events:none;width:100%;height:100%;border-radius:inherit;border:.125rem solid var(--indicator-focus-color)}.igx-carousel-indicators--focused .igx-nav-dot--active{border-color:var(--indicator-focus-color)}.igx-carousel-indicators--focused .igx-nav-dot--active:after{background:var(--indicator-focus-color)}.igx-carousel-indicators--vertical{inset-inline-end:0;inset-inline-start:unset;flex-direction:column;inset-block-start:50%;transform:translateY(-50%);margin-block:0;margin-inline-end:1.8125rem;padding:.375rem .25rem;bottom:unset}[dir=rtl] .igx-carousel-indicators--vertical{transform:translateY(-50%)}.igx-carousel-indicators--vertical.igx-carousel-indicators--start{inset-inline-end:unset;inset-inline-start:0;margin-inline-start:1rem;margin-inline-end:unset}.igx-carousel-label-indicator{font-family:var(--ig-caption-font-family, var(--ig-font-family));font-size:var(--ig-caption-font-size);font-weight:var(--ig-caption-font-weight);font-style:var(--ig-caption-font-style);line-height:var(--ig-caption-line-height);letter-spacing:var(--ig-caption-letter-spacing);text-transform:var(--ig-caption-text-transform);margin-top:var(--ig-caption-margin-top);margin-bottom:var(--ig-caption-margin-bottom);margin:1rem 0;min-width:2.875rem;box-shadow:none;border-radius:.25rem;color:var(--indicator-color);background:var(--label-indicator-background)}.igx-carousel-label-indicator--vertical{margin-block:0;margin-inline-end:1rem;padding:.25rem .375rem}.igx-slide{position:absolute;width:100%;height:100%;inset:0;z-index:-1;background:var(--slide-background);visibility:hidden}.igx-slide img{width:inherit;height:inherit;-o-object-fit:cover;object-fit:cover;touch-action:none;pointer-events:none}.igx-slide--current{z-index:2;visibility:visible}.igx-slide--previous{z-index:1;visibility:visible}.igx-nav-dot{position:relative;width:.75rem;height:.75rem;text-indent:-624.9375rem;border:.125rem solid var(--indicator-border-color);border-radius:clamp(0rem,calc(var(--ig-radius-factor, 1) * 50%),50%);transition:all .15s cubic-bezier(.25,.46,.45,.94)}.igx-nav-dot:after{animation:scale-out-center .15s cubic-bezier(.25,.46,.45,.94) forwards;content:\"\";position:absolute;border-radius:inherit;background:var(--indicator-dot-color);inset:.0625rem}.igx-nav-dot:hover{border-color:var(--indicator-active-border-color)}.igx-nav-dot--active{border:.125rem solid var(--indicator-active-border-color)}.igx-nav-dot--active:after{animation:scale-in-center .15s cubic-bezier(.25,.46,.45,.94) forwards;background:var(--indicator-active-dot-color)}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-carousel__arrow[igxButton].igx-button--focused{box-shadow:0 0 0 .25rem var(--button-focus-border-color);border-color:var(--button-border-color)}.igx-carousel__arrow[igxButton].igx-button--focused igx-icon{color:var(--button-arrow-color)}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-carousel-indicators--focused:after{border:none;box-shadow:0 0 0 .25rem var(--button-focus-border-color)}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-carousel__arrow[igxButton].igx-button--focused{border:none}.igx-carousel__arrow[igxButton].igx-button--focused igx-icon{color:var(--indicator-focus-color)}.igx-carousel__arrow[igxButton].igx-button--focused:after{position:absolute;content:\"\";pointer-events:none;inset-block-start:.1875rem;inset-inline-start:.1875rem;width:calc(100% - .375rem);height:calc(100% - .375rem);box-shadow:0 0 0 .0625rem var(--button-focus-border-color)}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-carousel-indicators--focused:after{border:none;inset-block-start:.1875rem;inset-inline-start:.1875rem;width:calc(100% - .375rem);height:calc(100% - .375rem);box-shadow:0 0 0 .0625rem var(--button-focus-border-color);border-radius:0}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-carousel-label-indicator{border-radius:.125rem}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-carousel__arrow{width:1.75rem;height:1.75rem;border-width:.125rem;padding:initial}.igx-carousel__arrow igx-icon{--component-size: 2}.igx-carousel__arrow[igxButton].igx-button--focused{box-shadow:0 0 0 .1875rem var(--indicator-focus-color)}.igx-carousel__arrow[igxButton].igx-button--focused igx-icon{color:var(--button-arrow-color)}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-carousel-indicators{gap:.25rem;padding:.375rem}.igx-carousel-indicators--focused{border:none;box-shadow:0 0 0 .1875rem var(--indicator-focus-color)}.igx-carousel-indicators--focused .igx-nav-dot--active{border-color:var(--indicator-active-dot-color);box-shadow:0 0 0 .1875rem var(--indicator-focus-color)}.igx-carousel-indicators--focused .igx-nav-dot--active:after{background:var(--indicator-active-dot-color)}.igx-carousel-indicators--focused .igx-nav-dot--active:hover:after{background:var(--indicator-active-hover-dot-color)}.igx-carousel-indicators--vertical{margin-inline-end:1rem;padding:.375rem}.igx-carousel-indicators--vertical.igx-carousel-indicators--start{margin-inline-start:1rem}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-carousel-label-indicator{border-radius:.125rem;padding:.25rem .375rem;min-width:1.75rem}.igx-carousel-label-indicator--vertical{padding:.25rem .375rem;margin-inline-end:1rem}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-nav-dot{width:1rem;height:1rem;border:unset}.igx-nav-dot:after{width:.5rem;height:.5rem;top:50%;left:50%;transform:translate(-50%,-50%);right:unset;bottom:unset;animation:none}.igx-nav-dot:hover:after{background:var(--indicator-hover-dot-color)}.igx-nav-dot:hover:before{position:absolute;content:\"\";width:inherit;height:inherit;border:.125rem solid var(--indicator-hover-dot-color);inset-inline-start:0;top:0;border-radius:clamp(0rem,calc(var(--ig-radius-factor, 1) * 50%),50%)}.igx-nav-dot--active:before{position:absolute;content:\"\";width:inherit;height:inherit;border:.125rem solid var(--indicator-active-dot-color);inset-inline-start:0;top:0;border-radius:clamp(0rem,calc(var(--ig-radius-factor, 1) * 50%),50%)}.igx-nav-dot--active:hover:after{background:var(--indicator-active-hover-dot-color)}.igx-nav-dot--active:hover:before{border-color:var(--indicator-active-hover-dot-color)}}}\n"], dependencies: [{ kind: "directive", type: IgxButtonDirective, selector: "[igxButton]", inputs: ["selected", "igxButton", "igxLabel"], outputs: ["buttonSelected"] }, { kind: "component", type: IgxIconComponent, selector: "igx-icon", inputs: ["ariaHidden", "family", "name", "active"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1297
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCarouselComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1298
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: IgxCarouselComponent, isStandalone: true, selector: "igx-carousel", inputs: { id: "id", loop: ["loop", "loop", booleanAttribute], pause: ["pause", "pause", booleanAttribute], navigation: ["navigation", "navigation", booleanAttribute], indicators: ["indicators", "indicators", booleanAttribute], vertical: ["vertical", "vertical", booleanAttribute], gesturesSupport: ["gesturesSupport", "gesturesSupport", booleanAttribute], maximumIndicatorsCount: "maximumIndicatorsCount", indicatorsOrientation: "indicatorsOrientation", animationType: "animationType", resourceStrings: "resourceStrings", interval: "interval" }, outputs: { slideChanged: "slideChanged", slideAdded: "slideAdded", slideRemoved: "slideRemoved", carouselPaused: "carouselPaused", carouselPlaying: "carouselPlaying" }, host: { listeners: { "mouseenter": "onMouseEnter()", "mouseleave": "onMouseLeave()" }, properties: { "attr.id": "this.id", "attr.role": "this.role", "attr.aria-roledescription": "this.roleDescription", "attr.aria-labelledby": "this.labelId", "class.igx-carousel--vertical": "this.isVertical", "class.igx-carousel": "this.cssClass", "style.touch-action": "this.touchAction" } }, queries: [{ propertyName: "indicatorTemplate", first: true, predicate: IgxCarouselIndicatorDirective, descendants: true, read: TemplateRef }, { propertyName: "nextButtonTemplate", first: true, predicate: IgxCarouselNextButtonDirective, descendants: true, read: TemplateRef }, { propertyName: "prevButtonTemplate", first: true, predicate: IgxCarouselPrevButtonDirective, descendants: true, read: TemplateRef }, { propertyName: "slides", predicate: IgxSlideComponent }], viewQueries: [{ propertyName: "defaultIndicator", first: true, predicate: ["defaultIndicator"], descendants: true, read: TemplateRef, static: true }, { propertyName: "defaultNextButton", first: true, predicate: ["defaultNextButton"], descendants: true, read: TemplateRef, static: true }, { propertyName: "defaultPrevButton", first: true, predicate: ["defaultPrevButton"], descendants: true, read: TemplateRef, static: true }, { propertyName: "_indicators", predicate: ["indicators"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: "<ng-template #defaultIndicator let-slide>\n <div class=\"igx-nav-dot\"\n [class.igx-nav-dot--active]=\"slide.active\">\n </div>\n</ng-template>\n\n<ng-template #defaultNextButton>\n <igx-icon aria-hidden=\"true\" family=\"default\" name=\"carousel_next\"\n class=\"igx-nav-arrow\">\n </igx-icon>\n</ng-template>\n\n<ng-template #defaultPrevButton>\n <igx-icon aria-hidden=\"true\" family=\"default\" name=\"carousel_prev\"\n class=\"igx-nav-arrow\">\n </igx-icon>\n</ng-template>\n\n@if (showIndicators) {\n <div [ngClass]=\"indicatorsClass\" [attr.role]=\"'tablist'\" (keyup)=\"handleKeyUp($event)\" (focusout)=\"handleFocusOut($event)\" (click)=\"handleClick()\" (keydown)=\"handleKeydown($event)\">\n @for (slide of slides; track slide) {\n <div #indicators\n class=\"igx-carousel-indicators__indicator\"\n (click)=\"select(slide)\"\n [id]=\"'tab-'+ slide.index + '-' + total\"\n [attr.role]=\"'tab'\"\n [attr.tabindex]=\"slide.active ? 0 : -1\"\n [attr.aria-label]=\"resourceStrings.igx_carousel_slide + ' ' + (slide.index + 1) + ' ' + resourceStrings.igx_carousel_of + ' ' + this.total\"\n [attr.aria-controls]=\"'panel-' + slide.index\"\n [attr.aria-selected]=\"slide.active\">\n <ng-container *ngTemplateOutlet=\"getIndicatorTemplate; context: {$implicit: slide};\"></ng-container>\n </div>\n }\n </div>\n}\n\n@if (navigation && slides.length) {\n <button\n igxButton\n class=\"igx-carousel__arrow igx-carousel__arrow--prev\"\n [attr.aria-label]=\"resourceStrings.igx_carousel_previous_slide\"\n [disabled]=\"prevButtonDisabled\"\n (click)=\"prev()\"\n (keydown)=\"handleKeydownPrev($event)\">\n <ng-container *ngTemplateOutlet=\"getPrevButtonTemplate; context: {$implicit: prevButtonDisabled};\"></ng-container>\n </button>\n}\n\n@if (navigation && slides.length) {\n <button\n igxButton\n class=\"igx-carousel__arrow igx-carousel__arrow--next\"\n [attr.aria-label]=\"resourceStrings.igx_carousel_next_slide\"\n [disabled]=\"nextButtonDisabled\"\n (click)=\"next()\"\n (keydown)=\"handleKeydownNext($event)\">\n <ng-container *ngTemplateOutlet=\"getNextButtonTemplate; context: {$implicit: nextButtonDisabled};\"></ng-container>\n </button>\n}\n\n\n@if (showIndicatorsLabel) {\n <div [ngClass]=\"indicatorsClass\" class=\"igx-carousel-label-indicator\" [class.igx-carousel-label-indicator--vertical]=\"isVertical\">\n <span [id]=\"labelId\" class=\"igx-carousel__label\">{{getCarouselLabel}}</span>\n </div>\n}\n\n<div class=\"igx-carousel__inner\" [attr.aria-live]=\"!interval || stoppedByInteraction ? 'polite' : 'off'\">\n <ng-content></ng-content>\n</div>\n", styles: ["@layer ig.base{@keyframes scale-in-center{0%{transform:scale(0);opacity:1}to{transform:scale(1);opacity:1}}@keyframes scale-out-center{0%{transform:scale(1);opacity:1}to{transform:scale(0);opacity:1}}.igx-carousel{--nav-btn-border-radius: var(--border-radius);display:flex;position:relative;justify-content:center;width:100%;height:100%;align-items:center;flex-flow:column nowrap}.igx-carousel__inner{position:relative;width:100%;height:inherit;overflow:hidden;outline-style:none;min-height:15rem;min-width:18.75rem}.igx-carousel__label{align-items:center}.igx-carousel__arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:3;outline:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;display:flex;justify-content:center;align-items:center;min-width:unset;width:2.875rem;height:2.875rem;cursor:pointer;outline-style:none;transition:all .15s ease-in-out;background:var(--button-background);box-shadow:var(--button-elevation);border:.0625rem solid var(--button-border-color);border-radius:var(--nav-btn-border-radius)}[dir=rtl] .igx-carousel__arrow{transform:scaleX(-1)}.igx-carousel__arrow igx-icon{--component-size: 1;color:var(--button-arrow-color)}.igx-carousel__arrow:hover{background:var(--button-hover-background);border-color:var(--button-hover-border-color)}.igx-carousel__arrow:hover igx-icon{color:var(--button-hover-arrow-color)}.igx-carousel__arrow[igxButton].igx-button--focused{background:var(--button-background);border:.125rem solid var(--button-focus-border-color)}.igx-carousel__arrow[igxButton].igx-button--focused igx-icon{color:var(--button-focus-border-color)}.igx-carousel__arrow[igxButton].igx-button--disabled{background:var(--button-disabled-background);color:var(--button-disabled-arrow-color);border-color:var(--button-disabled-border-color);pointer-events:none;box-shadow:none}.igx-carousel__arrow[igxButton].igx-button--disabled igx-icon{color:currentColor}.igx-carousel__arrow--prev{inset-inline-start:0;margin-inline-start:1rem}.igx-carousel__arrow--next{inset-inline-end:0;margin-inline-end:1rem}.igx-carousel--vertical .igx-carousel__arrow{inset-inline-start:unset;inset-block-start:unset;inset-inline-end:0;margin-inline-end:1rem;transform:none}.igx-carousel--vertical .igx-carousel__arrow igx-icon{transform:rotate(90deg)}.igx-carousel--vertical .igx-carousel__arrow--prev{inset-block-start:0;margin-block-start:1rem}.igx-carousel--vertical .igx-carousel__arrow--next{inset-block-end:0;margin-block-end:1rem}.igx-carousel-indicators{position:absolute;display:flex;justify-content:center;align-items:center;margin:1rem 0;padding:.25rem .375rem;gap:.5rem;list-style:none;z-index:10;inset-inline-start:50%;transform:translate(-50%);background:var(--indicator-background);box-shadow:var(--button-elevation);border-radius:var(--border-radius)}[dir=rtl] .igx-carousel-indicators{transform:translate(50%)}.igx-carousel-indicators__indicator{display:flex;align-items:center;justify-content:center;cursor:pointer}.igx-carousel-indicators__indicator:focus-visible{outline-style:none}.igx-carousel-indicators--start{top:0}.igx-carousel-indicators--end{bottom:0}.igx-carousel-indicators--focused:after{position:absolute;content:\"\";pointer-events:none;width:100%;height:100%;border-radius:inherit;border:.125rem solid var(--indicator-focus-color)}.igx-carousel-indicators--focused .igx-nav-dot--active{border-color:var(--indicator-focus-color)}.igx-carousel-indicators--focused .igx-nav-dot--active:after{background:var(--indicator-focus-color)}.igx-carousel-indicators--vertical{inset-inline-end:0;inset-inline-start:unset;flex-direction:column;inset-block-start:50%;transform:translateY(-50%);margin-block:0;margin-inline-end:1.8125rem;padding:.375rem .25rem;bottom:unset}[dir=rtl] .igx-carousel-indicators--vertical{transform:translateY(-50%)}.igx-carousel-indicators--vertical.igx-carousel-indicators--start{inset-inline-end:unset;inset-inline-start:0;margin-inline-start:1rem;margin-inline-end:unset}.igx-carousel-label-indicator{font-family:var(--ig-caption-font-family, var(--ig-font-family));font-size:var(--ig-caption-font-size);font-weight:var(--ig-caption-font-weight);font-style:var(--ig-caption-font-style);line-height:var(--ig-caption-line-height);letter-spacing:var(--ig-caption-letter-spacing);text-transform:var(--ig-caption-text-transform);margin-top:var(--ig-caption-margin-top);margin-bottom:var(--ig-caption-margin-bottom);margin:1rem 0;min-width:2.875rem;box-shadow:none;border-radius:.25rem;color:var(--indicator-color);background:var(--label-indicator-background)}.igx-carousel-label-indicator--vertical{margin-block:0;margin-inline-end:1rem;padding:.25rem .375rem}.igx-slide{position:absolute;width:100%;height:100%;inset:0;z-index:-1;background:var(--slide-background);visibility:hidden}.igx-slide img{width:inherit;height:inherit;-o-object-fit:cover;object-fit:cover;touch-action:none;pointer-events:none}.igx-slide--current{z-index:2;visibility:visible}.igx-slide--previous{z-index:1;visibility:visible}.igx-nav-dot{position:relative;width:.75rem;height:.75rem;text-indent:-624.9375rem;border:.125rem solid var(--indicator-border-color);border-radius:clamp(0rem,calc(var(--ig-radius-factor, 1) * 50%),50%);transition:all .15s cubic-bezier(.25,.46,.45,.94)}.igx-nav-dot:after{animation:scale-out-center .15s cubic-bezier(.25,.46,.45,.94) forwards;content:\"\";position:absolute;border-radius:inherit;background:var(--indicator-dot-color);inset:.0625rem}.igx-nav-dot:hover{border-color:var(--indicator-active-border-color)}.igx-nav-dot--active{border:.125rem solid var(--indicator-active-border-color)}.igx-nav-dot--active:after{animation:scale-in-center .15s cubic-bezier(.25,.46,.45,.94) forwards;background:var(--indicator-active-dot-color)}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-carousel__arrow[igxButton].igx-button--focused{box-shadow:0 0 0 .25rem var(--button-focus-border-color);border-color:var(--button-border-color)}.igx-carousel__arrow[igxButton].igx-button--focused igx-icon{color:var(--button-arrow-color)}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-carousel-indicators--focused:after{border:none;box-shadow:0 0 0 .25rem var(--button-focus-border-color)}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-carousel__arrow[igxButton].igx-button--focused{border:none}.igx-carousel__arrow[igxButton].igx-button--focused igx-icon{color:var(--indicator-focus-color)}.igx-carousel__arrow[igxButton].igx-button--focused:after{position:absolute;content:\"\";pointer-events:none;inset-block-start:.1875rem;inset-inline-start:.1875rem;width:calc(100% - .375rem);height:calc(100% - .375rem);box-shadow:0 0 0 .0625rem var(--button-focus-border-color)}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-carousel-indicators--focused:after{border:none;inset-block-start:.1875rem;inset-inline-start:.1875rem;width:calc(100% - .375rem);height:calc(100% - .375rem);box-shadow:0 0 0 .0625rem var(--button-focus-border-color);border-radius:0}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-carousel-label-indicator{border-radius:.125rem}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-carousel__arrow{width:1.75rem;height:1.75rem;border-width:.125rem;padding:initial}.igx-carousel__arrow igx-icon{--component-size: 2}.igx-carousel__arrow[igxButton].igx-button--focused{box-shadow:0 0 0 .1875rem var(--indicator-focus-color)}.igx-carousel__arrow[igxButton].igx-button--focused igx-icon{color:var(--button-arrow-color)}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-carousel-indicators{gap:.25rem;padding:.375rem}.igx-carousel-indicators--focused{border:none;box-shadow:0 0 0 .1875rem var(--indicator-focus-color)}.igx-carousel-indicators--focused .igx-nav-dot--active{border-color:var(--indicator-active-dot-color);box-shadow:0 0 0 .1875rem var(--indicator-focus-color)}.igx-carousel-indicators--focused .igx-nav-dot--active:after{background:var(--indicator-active-dot-color)}.igx-carousel-indicators--focused .igx-nav-dot--active:hover:after{background:var(--indicator-active-hover-dot-color)}.igx-carousel-indicators--vertical{margin-inline-end:1rem;padding:.375rem}.igx-carousel-indicators--vertical.igx-carousel-indicators--start{margin-inline-start:1rem}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-carousel-label-indicator{border-radius:.125rem;padding:.25rem .375rem;min-width:1.75rem}.igx-carousel-label-indicator--vertical{padding:.25rem .375rem;margin-inline-end:1rem}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-nav-dot{width:1rem;height:1rem;border:unset}.igx-nav-dot:after{width:.5rem;height:.5rem;top:50%;left:50%;transform:translate(-50%,-50%);right:unset;bottom:unset;animation:none}.igx-nav-dot:hover:after{background:var(--indicator-hover-dot-color)}.igx-nav-dot:hover:before{position:absolute;content:\"\";width:inherit;height:inherit;border:.125rem solid var(--indicator-hover-dot-color);inset-inline-start:0;top:0;border-radius:clamp(0rem,calc(var(--ig-radius-factor, 1) * 50%),50%)}.igx-nav-dot--active:before{position:absolute;content:\"\";width:inherit;height:inherit;border:.125rem solid var(--indicator-active-dot-color);inset-inline-start:0;top:0;border-radius:clamp(0rem,calc(var(--ig-radius-factor, 1) * 50%),50%)}.igx-nav-dot--active:hover:after{background:var(--indicator-active-hover-dot-color)}.igx-nav-dot--active:hover:before{border-color:var(--indicator-active-hover-dot-color)}}}\n"], dependencies: [{ kind: "directive", type: IgxButtonDirective, selector: "[igxButton]", inputs: ["selected", "igxButton", "igxLabel"], outputs: ["buttonSelected"] }, { kind: "component", type: IgxIconComponent, selector: "igx-icon", inputs: ["ariaHidden", "family", "name", "active"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None }); }
|
|
1299
1299
|
}
|
|
1300
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
1300
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCarouselComponent, decorators: [{
|
|
1301
1301
|
type: Component,
|
|
1302
1302
|
args: [{ selector: 'igx-carousel', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxButtonDirective, IgxIconComponent, NgClass, NgTemplateOutlet], template: "<ng-template #defaultIndicator let-slide>\n <div class=\"igx-nav-dot\"\n [class.igx-nav-dot--active]=\"slide.active\">\n </div>\n</ng-template>\n\n<ng-template #defaultNextButton>\n <igx-icon aria-hidden=\"true\" family=\"default\" name=\"carousel_next\"\n class=\"igx-nav-arrow\">\n </igx-icon>\n</ng-template>\n\n<ng-template #defaultPrevButton>\n <igx-icon aria-hidden=\"true\" family=\"default\" name=\"carousel_prev\"\n class=\"igx-nav-arrow\">\n </igx-icon>\n</ng-template>\n\n@if (showIndicators) {\n <div [ngClass]=\"indicatorsClass\" [attr.role]=\"'tablist'\" (keyup)=\"handleKeyUp($event)\" (focusout)=\"handleFocusOut($event)\" (click)=\"handleClick()\" (keydown)=\"handleKeydown($event)\">\n @for (slide of slides; track slide) {\n <div #indicators\n class=\"igx-carousel-indicators__indicator\"\n (click)=\"select(slide)\"\n [id]=\"'tab-'+ slide.index + '-' + total\"\n [attr.role]=\"'tab'\"\n [attr.tabindex]=\"slide.active ? 0 : -1\"\n [attr.aria-label]=\"resourceStrings.igx_carousel_slide + ' ' + (slide.index + 1) + ' ' + resourceStrings.igx_carousel_of + ' ' + this.total\"\n [attr.aria-controls]=\"'panel-' + slide.index\"\n [attr.aria-selected]=\"slide.active\">\n <ng-container *ngTemplateOutlet=\"getIndicatorTemplate; context: {$implicit: slide};\"></ng-container>\n </div>\n }\n </div>\n}\n\n@if (navigation && slides.length) {\n <button\n igxButton\n class=\"igx-carousel__arrow igx-carousel__arrow--prev\"\n [attr.aria-label]=\"resourceStrings.igx_carousel_previous_slide\"\n [disabled]=\"prevButtonDisabled\"\n (click)=\"prev()\"\n (keydown)=\"handleKeydownPrev($event)\">\n <ng-container *ngTemplateOutlet=\"getPrevButtonTemplate; context: {$implicit: prevButtonDisabled};\"></ng-container>\n </button>\n}\n\n@if (navigation && slides.length) {\n <button\n igxButton\n class=\"igx-carousel__arrow igx-carousel__arrow--next\"\n [attr.aria-label]=\"resourceStrings.igx_carousel_next_slide\"\n [disabled]=\"nextButtonDisabled\"\n (click)=\"next()\"\n (keydown)=\"handleKeydownNext($event)\">\n <ng-container *ngTemplateOutlet=\"getNextButtonTemplate; context: {$implicit: nextButtonDisabled};\"></ng-container>\n </button>\n}\n\n\n@if (showIndicatorsLabel) {\n <div [ngClass]=\"indicatorsClass\" class=\"igx-carousel-label-indicator\" [class.igx-carousel-label-indicator--vertical]=\"isVertical\">\n <span [id]=\"labelId\" class=\"igx-carousel__label\">{{getCarouselLabel}}</span>\n </div>\n}\n\n<div class=\"igx-carousel__inner\" [attr.aria-live]=\"!interval || stoppedByInteraction ? 'polite' : 'off'\">\n <ng-content></ng-content>\n</div>\n", styles: ["@layer ig.base{@keyframes scale-in-center{0%{transform:scale(0);opacity:1}to{transform:scale(1);opacity:1}}@keyframes scale-out-center{0%{transform:scale(1);opacity:1}to{transform:scale(0);opacity:1}}.igx-carousel{--nav-btn-border-radius: var(--border-radius);display:flex;position:relative;justify-content:center;width:100%;height:100%;align-items:center;flex-flow:column nowrap}.igx-carousel__inner{position:relative;width:100%;height:inherit;overflow:hidden;outline-style:none;min-height:15rem;min-width:18.75rem}.igx-carousel__label{align-items:center}.igx-carousel__arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:3;outline:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;display:flex;justify-content:center;align-items:center;min-width:unset;width:2.875rem;height:2.875rem;cursor:pointer;outline-style:none;transition:all .15s ease-in-out;background:var(--button-background);box-shadow:var(--button-elevation);border:.0625rem solid var(--button-border-color);border-radius:var(--nav-btn-border-radius)}[dir=rtl] .igx-carousel__arrow{transform:scaleX(-1)}.igx-carousel__arrow igx-icon{--component-size: 1;color:var(--button-arrow-color)}.igx-carousel__arrow:hover{background:var(--button-hover-background);border-color:var(--button-hover-border-color)}.igx-carousel__arrow:hover igx-icon{color:var(--button-hover-arrow-color)}.igx-carousel__arrow[igxButton].igx-button--focused{background:var(--button-background);border:.125rem solid var(--button-focus-border-color)}.igx-carousel__arrow[igxButton].igx-button--focused igx-icon{color:var(--button-focus-border-color)}.igx-carousel__arrow[igxButton].igx-button--disabled{background:var(--button-disabled-background);color:var(--button-disabled-arrow-color);border-color:var(--button-disabled-border-color);pointer-events:none;box-shadow:none}.igx-carousel__arrow[igxButton].igx-button--disabled igx-icon{color:currentColor}.igx-carousel__arrow--prev{inset-inline-start:0;margin-inline-start:1rem}.igx-carousel__arrow--next{inset-inline-end:0;margin-inline-end:1rem}.igx-carousel--vertical .igx-carousel__arrow{inset-inline-start:unset;inset-block-start:unset;inset-inline-end:0;margin-inline-end:1rem;transform:none}.igx-carousel--vertical .igx-carousel__arrow igx-icon{transform:rotate(90deg)}.igx-carousel--vertical .igx-carousel__arrow--prev{inset-block-start:0;margin-block-start:1rem}.igx-carousel--vertical .igx-carousel__arrow--next{inset-block-end:0;margin-block-end:1rem}.igx-carousel-indicators{position:absolute;display:flex;justify-content:center;align-items:center;margin:1rem 0;padding:.25rem .375rem;gap:.5rem;list-style:none;z-index:10;inset-inline-start:50%;transform:translate(-50%);background:var(--indicator-background);box-shadow:var(--button-elevation);border-radius:var(--border-radius)}[dir=rtl] .igx-carousel-indicators{transform:translate(50%)}.igx-carousel-indicators__indicator{display:flex;align-items:center;justify-content:center;cursor:pointer}.igx-carousel-indicators__indicator:focus-visible{outline-style:none}.igx-carousel-indicators--start{top:0}.igx-carousel-indicators--end{bottom:0}.igx-carousel-indicators--focused:after{position:absolute;content:\"\";pointer-events:none;width:100%;height:100%;border-radius:inherit;border:.125rem solid var(--indicator-focus-color)}.igx-carousel-indicators--focused .igx-nav-dot--active{border-color:var(--indicator-focus-color)}.igx-carousel-indicators--focused .igx-nav-dot--active:after{background:var(--indicator-focus-color)}.igx-carousel-indicators--vertical{inset-inline-end:0;inset-inline-start:unset;flex-direction:column;inset-block-start:50%;transform:translateY(-50%);margin-block:0;margin-inline-end:1.8125rem;padding:.375rem .25rem;bottom:unset}[dir=rtl] .igx-carousel-indicators--vertical{transform:translateY(-50%)}.igx-carousel-indicators--vertical.igx-carousel-indicators--start{inset-inline-end:unset;inset-inline-start:0;margin-inline-start:1rem;margin-inline-end:unset}.igx-carousel-label-indicator{font-family:var(--ig-caption-font-family, var(--ig-font-family));font-size:var(--ig-caption-font-size);font-weight:var(--ig-caption-font-weight);font-style:var(--ig-caption-font-style);line-height:var(--ig-caption-line-height);letter-spacing:var(--ig-caption-letter-spacing);text-transform:var(--ig-caption-text-transform);margin-top:var(--ig-caption-margin-top);margin-bottom:var(--ig-caption-margin-bottom);margin:1rem 0;min-width:2.875rem;box-shadow:none;border-radius:.25rem;color:var(--indicator-color);background:var(--label-indicator-background)}.igx-carousel-label-indicator--vertical{margin-block:0;margin-inline-end:1rem;padding:.25rem .375rem}.igx-slide{position:absolute;width:100%;height:100%;inset:0;z-index:-1;background:var(--slide-background);visibility:hidden}.igx-slide img{width:inherit;height:inherit;-o-object-fit:cover;object-fit:cover;touch-action:none;pointer-events:none}.igx-slide--current{z-index:2;visibility:visible}.igx-slide--previous{z-index:1;visibility:visible}.igx-nav-dot{position:relative;width:.75rem;height:.75rem;text-indent:-624.9375rem;border:.125rem solid var(--indicator-border-color);border-radius:clamp(0rem,calc(var(--ig-radius-factor, 1) * 50%),50%);transition:all .15s cubic-bezier(.25,.46,.45,.94)}.igx-nav-dot:after{animation:scale-out-center .15s cubic-bezier(.25,.46,.45,.94) forwards;content:\"\";position:absolute;border-radius:inherit;background:var(--indicator-dot-color);inset:.0625rem}.igx-nav-dot:hover{border-color:var(--indicator-active-border-color)}.igx-nav-dot--active{border:.125rem solid var(--indicator-active-border-color)}.igx-nav-dot--active:after{animation:scale-in-center .15s cubic-bezier(.25,.46,.45,.94) forwards;background:var(--indicator-active-dot-color)}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-carousel__arrow[igxButton].igx-button--focused{box-shadow:0 0 0 .25rem var(--button-focus-border-color);border-color:var(--button-border-color)}.igx-carousel__arrow[igxButton].igx-button--focused igx-icon{color:var(--button-arrow-color)}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-carousel-indicators--focused:after{border:none;box-shadow:0 0 0 .25rem var(--button-focus-border-color)}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-carousel__arrow[igxButton].igx-button--focused{border:none}.igx-carousel__arrow[igxButton].igx-button--focused igx-icon{color:var(--indicator-focus-color)}.igx-carousel__arrow[igxButton].igx-button--focused:after{position:absolute;content:\"\";pointer-events:none;inset-block-start:.1875rem;inset-inline-start:.1875rem;width:calc(100% - .375rem);height:calc(100% - .375rem);box-shadow:0 0 0 .0625rem var(--button-focus-border-color)}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-carousel-indicators--focused:after{border:none;inset-block-start:.1875rem;inset-inline-start:.1875rem;width:calc(100% - .375rem);height:calc(100% - .375rem);box-shadow:0 0 0 .0625rem var(--button-focus-border-color);border-radius:0}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-carousel-label-indicator{border-radius:.125rem}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-carousel__arrow{width:1.75rem;height:1.75rem;border-width:.125rem;padding:initial}.igx-carousel__arrow igx-icon{--component-size: 2}.igx-carousel__arrow[igxButton].igx-button--focused{box-shadow:0 0 0 .1875rem var(--indicator-focus-color)}.igx-carousel__arrow[igxButton].igx-button--focused igx-icon{color:var(--button-arrow-color)}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-carousel-indicators{gap:.25rem;padding:.375rem}.igx-carousel-indicators--focused{border:none;box-shadow:0 0 0 .1875rem var(--indicator-focus-color)}.igx-carousel-indicators--focused .igx-nav-dot--active{border-color:var(--indicator-active-dot-color);box-shadow:0 0 0 .1875rem var(--indicator-focus-color)}.igx-carousel-indicators--focused .igx-nav-dot--active:after{background:var(--indicator-active-dot-color)}.igx-carousel-indicators--focused .igx-nav-dot--active:hover:after{background:var(--indicator-active-hover-dot-color)}.igx-carousel-indicators--vertical{margin-inline-end:1rem;padding:.375rem}.igx-carousel-indicators--vertical.igx-carousel-indicators--start{margin-inline-start:1rem}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-carousel-label-indicator{border-radius:.125rem;padding:.25rem .375rem;min-width:1.75rem}.igx-carousel-label-indicator--vertical{padding:.25rem .375rem;margin-inline-end:1rem}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-nav-dot{width:1rem;height:1rem;border:unset}.igx-nav-dot:after{width:.5rem;height:.5rem;top:50%;left:50%;transform:translate(-50%,-50%);right:unset;bottom:unset;animation:none}.igx-nav-dot:hover:after{background:var(--indicator-hover-dot-color)}.igx-nav-dot:hover:before{position:absolute;content:\"\";width:inherit;height:inherit;border:.125rem solid var(--indicator-hover-dot-color);inset-inline-start:0;top:0;border-radius:clamp(0rem,calc(var(--ig-radius-factor, 1) * 50%),50%)}.igx-nav-dot--active:before{position:absolute;content:\"\";width:inherit;height:inherit;border:.125rem solid var(--indicator-active-dot-color);inset-inline-start:0;top:0;border-radius:clamp(0rem,calc(var(--ig-radius-factor, 1) * 50%),50%)}.igx-nav-dot--active:hover:after{background:var(--indicator-active-hover-dot-color)}.igx-nav-dot--active:hover:before{border-color:var(--indicator-active-hover-dot-color)}}}\n"] }]
|
|
1303
1303
|
}], ctorParameters: () => [], propDecorators: { id: [{
|
|
@@ -1407,11 +1407,11 @@ const IGX_CAROUSEL_DIRECTIVES = [
|
|
|
1407
1407
|
* IMPORTANT: The following is NgModule exported for backwards-compatibility before standalone components
|
|
1408
1408
|
*/
|
|
1409
1409
|
class IgxCarouselModule {
|
|
1410
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
1411
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.
|
|
1412
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.
|
|
1410
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCarouselModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
1411
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.7", ngImport: i0, type: IgxCarouselModule, imports: [IgxCarouselComponent, IgxSlideComponent, IgxCarouselIndicatorDirective, IgxCarouselNextButtonDirective, IgxCarouselPrevButtonDirective], exports: [IgxCarouselComponent, IgxSlideComponent, IgxCarouselIndicatorDirective, IgxCarouselNextButtonDirective, IgxCarouselPrevButtonDirective] }); }
|
|
1412
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCarouselModule, imports: [IgxCarouselComponent] }); }
|
|
1413
1413
|
}
|
|
1414
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
1414
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCarouselModule, decorators: [{
|
|
1415
1415
|
type: NgModule,
|
|
1416
1416
|
args: [{
|
|
1417
1417
|
imports: [
|
|
@@ -17,10 +17,10 @@ class IgxChatMarkdownService {
|
|
|
17
17
|
const renderer = await this._getRenderer();
|
|
18
18
|
return await renderer.parse(text);
|
|
19
19
|
}
|
|
20
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
21
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.1.
|
|
20
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxChatMarkdownService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
21
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxChatMarkdownService, providedIn: 'root' }); }
|
|
22
22
|
}
|
|
23
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
23
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxChatMarkdownService, decorators: [{
|
|
24
24
|
type: Injectable,
|
|
25
25
|
args: [{ providedIn: 'root' }]
|
|
26
26
|
}] });
|
|
@@ -33,10 +33,10 @@ class MarkdownPipe {
|
|
|
33
33
|
async transform(text) {
|
|
34
34
|
return this._sanitizer.bypassSecurityTrustHtml(await this._service.parse(text ?? ''));
|
|
35
35
|
}
|
|
36
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
37
|
-
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "22.1.
|
|
36
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: MarkdownPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
37
|
+
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "22.1.7", ngImport: i0, type: MarkdownPipe, isStandalone: true, name: "fromMarkdown" }); }
|
|
38
38
|
}
|
|
39
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
39
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: MarkdownPipe, decorators: [{
|
|
40
40
|
type: Pipe,
|
|
41
41
|
args: [{ name: 'fromMarkdown' }]
|
|
42
42
|
}] });
|
|
@@ -145,10 +145,10 @@ class IgxChatComponent {
|
|
|
145
145
|
return viewRef.rootNodes;
|
|
146
146
|
};
|
|
147
147
|
}
|
|
148
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
149
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.
|
|
148
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxChatComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
149
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.1.7", type: IgxChatComponent, isStandalone: true, selector: "igx-chat", inputs: { messages: { classPropertyName: "messages", publicName: "messages", isSignal: true, isRequired: false, transformFunction: null }, draftMessage: { classPropertyName: "draftMessage", publicName: "draftMessage", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, templates: { classPropertyName: "templates", publicName: "templates", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { messageCreated: "messageCreated", messageReact: "messageReact", attachmentClick: "attachmentClick", attachmentDrag: "attachmentDrag", attachmentDrop: "attachmentDrop", typingChange: "typingChange", inputFocus: "inputFocus", inputBlur: "inputBlur", inputChange: "inputChange" }, ngImport: i0, template: "<igc-chat\n [messages]=\"messages()\"\n [draftMessage]=\"draftMessage()\"\n [options]=\"_mergedOptions()\"\n (igcMessageCreated)=\"messageCreated.emit($event.detail)\"\n (igcMessageReact)=\"messageReact.emit($event.detail)\"\n (igcAttachmentClick)=\"attachmentClick.emit($event.detail)\"\n (igcAttachmentDrag)=\"attachmentDrag.emit()\"\n (igcAttachmentDrop)=\"attachmentDrop.emit()\"\n (igcTypingChange)=\"typingChange.emit($event.detail)\"\n (igcInputFocus)=\"inputFocus.emit()\"\n (igcInputBlur)=\"inputBlur.emit()\"\n (igcInputChange)=\"inputChange.emit($event.detail)\"\n>\n <ng-content></ng-content>\n</igc-chat>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
150
150
|
}
|
|
151
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
151
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxChatComponent, decorators: [{
|
|
152
152
|
type: Component,
|
|
153
153
|
args: [{ selector: 'igx-chat', standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, schemas: [CUSTOM_ELEMENTS_SCHEMA], template: "<igc-chat\n [messages]=\"messages()\"\n [draftMessage]=\"draftMessage()\"\n [options]=\"_mergedOptions()\"\n (igcMessageCreated)=\"messageCreated.emit($event.detail)\"\n (igcMessageReact)=\"messageReact.emit($event.detail)\"\n (igcAttachmentClick)=\"attachmentClick.emit($event.detail)\"\n (igcAttachmentDrag)=\"attachmentDrag.emit()\"\n (igcAttachmentDrop)=\"attachmentDrop.emit()\"\n (igcTypingChange)=\"typingChange.emit($event.detail)\"\n (igcInputFocus)=\"inputFocus.emit()\"\n (igcInputBlur)=\"inputBlur.emit()\"\n (igcInputChange)=\"inputChange.emit($event.detail)\"\n>\n <ng-content></ng-content>\n</igc-chat>\n" }]
|
|
154
154
|
}], ctorParameters: () => [], propDecorators: { messages: [{ type: i0.Input, args: [{ isSignal: true, alias: "messages", required: false }] }], draftMessage: [{ type: i0.Input, args: [{ isSignal: true, alias: "draftMessage", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], templates: [{ type: i0.Input, args: [{ isSignal: true, alias: "templates", required: false }] }], messageCreated: [{ type: i0.Output, args: ["messageCreated"] }], messageReact: [{ type: i0.Output, args: ["messageReact"] }], attachmentClick: [{ type: i0.Output, args: ["attachmentClick"] }], attachmentDrag: [{ type: i0.Output, args: ["attachmentDrag"] }], attachmentDrop: [{ type: i0.Output, args: ["attachmentDrop"] }], typingChange: [{ type: i0.Output, args: ["typingChange"] }], inputFocus: [{ type: i0.Output, args: ["inputFocus"] }], inputBlur: [{ type: i0.Output, args: ["inputBlur"] }], inputChange: [{ type: i0.Output, args: ["inputChange"] }] } });
|
|
@@ -168,10 +168,10 @@ class IgxChatMessageContextDirective {
|
|
|
168
168
|
static ngTemplateContextGuard(_, ctx) {
|
|
169
169
|
return true;
|
|
170
170
|
}
|
|
171
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
172
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.
|
|
171
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxChatMessageContextDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
172
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: IgxChatMessageContextDirective, isStandalone: true, selector: "[igxChatMessageContext]", ngImport: i0 }); }
|
|
173
173
|
}
|
|
174
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
174
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxChatMessageContextDirective, decorators: [{
|
|
175
175
|
type: Directive,
|
|
176
176
|
args: [{ selector: '[igxChatMessageContext]', standalone: true }]
|
|
177
177
|
}] });
|
|
@@ -191,10 +191,10 @@ class IgxChatAttachmentContextDirective {
|
|
|
191
191
|
static ngTemplateContextGuard(_, ctx) {
|
|
192
192
|
return true;
|
|
193
193
|
}
|
|
194
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
195
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.
|
|
194
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxChatAttachmentContextDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
195
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: IgxChatAttachmentContextDirective, isStandalone: true, selector: "[igxChatAttachmentContext]", ngImport: i0 }); }
|
|
196
196
|
}
|
|
197
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
197
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxChatAttachmentContextDirective, decorators: [{
|
|
198
198
|
type: Directive,
|
|
199
199
|
args: [{ selector: '[igxChatAttachmentContext]', standalone: true }]
|
|
200
200
|
}] });
|
|
@@ -214,10 +214,10 @@ class IgxChatInputContextDirective {
|
|
|
214
214
|
static ngTemplateContextGuard(_, ctx) {
|
|
215
215
|
return true;
|
|
216
216
|
}
|
|
217
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.
|
|
218
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.
|
|
217
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxChatInputContextDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
218
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: IgxChatInputContextDirective, isStandalone: true, selector: "[igxChatInputContext]", ngImport: i0 }); }
|
|
219
219
|
}
|
|
220
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.
|
|
220
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxChatInputContextDirective, decorators: [{
|
|
221
221
|
type: Directive,
|
|
222
222
|
args: [{ selector: '[igxChatInputContext]', standalone: true }]
|
|
223
223
|
}] });
|