igniteui-angular 22.2.0-rc.1 → 22.2.0-rc.2

package/fesm2022/igniteui-angular-drop-down.mjs

@@ -59,13 +59,13 @@ class IgxDropDownGroupComponent {
     get labelledBy() {
         return this.labelId;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxDropDownGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "22.1.7", type: IgxDropDownGroupComponent, isStandalone: true, selector: "igx-drop-down-item-group", inputs: { disabled: ["disabled", "disabled", booleanAttribute], label: "label" }, host: { properties: { "attr.aria-labelledby": "this.labelledBy", "attr.role": "this.role", "class.igx-drop-down__group": "this.groupClass", "attr.aria-disabled": "this.disabled", "class.igx-drop-down__group--disabled": "this.disabled" } }, ngImport: i0, template: `
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxDropDownGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "22.2.0", type: IgxDropDownGroupComponent, isStandalone: true, selector: "igx-drop-down-item-group", inputs: { disabled: ["disabled", "disabled", booleanAttribute], label: "label" }, host: { properties: { "attr.aria-labelledby": "this.labelledBy", "attr.role": "this.role", "class.igx-drop-down__group": "this.groupClass", "attr.aria-disabled": "this.disabled", "class.igx-drop-down__group--disabled": "this.disabled" } }, ngImport: i0, template: `
         <label id="{{labelId}}">{{ label }}</label>
         <ng-content select="igx-drop-down-item"></ng-content>
     `, isInline: true, changeDetection: i0.ChangeDetectionStrategy.Eager }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxDropDownGroupComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxDropDownGroupComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'igx-drop-down-item-group',
@@ -332,10 +332,10 @@ class IgxDropDownItemBaseDirective {
             focusedItem.element.nativeElement.focus({ preventScroll: true });
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxDropDownItemBaseDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "22.1.7", type: IgxDropDownItemBaseDirective, isStandalone: true, selector: "[igxDropDownItemBase]", inputs: { id: "id", ariaLabel: "ariaLabel", index: "index", value: "value", selected: ["selected", "selected", booleanAttribute], isHeader: ["isHeader", "isHeader", booleanAttribute], disabled: ["disabled", "disabled", booleanAttribute], role: "role" }, outputs: { selectedChange: "selectedChange" }, host: { listeners: { "click": "clicked($event)", "mousedown": "handleMousedown($event)" }, properties: { "attr.id": "this.id", "attr.aria-label": "this.ariaLabel", "class.igx-drop-down__item": "this.itemStyle", "attr.aria-selected": "this.selected", "class.igx-drop-down__item--selected": "this.selected", "class.igx-drop-down__item--focused": "this.focused", "class.igx-drop-down__header": "this.isHeader", "attr.aria-disabled": "this.disabled", "class.igx-drop-down__item--disabled": "this.disabled", "attr.role": "this.role" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxDropDownItemBaseDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "22.2.0", type: IgxDropDownItemBaseDirective, isStandalone: true, selector: "[igxDropDownItemBase]", inputs: { id: "id", ariaLabel: "ariaLabel", index: "index", value: "value", selected: ["selected", "selected", booleanAttribute], isHeader: ["isHeader", "isHeader", booleanAttribute], disabled: ["disabled", "disabled", booleanAttribute], role: "role" }, outputs: { selectedChange: "selectedChange" }, host: { listeners: { "click": "clicked($event)", "mousedown": "handleMousedown($event)" }, properties: { "attr.id": "this.id", "attr.aria-label": "this.ariaLabel", "class.igx-drop-down__item": "this.itemStyle", "attr.aria-selected": "this.selected", "class.igx-drop-down__item--selected": "this.selected", "class.igx-drop-down__item--focused": "this.focused", "class.igx-drop-down__header": "this.isHeader", "attr.aria-disabled": "this.disabled", "class.igx-drop-down__item--disabled": "this.disabled", "attr.role": "this.role" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxDropDownItemBaseDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxDropDownItemBaseDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[igxDropDownItemBase]',
@@ -483,10 +483,10 @@ class IgxDropDownItemComponent extends IgxDropDownItemBaseDirective {
             this.dropDown.selectItem(this, event);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxDropDownItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.7", type: IgxDropDownItemComponent, isStandalone: true, selector: "igx-drop-down-item", host: { properties: { "attr.tabindex": "this.setTabIndex" } }, usesInheritance: true, ngImport: i0, template: "<span class=\"igx-drop-down__content\">\n    <ng-content select=\"igx-prefix, [igxPrefix]\"></ng-content>\n    <span class=\"igx-drop-down__inner\">\n        <ng-content></ng-content>\n    </span>\n    <ng-content select=\"igx-suffix, [igxSuffix]\"></ng-content>\n    <ng-content select=\"igx-divider\"></ng-content>\n</span>\n", changeDetection: i0.ChangeDetectionStrategy.Eager }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxDropDownItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.2.0", type: IgxDropDownItemComponent, isStandalone: true, selector: "igx-drop-down-item", host: { properties: { "attr.tabindex": "this.setTabIndex" } }, usesInheritance: true, ngImport: i0, template: "<span class=\"igx-drop-down__content\">\n    <ng-content select=\"igx-prefix, [igxPrefix]\"></ng-content>\n    <span class=\"igx-drop-down__inner\">\n        <ng-content></ng-content>\n    </span>\n    <ng-content select=\"igx-suffix, [igxSuffix]\"></ng-content>\n    <ng-content select=\"igx-divider\"></ng-content>\n</span>\n", changeDetection: i0.ChangeDetectionStrategy.Eager }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxDropDownItemComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxDropDownItemComponent, decorators: [{
             type: Component,
             args: [{ selector: 'igx-drop-down-item', changeDetection: ChangeDetectionStrategy.Eager, standalone: true, template: "<span class=\"igx-drop-down__content\">\n    <ng-content select=\"igx-prefix, [igxPrefix]\"></ng-content>\n    <span class=\"igx-drop-down__inner\">\n        <ng-content></ng-content>\n    </span>\n    <ng-content select=\"igx-suffix, [igxSuffix]\"></ng-content>\n    <ng-content select=\"igx-divider\"></ng-content>\n</span>\n" }]
         }], propDecorators: { setTabIndex: [{
@@ -617,10 +617,10 @@ class IgxDropDownItemNavigationDirective {
     onHomeKeyDown() {
         this.target.navigateFirst();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxDropDownItemNavigationDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: IgxDropDownItemNavigationDirective, isStandalone: true, selector: "[igxDropDownItemNavigation]", inputs: { target: ["igxDropDownItemNavigation", "target"] }, host: { listeners: { "keydown": "handleKeyDown($event)" }, properties: { "attr.aria-activedescendant": "this.activeDescendant" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxDropDownItemNavigationDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.2.0", type: IgxDropDownItemNavigationDirective, isStandalone: true, selector: "[igxDropDownItemNavigation]", inputs: { target: ["igxDropDownItemNavigation", "target"] }, host: { listeners: { "keydown": "handleKeyDown($event)" }, properties: { "attr.aria-activedescendant": "this.activeDescendant" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxDropDownItemNavigationDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxDropDownItemNavigationDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[igxDropDownItemNavigation]',
@@ -867,10 +867,10 @@ class IgxDropDownBaseDirective {
             return -1;
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxDropDownBaseDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: IgxDropDownBaseDirective, isStandalone: true, inputs: { width: "width", height: "height", id: "id", maxHeight: "maxHeight" }, outputs: { selectionChanging: "selectionChanging" }, host: { properties: { "attr.id": "this.id", "style.maxHeight": "this.maxHeight" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxDropDownBaseDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.2.0", type: IgxDropDownBaseDirective, isStandalone: true, inputs: { width: "width", height: "height", id: "id", maxHeight: "maxHeight" }, outputs: { selectionChanging: "selectionChanging" }, host: { properties: { "attr.id": "this.id", "style.maxHeight": "this.maxHeight" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxDropDownBaseDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxDropDownBaseDirective, decorators: [{
             type: Directive
         }], propDecorators: { selectionChanging: [{
                 type: Output
@@ -1656,10 +1656,10 @@ class IgxDropDownComponent extends IgxDropDownBaseDirective {
             }
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxDropDownComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: IgxDropDownComponent, isStandalone: true, selector: "igx-drop-down", inputs: { allowItemsFocus: ["allowItemsFocus", "allowItemsFocus", booleanAttribute], labelledBy: "labelledBy", role: "role" }, outputs: { opening: "opening", opened: "opened", closing: "closing", closed: "closed" }, providers: [{ provide: IGX_DROPDOWN_BASE, useExisting: IgxDropDownComponent }], queries: [{ propertyName: "children", predicate: i0.forwardRef(() => IgxDropDownItemComponent), descendants: true }, { propertyName: "_forOfQuery", predicate: IgxForOfToken, descendants: true }, { propertyName: "_virtualScrollQuery", predicate: IgxVirtualScrollComponent, descendants: true }, { propertyName: "_virtualScrollRefQuery", predicate: IgxVirtualScrollComponent, descendants: true, read: ElementRef }], viewQueries: [{ propertyName: "toggleDirective", first: true, predicate: IgxToggleDirective, descendants: true, static: true }, { propertyName: "scrollContainerRef", first: true, predicate: ["scrollContainer"], descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"igx-drop-down\" [style.width]=\"width\"\n    igxToggle\n    (appended)=\"onToggleContentAppended($event)\"\n    (opening)=\"onToggleOpening($event)\" (opened)=\"onToggleOpened()\"\n    (closing)=\"onToggleClosing($event)\" (closed)=\"onToggleClosed()\">\n    <div class=\"igx-drop-down__list-scroll\" #scrollContainer [attr.id]=\"listId\" [attr.role]=\"role\" [attr.aria-labelledby]=\"labelledBy\"\n        [style.height]=\"height\"\n        [style.maxHeight]=\"maxHeight\">\n        @if (!collapsed) {\n            <ng-content></ng-content>\n        }\n    </div>\n</div>\n", styles: ["@layer ig.base{.igx-drop-down__group label,.igx-drop-down__header,.igx-drop-down__item{display:flex;justify-content:flex-start;align-items:center;width:100%;white-space:nowrap;position:relative;height:var(--size);color:var(--item-text-color)}.igx-drop-down__group label igx-divider,.igx-drop-down__header igx-divider,.igx-drop-down__item igx-divider{position:absolute;width:100%;inset-inline-start:0;bottom:0}.igx-drop-down__group label igx-icon,.igx-drop-down__header igx-icon,.igx-drop-down__item igx-icon{--component-size: 1;justify-content:center}.igx-drop-down__group label,.igx-drop-down__header{font-family:var(--ig-overline-font-family, var(--ig-font-family));font-size:var(--ig-overline-font-size);font-weight:var(--ig-overline-font-weight);font-style:var(--ig-overline-font-style);line-height:var(--ig-overline-line-height);letter-spacing:var(--ig-overline-letter-spacing);text-transform:var(--ig-overline-text-transform);margin-top:var(--ig-overline-margin-top);margin-bottom:var(--ig-overline-margin-bottom);color:var(--header-text-color);pointer-events:none;padding-inline:max(var(--is-large, 1)*max(1rem,-1 * 1rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-medium, 1)*max(.75rem,-1 * .75rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-small, 1)*max(.5rem,-1 * .5rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, var(--ig-spacing))))}.igx-drop-down{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);--component-size: var(--ig-size, var(--default-size));--dropdown-size: var(--component-size);width:-moz-max-content;width:max-content;overflow:hidden;border-radius:var(--border-radius);background:var(--background-color);box-shadow:var(--elevation);min-width:8rem;border:var(--border-width) solid var(--border-color)}.igx-drop-down__list-scroll{overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;position:relative}.igx-drop-down__list-scroll .igx-display-container--scrollbar{padding-inline-end:var(--vhelper-scrollbar-size)}.igx-drop-down__item{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);--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);--component-size: var(--dropdown-size);cursor:pointer;padding-inline:max(var(--is-large, 1)*max(1.5rem,-1 * 1.5rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-medium, 1)*max(1.25rem,-1 * 1.25rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-small, 1)*max(1rem,-1 * 1rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, var(--ig-spacing))));border-radius:var(--item-border-radius)}.igx-drop-down__item igx-icon{color:var(--item-icon-color)}.igx-drop-down__item:hover{background:var(--hover-item-background);color:var(--hover-item-text-color)}.igx-drop-down__item:hover igx-icon{color:var(--hover-item-icon-color)}.igx-drop-down__item:focus{outline:0;outline-color:#0000;background:var(--focused-item-background);color:var(--focused-item-text-color)}.igx-drop-down__inner{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;display:block;align-items:center;gap:.5rem;margin-inline-end:auto}.igx-drop-down__inner>div{display:flex;align-items:center;gap:.5rem}.igx-drop-down__content{display:flex;width:100%;align-items:center;gap:.5rem}.igx-drop-down__item--focused{background:var(--focused-item-background);color:var(--focused-item-text-color)}.igx-drop-down__item--selected{background:var(--selected-item-background);color:var(--selected-item-text-color)}.igx-drop-down__item--selected igx-icon{color:var(--selected-item-icon-color)}.igx-drop-down__item--selected:hover{background:var(--selected-hover-item-background);color:var(--selected-hover-item-text-color)}.igx-drop-down__item--selected:hover igx-icon{color:var(--selected-hover-item-icon-color)}.igx-drop-down__item--selected.igx-drop-down__item--focused{background:var(--selected-focus-item-background);color:var(--selected-focus-item-text-color)}.igx-drop-down__item--selected.igx-drop-down__item--focused:hover{background:var(--selected-hover-item-background);color:var(--selected-hover-item-text-color)}.igx-drop-down__item--selected.igx-drop-down__item--focused:hover igx-icon{color:var(--selected-hover-item-icon-color)}.igx-drop-down__item--disabled{background:var(--disabled-item-background);color:var(--disabled-item-text-color);cursor:default;pointer-events:none}.igx-drop-down__item--disabled igx-icon{color:var(--disabled-item-text-color)}.igx-drop-down__group{pointer-events:auto}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-drop-down .igx-drop-down__header,.igx-drop-down .igx-drop-down__item{--ig-icon-size: max(var(--is-large, 1) * max(1rem, -1 * 1rem), var(--is-medium, 1) * max(1rem, -1 * 1rem), var(--is-small, 1) * max(.875rem, -1 * .875rem));padding-inline:max(var(--is-large, 1)*max(.75rem,-1 * .75rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-medium, 1)*max(.75rem,-1 * .75rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-small, 1)*max(.5rem,-1 * .5rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, var(--ig-spacing))))}.igx-drop-down .igx-drop-down__header igx-icon,.igx-drop-down .igx-drop-down__item igx-icon{--component-size: inherit}.igx-drop-down{padding:.1875rem}.igx-drop-down__item{margin-block:.125rem}.igx-drop-down__item:first-of-type,.igx-drop-down__item:last-of-type{margin-block:initial}.igx-drop-down__item--focused{outline:.125rem solid var(--focused-item-border-color);outline-offset:-.125rem}.igx-drop-down__header{margin-block-end:.125rem;padding-block:max(var(--is-large, 1)*max(.5rem,-1 * .5rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-medium, 1)*max(.375rem,-1 * .375rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-small, 1)*max(.25rem,-1 * .25rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, var(--ig-spacing))))}.igx-drop-down__group label{padding-inline:max(var(--is-large, 1)*max(.75rem,-1 * .75rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-medium, 1)*max(.75rem,-1 * .75rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-small, 1)*max(.5rem,-1 * .5rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, var(--ig-spacing))));padding-block:max(var(--is-large, 1)*max(.5rem,-1 * .5rem)*var(--ig-spacing-block-large, var(--ig-spacing-block, var(--ig-spacing))),var(--is-medium, 1)*max(.375rem,-1 * .375rem)*var(--ig-spacing-block-medium, var(--ig-spacing-block, var(--ig-spacing))),var(--is-small, 1)*max(.25rem,-1 * .25rem)*var(--ig-spacing-block-small, var(--ig-spacing-block, var(--ig-spacing))));margin-block-end:.125rem}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-drop-down__item--focused{outline:.0625rem solid var(--border-color);outline-offset:-.0625rem}.igx-drop-down__header{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)}.igx-drop-down__group{pointer-events:auto}.igx-drop-down__group label{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)}}}\n"], dependencies: [{ kind: "directive", type: IgxToggleDirective, selector: "[igxToggle]", inputs: ["id"], outputs: ["opened", "opening", "closed", "closing", "appended"], exportAs: ["toggle"] }], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxDropDownComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.2.0", type: IgxDropDownComponent, isStandalone: true, selector: "igx-drop-down", inputs: { allowItemsFocus: ["allowItemsFocus", "allowItemsFocus", booleanAttribute], labelledBy: "labelledBy", role: "role" }, outputs: { opening: "opening", opened: "opened", closing: "closing", closed: "closed" }, providers: [{ provide: IGX_DROPDOWN_BASE, useExisting: IgxDropDownComponent }], queries: [{ propertyName: "children", predicate: i0.forwardRef(() => IgxDropDownItemComponent), descendants: true }, { propertyName: "_forOfQuery", predicate: IgxForOfToken, descendants: true }, { propertyName: "_virtualScrollQuery", predicate: IgxVirtualScrollComponent, descendants: true }, { propertyName: "_virtualScrollRefQuery", predicate: IgxVirtualScrollComponent, descendants: true, read: ElementRef }], viewQueries: [{ propertyName: "toggleDirective", first: true, predicate: IgxToggleDirective, descendants: true, static: true }, { propertyName: "scrollContainerRef", first: true, predicate: ["scrollContainer"], descendants: true, static: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div class=\"igx-drop-down\" [style.width]=\"width\"\n    igxToggle\n    (appended)=\"onToggleContentAppended($event)\"\n    (opening)=\"onToggleOpening($event)\" (opened)=\"onToggleOpened()\"\n    (closing)=\"onToggleClosing($event)\" (closed)=\"onToggleClosed()\">\n    <div class=\"igx-drop-down__list-scroll\" #scrollContainer [attr.id]=\"listId\" [attr.role]=\"role\" [attr.aria-labelledby]=\"labelledBy\"\n        [style.height]=\"height\"\n        [style.maxHeight]=\"maxHeight\">\n        @if (!collapsed) {\n            <ng-content></ng-content>\n        }\n    </div>\n</div>\n", styles: ["@layer ig.base{.igx-drop-down__group label,.igx-drop-down__header,.igx-drop-down__item{display:flex;justify-content:flex-start;align-items:center;width:100%;white-space:nowrap;position:relative;height:var(--size);color:var(--item-text-color)}.igx-drop-down__group label igx-divider,.igx-drop-down__header igx-divider,.igx-drop-down__item igx-divider{position:absolute;width:100%;inset-inline-start:0;bottom:0}.igx-drop-down__group label igx-icon,.igx-drop-down__header igx-icon,.igx-drop-down__item igx-icon{--component-size: 1;justify-content:center}.igx-drop-down__group label,.igx-drop-down__header{font-family:var(--ig-overline-font-family, var(--ig-font-family));font-size:var(--ig-overline-font-size);font-weight:var(--ig-overline-font-weight);font-style:var(--ig-overline-font-style);line-height:var(--ig-overline-line-height);letter-spacing:var(--ig-overline-letter-spacing);text-transform:var(--ig-overline-text-transform);margin-top:var(--ig-overline-margin-top);margin-bottom:var(--ig-overline-margin-bottom);color:var(--header-text-color);pointer-events:none;padding-inline:max(var(--is-large, 1)*max(1rem,-1 * 1rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-medium, 1)*max(.75rem,-1 * .75rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-small, 1)*max(.5rem,-1 * .5rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, var(--ig-spacing))))}.igx-drop-down{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);--component-size: var(--ig-size, var(--default-size));--dropdown-size: var(--component-size);width:-moz-max-content;width:max-content;overflow:hidden;border-radius:var(--border-radius);background:var(--background-color);box-shadow:var(--elevation);min-width:8rem;border:var(--border-width) solid var(--border-color)}.igx-drop-down__list-scroll{overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;position:relative}.igx-drop-down__list-scroll .igx-display-container--scrollbar{padding-inline-end:var(--vhelper-scrollbar-size)}.igx-drop-down__item{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);--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);--component-size: var(--dropdown-size);cursor:pointer;padding-inline:max(var(--is-large, 1)*max(1.5rem,-1 * 1.5rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-medium, 1)*max(1.25rem,-1 * 1.25rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-small, 1)*max(1rem,-1 * 1rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, var(--ig-spacing))));border-radius:var(--item-border-radius)}.igx-drop-down__item igx-icon{color:var(--item-icon-color)}.igx-drop-down__item:hover{background:var(--hover-item-background);color:var(--hover-item-text-color)}.igx-drop-down__item:hover igx-icon{color:var(--hover-item-icon-color)}.igx-drop-down__item:focus{outline:0;outline-color:#0000;background:var(--focused-item-background);color:var(--focused-item-text-color)}.igx-drop-down__inner{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;display:block;align-items:center;gap:.5rem;margin-inline-end:auto}.igx-drop-down__inner>div{display:flex;align-items:center;gap:.5rem}.igx-drop-down__content{display:flex;width:100%;align-items:center;gap:.5rem}.igx-drop-down__item--focused{background:var(--focused-item-background);color:var(--focused-item-text-color)}.igx-drop-down__item--selected{background:var(--selected-item-background);color:var(--selected-item-text-color)}.igx-drop-down__item--selected igx-icon{color:var(--selected-item-icon-color)}.igx-drop-down__item--selected:hover{background:var(--selected-hover-item-background);color:var(--selected-hover-item-text-color)}.igx-drop-down__item--selected:hover igx-icon{color:var(--selected-hover-item-icon-color)}.igx-drop-down__item--selected.igx-drop-down__item--focused{background:var(--selected-focus-item-background);color:var(--selected-focus-item-text-color)}.igx-drop-down__item--selected.igx-drop-down__item--focused:hover{background:var(--selected-hover-item-background);color:var(--selected-hover-item-text-color)}.igx-drop-down__item--selected.igx-drop-down__item--focused:hover igx-icon{color:var(--selected-hover-item-icon-color)}.igx-drop-down__item--disabled{background:var(--disabled-item-background);color:var(--disabled-item-text-color);cursor:default;pointer-events:none}.igx-drop-down__item--disabled igx-icon{color:var(--disabled-item-text-color)}.igx-drop-down__group{pointer-events:auto}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-drop-down .igx-drop-down__header,.igx-drop-down .igx-drop-down__item{--ig-icon-size: max(var(--is-large, 1) * max(1rem, -1 * 1rem), var(--is-medium, 1) * max(1rem, -1 * 1rem), var(--is-small, 1) * max(.875rem, -1 * .875rem));padding-inline:max(var(--is-large, 1)*max(.75rem,-1 * .75rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-medium, 1)*max(.75rem,-1 * .75rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-small, 1)*max(.5rem,-1 * .5rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, var(--ig-spacing))))}.igx-drop-down .igx-drop-down__header igx-icon,.igx-drop-down .igx-drop-down__item igx-icon{--component-size: inherit}.igx-drop-down{padding:.1875rem}.igx-drop-down__item{margin-block:.125rem}.igx-drop-down__item:first-of-type,.igx-drop-down__item:last-of-type{margin-block:initial}.igx-drop-down__item--focused{outline:.125rem solid var(--focused-item-border-color);outline-offset:-.125rem}.igx-drop-down__header{margin-block-end:.125rem;padding-block:max(var(--is-large, 1)*max(.5rem,-1 * .5rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-medium, 1)*max(.375rem,-1 * .375rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-small, 1)*max(.25rem,-1 * .25rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, var(--ig-spacing))))}.igx-drop-down__group label{padding-inline:max(var(--is-large, 1)*max(.75rem,-1 * .75rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-medium, 1)*max(.75rem,-1 * .75rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-small, 1)*max(.5rem,-1 * .5rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, var(--ig-spacing))));padding-block:max(var(--is-large, 1)*max(.5rem,-1 * .5rem)*var(--ig-spacing-block-large, var(--ig-spacing-block, var(--ig-spacing))),var(--is-medium, 1)*max(.375rem,-1 * .375rem)*var(--ig-spacing-block-medium, var(--ig-spacing-block, var(--ig-spacing))),var(--is-small, 1)*max(.25rem,-1 * .25rem)*var(--ig-spacing-block-small, var(--ig-spacing-block, var(--ig-spacing))));margin-block-end:.125rem}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-drop-down__item--focused{outline:.0625rem solid var(--border-color);outline-offset:-.0625rem}.igx-drop-down__header{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)}.igx-drop-down__group{pointer-events:auto}.igx-drop-down__group label{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)}}}\n"], dependencies: [{ kind: "directive", type: IgxToggleDirective, selector: "[igxToggle]", inputs: ["id"], outputs: ["opened", "opening", "closed", "closing", "appended"], exportAs: ["toggle"] }], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxDropDownComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxDropDownComponent, decorators: [{
             type: Component,
             args: [{ selector: 'igx-drop-down', encapsulation: ViewEncapsulation.None, providers: [{ provide: IGX_DROPDOWN_BASE, useExisting: IgxDropDownComponent }], changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxToggleDirective], template: "<div class=\"igx-drop-down\" [style.width]=\"width\"\n    igxToggle\n    (appended)=\"onToggleContentAppended($event)\"\n    (opening)=\"onToggleOpening($event)\" (opened)=\"onToggleOpened()\"\n    (closing)=\"onToggleClosing($event)\" (closed)=\"onToggleClosed()\">\n    <div class=\"igx-drop-down__list-scroll\" #scrollContainer [attr.id]=\"listId\" [attr.role]=\"role\" [attr.aria-labelledby]=\"labelledBy\"\n        [style.height]=\"height\"\n        [style.maxHeight]=\"maxHeight\">\n        @if (!collapsed) {\n            <ng-content></ng-content>\n        }\n    </div>\n</div>\n", styles: ["@layer ig.base{.igx-drop-down__group label,.igx-drop-down__header,.igx-drop-down__item{display:flex;justify-content:flex-start;align-items:center;width:100%;white-space:nowrap;position:relative;height:var(--size);color:var(--item-text-color)}.igx-drop-down__group label igx-divider,.igx-drop-down__header igx-divider,.igx-drop-down__item igx-divider{position:absolute;width:100%;inset-inline-start:0;bottom:0}.igx-drop-down__group label igx-icon,.igx-drop-down__header igx-icon,.igx-drop-down__item igx-icon{--component-size: 1;justify-content:center}.igx-drop-down__group label,.igx-drop-down__header{font-family:var(--ig-overline-font-family, var(--ig-font-family));font-size:var(--ig-overline-font-size);font-weight:var(--ig-overline-font-weight);font-style:var(--ig-overline-font-style);line-height:var(--ig-overline-line-height);letter-spacing:var(--ig-overline-letter-spacing);text-transform:var(--ig-overline-text-transform);margin-top:var(--ig-overline-margin-top);margin-bottom:var(--ig-overline-margin-bottom);color:var(--header-text-color);pointer-events:none;padding-inline:max(var(--is-large, 1)*max(1rem,-1 * 1rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-medium, 1)*max(.75rem,-1 * .75rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-small, 1)*max(.5rem,-1 * .5rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, var(--ig-spacing))))}.igx-drop-down{--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);--component-size: var(--ig-size, var(--default-size));--dropdown-size: var(--component-size);width:-moz-max-content;width:max-content;overflow:hidden;border-radius:var(--border-radius);background:var(--background-color);box-shadow:var(--elevation);min-width:8rem;border:var(--border-width) solid var(--border-color)}.igx-drop-down__list-scroll{overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;position:relative}.igx-drop-down__list-scroll .igx-display-container--scrollbar{padding-inline-end:var(--vhelper-scrollbar-size)}.igx-drop-down__item{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);--is-large: clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-large, 3), 1);--is-medium: min( clamp(0, (var(--component-size, 1) + 1) - var(--ig-size-medium, 2), 1), clamp(0, var(--ig-size-large, 3) - var(--component-size, 1), 1) );--is-small: clamp(0, var(--ig-size-medium) - var(--component-size, 1), 1);--component-size: var(--dropdown-size);cursor:pointer;padding-inline:max(var(--is-large, 1)*max(1.5rem,-1 * 1.5rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-medium, 1)*max(1.25rem,-1 * 1.25rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-small, 1)*max(1rem,-1 * 1rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, var(--ig-spacing))));border-radius:var(--item-border-radius)}.igx-drop-down__item igx-icon{color:var(--item-icon-color)}.igx-drop-down__item:hover{background:var(--hover-item-background);color:var(--hover-item-text-color)}.igx-drop-down__item:hover igx-icon{color:var(--hover-item-icon-color)}.igx-drop-down__item:focus{outline:0;outline-color:#0000;background:var(--focused-item-background);color:var(--focused-item-text-color)}.igx-drop-down__inner{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;display:block;align-items:center;gap:.5rem;margin-inline-end:auto}.igx-drop-down__inner>div{display:flex;align-items:center;gap:.5rem}.igx-drop-down__content{display:flex;width:100%;align-items:center;gap:.5rem}.igx-drop-down__item--focused{background:var(--focused-item-background);color:var(--focused-item-text-color)}.igx-drop-down__item--selected{background:var(--selected-item-background);color:var(--selected-item-text-color)}.igx-drop-down__item--selected igx-icon{color:var(--selected-item-icon-color)}.igx-drop-down__item--selected:hover{background:var(--selected-hover-item-background);color:var(--selected-hover-item-text-color)}.igx-drop-down__item--selected:hover igx-icon{color:var(--selected-hover-item-icon-color)}.igx-drop-down__item--selected.igx-drop-down__item--focused{background:var(--selected-focus-item-background);color:var(--selected-focus-item-text-color)}.igx-drop-down__item--selected.igx-drop-down__item--focused:hover{background:var(--selected-hover-item-background);color:var(--selected-hover-item-text-color)}.igx-drop-down__item--selected.igx-drop-down__item--focused:hover igx-icon{color:var(--selected-hover-item-icon-color)}.igx-drop-down__item--disabled{background:var(--disabled-item-background);color:var(--disabled-item-text-color);cursor:default;pointer-events:none}.igx-drop-down__item--disabled igx-icon{color:var(--disabled-item-text-color)}.igx-drop-down__group{pointer-events:auto}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-drop-down .igx-drop-down__header,.igx-drop-down .igx-drop-down__item{--ig-icon-size: max(var(--is-large, 1) * max(1rem, -1 * 1rem), var(--is-medium, 1) * max(1rem, -1 * 1rem), var(--is-small, 1) * max(.875rem, -1 * .875rem));padding-inline:max(var(--is-large, 1)*max(.75rem,-1 * .75rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-medium, 1)*max(.75rem,-1 * .75rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-small, 1)*max(.5rem,-1 * .5rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, var(--ig-spacing))))}.igx-drop-down .igx-drop-down__header igx-icon,.igx-drop-down .igx-drop-down__item igx-icon{--component-size: inherit}.igx-drop-down{padding:.1875rem}.igx-drop-down__item{margin-block:.125rem}.igx-drop-down__item:first-of-type,.igx-drop-down__item:last-of-type{margin-block:initial}.igx-drop-down__item--focused{outline:.125rem solid var(--focused-item-border-color);outline-offset:-.125rem}.igx-drop-down__header{margin-block-end:.125rem;padding-block:max(var(--is-large, 1)*max(.5rem,-1 * .5rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-medium, 1)*max(.375rem,-1 * .375rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-small, 1)*max(.25rem,-1 * .25rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, var(--ig-spacing))))}.igx-drop-down__group label{padding-inline:max(var(--is-large, 1)*max(.75rem,-1 * .75rem)*var(--ig-spacing-inline-large, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-medium, 1)*max(.75rem,-1 * .75rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-small, 1)*max(.5rem,-1 * .5rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, var(--ig-spacing))));padding-block:max(var(--is-large, 1)*max(.5rem,-1 * .5rem)*var(--ig-spacing-block-large, var(--ig-spacing-block, var(--ig-spacing))),var(--is-medium, 1)*max(.375rem,-1 * .375rem)*var(--ig-spacing-block-medium, var(--ig-spacing-block, var(--ig-spacing))),var(--is-small, 1)*max(.25rem,-1 * .25rem)*var(--ig-spacing-block-small, var(--ig-spacing-block, var(--ig-spacing))));margin-block-end:.125rem}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-drop-down__item--focused{outline:.0625rem solid var(--border-color);outline-offset:-.0625rem}.igx-drop-down__header{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)}.igx-drop-down__group{pointer-events:auto}.igx-drop-down__group label{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)}}}\n"] }]
         }], propDecorators: { children: [{
@@ -1956,10 +1956,10 @@ class IgxAutocompleteDirective extends IgxDropDownItemNavigationDirective {
         this.target.navigateFirst();
         this.cdr.detectChanges();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxAutocompleteDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "22.1.7", type: IgxAutocompleteDirective, isStandalone: true, selector: "[igxAutocomplete]", inputs: { target: ["igxAutocomplete", "target"], autocompleteSettings: ["igxAutocompleteSettings", "autocompleteSettings"], disabled: ["igxAutocompleteDisabled", "disabled", booleanAttribute] }, outputs: { selectionChanging: "selectionChanging" }, host: { listeners: { "input": "onInput()", "compositionstart": "onCompositionStart()", "compositionend": "onCompositionEnd()", "keydown.ArrowDown": "onArrowDown($event)", "keydown.Alt.ArrowDown": "onArrowDown($event)", "keydown.ArrowUp": "onArrowDown($event)", "keydown.Alt.ArrowUp": "onArrowDown($event)", "keydown.Tab": "onTab()", "keydown.Shift.Tab": "onTab()" }, properties: { "attr.autocomplete": "this.autofill", "attr.role": "this.role", "attr.aria-expanded": "this.ariaExpanded", "attr.aria-haspopup": "this.hasPopUp", "attr.aria-owns": "this.ariaOwns", "attr.aria-activedescendant": "this.ariaActiveDescendant", "attr.aria-autocomplete": "this.ariaAutocomplete" } }, exportAs: ["igxAutocomplete"], usesInheritance: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxAutocompleteDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "22.2.0", type: IgxAutocompleteDirective, isStandalone: true, selector: "[igxAutocomplete]", inputs: { target: ["igxAutocomplete", "target"], autocompleteSettings: ["igxAutocompleteSettings", "autocompleteSettings"], disabled: ["igxAutocompleteDisabled", "disabled", booleanAttribute] }, outputs: { selectionChanging: "selectionChanging" }, host: { listeners: { "input": "onInput()", "compositionstart": "onCompositionStart()", "compositionend": "onCompositionEnd()", "keydown.ArrowDown": "onArrowDown($event)", "keydown.Alt.ArrowDown": "onArrowDown($event)", "keydown.ArrowUp": "onArrowDown($event)", "keydown.Alt.ArrowUp": "onArrowDown($event)", "keydown.Tab": "onTab()", "keydown.Shift.Tab": "onTab()" }, properties: { "attr.autocomplete": "this.autofill", "attr.role": "this.role", "attr.aria-expanded": "this.ariaExpanded", "attr.aria-haspopup": "this.hasPopUp", "attr.aria-owns": "this.ariaOwns", "attr.aria-activedescendant": "this.ariaActiveDescendant", "attr.aria-autocomplete": "this.ariaAutocomplete" } }, exportAs: ["igxAutocomplete"], usesInheritance: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxAutocompleteDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxAutocompleteDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[igxAutocomplete]',
@@ -2032,11 +2032,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
  * IMPORTANT: The following is NgModule exported for backwards-compatibility before standalone components
  */
 class IgxAutocompleteModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxAutocompleteModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.7", ngImport: i0, type: IgxAutocompleteModule, imports: [IgxAutocompleteDirective], exports: [IgxAutocompleteDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxAutocompleteModule }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxAutocompleteModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.2.0", ngImport: i0, type: IgxAutocompleteModule, imports: [IgxAutocompleteDirective], exports: [IgxAutocompleteDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxAutocompleteModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxAutocompleteModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxAutocompleteModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [IgxAutocompleteDirective],
@@ -2057,11 +2057,11 @@ const IGX_DROP_DOWN_DIRECTIVES = [
  * IMPORTANT: The following is NgModule exported for backwards-compatibility before standalone components
  */
 class IgxDropDownModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxDropDownModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.7", ngImport: i0, type: IgxDropDownModule, imports: [IgxDropDownComponent, IgxDropDownItemComponent, IgxDropDownGroupComponent, IgxDropDownItemNavigationDirective], exports: [IgxDropDownComponent, IgxDropDownItemComponent, IgxDropDownGroupComponent, IgxDropDownItemNavigationDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxDropDownModule }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxDropDownModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.2.0", ngImport: i0, type: IgxDropDownModule, imports: [IgxDropDownComponent, IgxDropDownItemComponent, IgxDropDownGroupComponent, IgxDropDownItemNavigationDirective], exports: [IgxDropDownComponent, IgxDropDownItemComponent, IgxDropDownGroupComponent, IgxDropDownItemNavigationDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxDropDownModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxDropDownModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxDropDownModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [

package/fesm2022/igniteui-angular-expansion-panel.mjs

@@ -44,10 +44,10 @@ class HeaderContentBaseDirective {
             return null;
         };
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: HeaderContentBaseDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: HeaderContentBaseDirective, isStandalone: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: HeaderContentBaseDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.2.0", type: HeaderContentBaseDirective, isStandalone: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: HeaderContentBaseDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: HeaderContentBaseDirective, decorators: [{
             type: Directive
         }] });
 
@@ -125,10 +125,10 @@ class IgxExpansionPanelBodyComponent {
     set labelledBy(val) {
         this._labelledBy = val;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxExpansionPanelBodyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.7", type: IgxExpansionPanelBodyComponent, isStandalone: true, selector: "igx-expansion-panel-body", inputs: { role: "role", label: "label", labelledBy: "labelledBy" }, host: { properties: { "class.igx-expansion-panel__body": "this.cssClass", "attr.role": "this.role", "attr.aria-label": "this.label", "attr.aria-labelledby": "this.labelledBy" } }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.Eager }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxExpansionPanelBodyComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.2.0", type: IgxExpansionPanelBodyComponent, isStandalone: true, selector: "igx-expansion-panel-body", inputs: { role: "role", label: "label", labelledBy: "labelledBy" }, host: { properties: { "class.igx-expansion-panel__body": "this.cssClass", "attr.role": "this.role", "attr.aria-label": "this.label", "attr.aria-labelledby": "this.labelledBy" } }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.Eager }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxExpansionPanelBodyComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxExpansionPanelBodyComponent, decorators: [{
             type: Component,
             args: [{
                     selector: 'igx-expansion-panel-body',
@@ -166,10 +166,10 @@ class IgxExpansionPanelTitleDirective extends HeaderContentBaseDirective {
     get title() {
         return this.getTooltipContent(this.element);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxExpansionPanelTitleDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: IgxExpansionPanelTitleDirective, isStandalone: true, selector: "igx-expansion-panel-title", host: { properties: { "class.igx-expansion-panel__header-title": "this.cssClass", "attr.title": "this.title" } }, usesInheritance: true, hostDirectives: [{ directive: i1.IgxNoTypographyDirective }], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxExpansionPanelTitleDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.2.0", type: IgxExpansionPanelTitleDirective, isStandalone: true, selector: "igx-expansion-panel-title", host: { properties: { "class.igx-expansion-panel__header-title": "this.cssClass", "attr.title": "this.title" } }, usesInheritance: true, hostDirectives: [{ directive: i1.IgxNoTypographyDirective }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxExpansionPanelTitleDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxExpansionPanelTitleDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'igx-expansion-panel-title',
@@ -192,10 +192,10 @@ class IgxExpansionPanelDescriptionDirective extends HeaderContentBaseDirective {
     get title() {
         return this.getTooltipContent(this.element);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxExpansionPanelDescriptionDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: IgxExpansionPanelDescriptionDirective, isStandalone: true, selector: "igx-expansion-panel-description", host: { properties: { "class.igx-expansion-panel__header-description": "this.cssClass", "attr.title": "this.title" } }, usesInheritance: true, hostDirectives: [{ directive: i1.IgxNoTypographyDirective }], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxExpansionPanelDescriptionDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.2.0", type: IgxExpansionPanelDescriptionDirective, isStandalone: true, selector: "igx-expansion-panel-description", host: { properties: { "class.igx-expansion-panel__header-description": "this.cssClass", "attr.title": "this.title" } }, usesInheritance: true, hostDirectives: [{ directive: i1.IgxNoTypographyDirective }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxExpansionPanelDescriptionDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxExpansionPanelDescriptionDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'igx-expansion-panel-description',
@@ -211,10 +211,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
             }] } });
 /** @hidden @internal */
 class IgxExpansionPanelIconDirective {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxExpansionPanelIconDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: IgxExpansionPanelIconDirective, isStandalone: true, selector: "igx-expansion-panel-icon", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxExpansionPanelIconDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.2.0", type: IgxExpansionPanelIconDirective, isStandalone: true, selector: "igx-expansion-panel-icon", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxExpansionPanelIconDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxExpansionPanelIconDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: 'igx-expansion-panel-icon',
@@ -435,10 +435,10 @@ class IgxExpansionPanelHeaderComponent {
                 return '';
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxExpansionPanelHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: IgxExpansionPanelHeaderComponent, isStandalone: true, selector: "igx-expansion-panel-header", inputs: { lv: "lv", role: "role", iconPosition: "iconPosition", disabled: ["disabled", "disabled", booleanAttribute] }, outputs: { interaction: "interaction" }, host: { listeners: { "keydown.Enter": "onAction($any($event))", "keydown.Space": "onAction($any($event))", "keydown.Spacebar": "onAction($any($event))", "click": "onAction($event)", "keydown.alt.arrowdown": "openPanel($event)", "keydown.alt.arrowup": "closePanel($event)" }, properties: { "attr.aria-level": "this.lv", "attr.role": "this.role", "class.igx-expansion-panel__header": "this.cssClass", "class.igx-expansion-panel__header--expanded": "this.isExpanded", "class.igx-expansion-panel--disabled": "this.disabled" } }, queries: [{ propertyName: "iconTemplate", first: true, predicate: IgxExpansionPanelIconDirective, descendants: true }, { propertyName: "customIconRef", first: true, predicate: IgxExpansionPanelIconDirective, descendants: true, read: ElementRef }], viewQueries: [{ propertyName: "defaultIconRef", first: true, predicate: IgxIconComponent, descendants: true, read: ElementRef }], ngImport: i0, template: "<div class=\"igx-expansion-panel__header-inner\" [attr.tabindex]=\"tabIndex\" role=\"button\" [attr.id]=\"id\"\n[attr.aria-disabled]=\"disabled\" [attr.aria-expanded]=\"isExpanded\" [attr.aria-controls]=\"controls\">\n    <div class=\"igx-expansion-panel__title-wrapper\">\n        <ng-content select=\"igx-expansion-panel-title\"></ng-content>\n        <ng-content select=\"igx-expansion-panel-description\"></ng-content>\n    </div>\n    <ng-content></ng-content>\n    <div\n        [class]=\"iconPositionClass\"\n        [class.igx-expansion-panel__header-icon]=\"true\"\n    >\n        @if (iconTemplate) {\n            <ng-content select=\"igx-expansion-panel-icon\"></ng-content>\n        }\n        @if (!iconTemplate) {\n            <igx-icon\n                family=\"default\"\n                [name]=\"panel.collapsed ? 'expand' : 'collapse'\">\n            </igx-icon>\n        }\n    </div>\n</div>\n", dependencies: [{ kind: "component", type: IgxIconComponent, selector: "igx-icon", inputs: ["ariaHidden", "family", "name", "active"] }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxExpansionPanelHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.2.0", type: IgxExpansionPanelHeaderComponent, isStandalone: true, selector: "igx-expansion-panel-header", inputs: { lv: "lv", role: "role", iconPosition: "iconPosition", disabled: ["disabled", "disabled", booleanAttribute] }, outputs: { interaction: "interaction" }, host: { listeners: { "keydown.Enter": "onAction($any($event))", "keydown.Space": "onAction($any($event))", "keydown.Spacebar": "onAction($any($event))", "click": "onAction($event)", "keydown.alt.arrowdown": "openPanel($event)", "keydown.alt.arrowup": "closePanel($event)" }, properties: { "attr.aria-level": "this.lv", "attr.role": "this.role", "class.igx-expansion-panel__header": "this.cssClass", "class.igx-expansion-panel__header--expanded": "this.isExpanded", "class.igx-expansion-panel--disabled": "this.disabled" } }, queries: [{ propertyName: "iconTemplate", first: true, predicate: IgxExpansionPanelIconDirective, descendants: true }, { propertyName: "customIconRef", first: true, predicate: IgxExpansionPanelIconDirective, descendants: true, read: ElementRef }], viewQueries: [{ propertyName: "defaultIconRef", first: true, predicate: IgxIconComponent, descendants: true, read: ElementRef }], ngImport: i0, template: "<div class=\"igx-expansion-panel__header-inner\" [attr.tabindex]=\"tabIndex\" role=\"button\" [attr.id]=\"id\"\n[attr.aria-disabled]=\"disabled\" [attr.aria-expanded]=\"isExpanded\" [attr.aria-controls]=\"controls\">\n    <div class=\"igx-expansion-panel__title-wrapper\">\n        <ng-content select=\"igx-expansion-panel-title\"></ng-content>\n        <ng-content select=\"igx-expansion-panel-description\"></ng-content>\n    </div>\n    <ng-content></ng-content>\n    <div\n        [class]=\"iconPositionClass\"\n        [class.igx-expansion-panel__header-icon]=\"true\"\n    >\n        @if (iconTemplate) {\n            <ng-content select=\"igx-expansion-panel-icon\"></ng-content>\n        }\n        @if (!iconTemplate) {\n            <igx-icon\n                family=\"default\"\n                [name]=\"panel.collapsed ? 'expand' : 'collapse'\">\n            </igx-icon>\n        }\n    </div>\n</div>\n", dependencies: [{ kind: "component", type: IgxIconComponent, selector: "igx-icon", inputs: ["ariaHidden", "family", "name", "active"] }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxExpansionPanelHeaderComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxExpansionPanelHeaderComponent, decorators: [{
             type: Component,
             args: [{ selector: 'igx-expansion-panel-header', changeDetection: ChangeDetectionStrategy.Eager, host: {
                         '(keydown.Enter)': 'onAction($any($event))',
@@ -646,10 +646,10 @@ class ToggleAnimationPlayer {
                 return null;
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: ToggleAnimationPlayer, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: ToggleAnimationPlayer, isStandalone: true, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: ToggleAnimationPlayer, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.2.0", type: ToggleAnimationPlayer, isStandalone: true, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: ToggleAnimationPlayer, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: ToggleAnimationPlayer, decorators: [{
             type: Directive
         }] });
 
@@ -894,10 +894,10 @@ class IgxExpansionPanelComponent extends ToggleAnimationPlayer {
     close(evt) {
         this.collapse(evt);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxExpansionPanelComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: IgxExpansionPanelComponent, isStandalone: true, selector: "igx-expansion-panel", inputs: { animationSettings: "animationSettings", id: "id", collapsed: ["collapsed", "collapsed", booleanAttribute] }, outputs: { collapsedChange: "collapsedChange", contentCollapsing: "contentCollapsing", contentCollapsed: "contentCollapsed", contentExpanding: "contentExpanding", contentExpanded: "contentExpanded" }, host: { properties: { "attr.id": "this.id", "class.igx-expansion-panel": "this.cssClass", "class.igx-expansion-panel--expanded": "this.opened", "attr.aria-expanded": "this.panelExpanded" } }, providers: [{ provide: IGX_EXPANSION_PANEL_COMPONENT, useExisting: IgxExpansionPanelComponent }], queries: [{ propertyName: "body", first: true, predicate: IgxExpansionPanelBodyComponent, descendants: true, read: IgxExpansionPanelBodyComponent }, { propertyName: "header", first: true, predicate: IgxExpansionPanelHeaderComponent, descendants: true, read: IgxExpansionPanelHeaderComponent }], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"igx-expansion-panel-header\"></ng-content>\n@if (!collapsed) {\n    <ng-content select=\"igx-expansion-panel-body\"></ng-content>\n}\n", styles: ["@layer ig.base{.igx-expansion-panel__header-description,.igx-expansion-panel__header-title{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.igx-expansion-panel{display:flex;flex-direction:column;border-radius:var(--border-radius);overflow:hidden;transition:margin .35s cubic-bezier(.25,.46,.45,.94)}.igx-expansion-panel__title-wrapper{display:flex;flex-direction:column;justify-content:center;flex:1 0 0%;overflow:hidden}.igx-expansion-panel__header-inner{display:flex;align-items:center;padding:1rem 1.5rem;cursor:pointer;background:var(--header-background)}.igx-expansion-panel__header-inner:focus,.igx-expansion-panel__header-inner:active{background:var(--header-focus-background);outline:rgba(0,0,0,0)}.igx-expansion-panel__header-title{color:var(--header-title-color);margin-inline-end:1rem}.igx-expansion-panel__header-description{color:var(--header-description-color)}.igx-expansion-panel__header-icon{display:flex;align-content:center;justify-content:center;-webkit-user-select:none;-moz-user-select:none;user-select:none;color:var(--header-icon-color)}.igx-expansion-panel__header-icon igx-icon{--component-size: 3;color:var(--header-icon-color)}.igx-expansion-panel__header-icon--start{order:-1;margin-inline-end:1rem}.igx-expansion-panel__header-icon--end{order:1;margin-inline-start:1rem}.igx-expansion-panel__header-icon--none{display:none}.igx-expansion-panel__body{color:var(--body-color);background:var(--body-background);overflow:hidden;padding:1rem 1.5rem}.igx-expansion-panel--disabled{pointer-events:none}.igx-expansion-panel--disabled .igx-expansion-panel__header-title{color:var(--disabled-text-color)}.igx-expansion-panel--disabled .igx-expansion-panel__header-description{color:var(--disabled-description-color)}.igx-expansion-panel--disabled .igx-expansion-panel__header-icon igx-icon{color:var(--disabled-text-color)}.igx-expansion-panel--expanded{margin:var(--expanded-margin) 0}.igx-expansion-panel--expanded:first-of-type{margin-top:0}.igx-expansion-panel--expanded:last-of-type{margin-bottom:0}.igx-accordion{box-sizing:content-box;overflow-y:auto}.igx-accordion .igx-expansion-panel__header-title{display:-webkit-inline-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;white-space:initial;word-wrap:break-word}}@layer ig.material{@container style(--ig-theme: material){.igx-expansion-panel__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-expansion-panel__header-description{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-expansion-panel__body{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-expansion-panel__header-inner{padding:.625rem 1rem}.igx-expansion-panel__header-icon igx-icon{--component-size: 2}.igx-expansion-panel__header-icon--start{margin-inline-end:.5rem}.igx-expansion-panel__header-icon--end{margin-inline-start:.5rem}.igx-expansion-panel__body{padding:.25rem 1rem 1rem}.igx-expansion-panel__header-title{margin-block-end:.125rem;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-expansion-panel__header-description,.igx-expansion-panel__body{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-expansion-panel__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-expansion-panel__header-description{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-expansion-panel__body{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-expansion-panel__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-expansion-panel__header-description{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-expansion-panel__body{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:0}}}\n"], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxExpansionPanelComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.2.0", type: IgxExpansionPanelComponent, isStandalone: true, selector: "igx-expansion-panel", inputs: { animationSettings: "animationSettings", id: "id", collapsed: ["collapsed", "collapsed", booleanAttribute] }, outputs: { collapsedChange: "collapsedChange", contentCollapsing: "contentCollapsing", contentCollapsed: "contentCollapsed", contentExpanding: "contentExpanding", contentExpanded: "contentExpanded" }, host: { properties: { "attr.id": "this.id", "class.igx-expansion-panel": "this.cssClass", "class.igx-expansion-panel--expanded": "this.opened", "attr.aria-expanded": "this.panelExpanded" } }, providers: [{ provide: IGX_EXPANSION_PANEL_COMPONENT, useExisting: IgxExpansionPanelComponent }], queries: [{ propertyName: "body", first: true, predicate: IgxExpansionPanelBodyComponent, descendants: true, read: IgxExpansionPanelBodyComponent }, { propertyName: "header", first: true, predicate: IgxExpansionPanelHeaderComponent, descendants: true, read: IgxExpansionPanelHeaderComponent }], usesInheritance: true, ngImport: i0, template: "<ng-content select=\"igx-expansion-panel-header\"></ng-content>\n@if (!collapsed) {\n    <ng-content select=\"igx-expansion-panel-body\"></ng-content>\n}\n", styles: ["@layer ig.base{.igx-expansion-panel__header-description,.igx-expansion-panel__header-title{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.igx-expansion-panel{display:flex;flex-direction:column;border-radius:var(--border-radius);overflow:hidden;transition:margin .35s cubic-bezier(.25,.46,.45,.94)}.igx-expansion-panel__title-wrapper{display:flex;flex-direction:column;justify-content:center;flex:1 0 0%;overflow:hidden}.igx-expansion-panel__header-inner{display:flex;align-items:center;padding:1rem 1.5rem;cursor:pointer;background:var(--header-background)}.igx-expansion-panel__header-inner:focus,.igx-expansion-panel__header-inner:active{background:var(--header-focus-background);outline:rgba(0,0,0,0)}.igx-expansion-panel__header-title{color:var(--header-title-color);margin-inline-end:1rem}.igx-expansion-panel__header-description{color:var(--header-description-color)}.igx-expansion-panel__header-icon{display:flex;align-content:center;justify-content:center;-webkit-user-select:none;-moz-user-select:none;user-select:none;color:var(--header-icon-color)}.igx-expansion-panel__header-icon igx-icon{--component-size: 3;color:var(--header-icon-color)}.igx-expansion-panel__header-icon--start{order:-1;margin-inline-end:1rem}.igx-expansion-panel__header-icon--end{order:1;margin-inline-start:1rem}.igx-expansion-panel__header-icon--none{display:none}.igx-expansion-panel__body{color:var(--body-color);background:var(--body-background);overflow:hidden;padding:1rem 1.5rem}.igx-expansion-panel--disabled{pointer-events:none}.igx-expansion-panel--disabled .igx-expansion-panel__header-title{color:var(--disabled-text-color)}.igx-expansion-panel--disabled .igx-expansion-panel__header-description{color:var(--disabled-description-color)}.igx-expansion-panel--disabled .igx-expansion-panel__header-icon igx-icon{color:var(--disabled-text-color)}.igx-expansion-panel--expanded{margin:var(--expanded-margin) 0}.igx-expansion-panel--expanded:first-of-type{margin-top:0}.igx-expansion-panel--expanded:last-of-type{margin-bottom:0}.igx-accordion{box-sizing:content-box;overflow-y:auto}.igx-accordion .igx-expansion-panel__header-title{display:-webkit-inline-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;white-space:initial;word-wrap:break-word}}@layer ig.material{@container style(--ig-theme: material){.igx-expansion-panel__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-expansion-panel__header-description{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-expansion-panel__body{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-expansion-panel__header-inner{padding:.625rem 1rem}.igx-expansion-panel__header-icon igx-icon{--component-size: 2}.igx-expansion-panel__header-icon--start{margin-inline-end:.5rem}.igx-expansion-panel__header-icon--end{margin-inline-start:.5rem}.igx-expansion-panel__body{padding:.25rem 1rem 1rem}.igx-expansion-panel__header-title{margin-block-end:.125rem;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-expansion-panel__header-description,.igx-expansion-panel__body{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-expansion-panel__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-expansion-panel__header-description{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-expansion-panel__body{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-expansion-panel__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-expansion-panel__header-description{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-expansion-panel__body{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:0}}}\n"], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxExpansionPanelComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxExpansionPanelComponent, decorators: [{
             type: Component,
             args: [{ selector: 'igx-expansion-panel', encapsulation: ViewEncapsulation.None, providers: [{ provide: IGX_EXPANSION_PANEL_COMPONENT, useExisting: IgxExpansionPanelComponent }], changeDetection: ChangeDetectionStrategy.Eager, imports: [], template: "<ng-content select=\"igx-expansion-panel-header\"></ng-content>\n@if (!collapsed) {\n    <ng-content select=\"igx-expansion-panel-body\"></ng-content>\n}\n", styles: ["@layer ig.base{.igx-expansion-panel__header-description,.igx-expansion-panel__header-title{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.igx-expansion-panel{display:flex;flex-direction:column;border-radius:var(--border-radius);overflow:hidden;transition:margin .35s cubic-bezier(.25,.46,.45,.94)}.igx-expansion-panel__title-wrapper{display:flex;flex-direction:column;justify-content:center;flex:1 0 0%;overflow:hidden}.igx-expansion-panel__header-inner{display:flex;align-items:center;padding:1rem 1.5rem;cursor:pointer;background:var(--header-background)}.igx-expansion-panel__header-inner:focus,.igx-expansion-panel__header-inner:active{background:var(--header-focus-background);outline:rgba(0,0,0,0)}.igx-expansion-panel__header-title{color:var(--header-title-color);margin-inline-end:1rem}.igx-expansion-panel__header-description{color:var(--header-description-color)}.igx-expansion-panel__header-icon{display:flex;align-content:center;justify-content:center;-webkit-user-select:none;-moz-user-select:none;user-select:none;color:var(--header-icon-color)}.igx-expansion-panel__header-icon igx-icon{--component-size: 3;color:var(--header-icon-color)}.igx-expansion-panel__header-icon--start{order:-1;margin-inline-end:1rem}.igx-expansion-panel__header-icon--end{order:1;margin-inline-start:1rem}.igx-expansion-panel__header-icon--none{display:none}.igx-expansion-panel__body{color:var(--body-color);background:var(--body-background);overflow:hidden;padding:1rem 1.5rem}.igx-expansion-panel--disabled{pointer-events:none}.igx-expansion-panel--disabled .igx-expansion-panel__header-title{color:var(--disabled-text-color)}.igx-expansion-panel--disabled .igx-expansion-panel__header-description{color:var(--disabled-description-color)}.igx-expansion-panel--disabled .igx-expansion-panel__header-icon igx-icon{color:var(--disabled-text-color)}.igx-expansion-panel--expanded{margin:var(--expanded-margin) 0}.igx-expansion-panel--expanded:first-of-type{margin-top:0}.igx-expansion-panel--expanded:last-of-type{margin-bottom:0}.igx-accordion{box-sizing:content-box;overflow-y:auto}.igx-accordion .igx-expansion-panel__header-title{display:-webkit-inline-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;white-space:initial;word-wrap:break-word}}@layer ig.material{@container style(--ig-theme: material){.igx-expansion-panel__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-expansion-panel__header-description{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-expansion-panel__body{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-expansion-panel__header-inner{padding:.625rem 1rem}.igx-expansion-panel__header-icon igx-icon{--component-size: 2}.igx-expansion-panel__header-icon--start{margin-inline-end:.5rem}.igx-expansion-panel__header-icon--end{margin-inline-start:.5rem}.igx-expansion-panel__body{padding:.25rem 1rem 1rem}.igx-expansion-panel__header-title{margin-block-end:.125rem;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-expansion-panel__header-description,.igx-expansion-panel__body{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-expansion-panel__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-expansion-panel__header-description{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-expansion-panel__body{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-expansion-panel__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-expansion-panel__header-description{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-expansion-panel__body{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:0}}}\n"] }]
         }], propDecorators: { animationSettings: [{
@@ -952,11 +952,11 @@ const IGX_EXPANSION_PANEL_DIRECTIVES = [
  * IMPORTANT: The following is NgModule exported for backwards-compatibility before standalone components
  */
 class IgxExpansionPanelModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxExpansionPanelModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.7", ngImport: i0, type: IgxExpansionPanelModule, imports: [IgxExpansionPanelComponent, IgxExpansionPanelHeaderComponent, IgxExpansionPanelBodyComponent, IgxExpansionPanelDescriptionDirective, IgxExpansionPanelTitleDirective, IgxExpansionPanelIconDirective], exports: [IgxExpansionPanelComponent, IgxExpansionPanelHeaderComponent, IgxExpansionPanelBodyComponent, IgxExpansionPanelDescriptionDirective, IgxExpansionPanelTitleDirective, IgxExpansionPanelIconDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxExpansionPanelModule, imports: [IgxExpansionPanelHeaderComponent] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxExpansionPanelModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.2.0", ngImport: i0, type: IgxExpansionPanelModule, imports: [IgxExpansionPanelComponent, IgxExpansionPanelHeaderComponent, IgxExpansionPanelBodyComponent, IgxExpansionPanelDescriptionDirective, IgxExpansionPanelTitleDirective, IgxExpansionPanelIconDirective], exports: [IgxExpansionPanelComponent, IgxExpansionPanelHeaderComponent, IgxExpansionPanelBodyComponent, IgxExpansionPanelDescriptionDirective, IgxExpansionPanelTitleDirective, IgxExpansionPanelIconDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxExpansionPanelModule, imports: [IgxExpansionPanelHeaderComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxExpansionPanelModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.2.0", ngImport: i0, type: IgxExpansionPanelModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [