igniteui-angular 22.1.4 → 22.2.0-rc.1

package/fesm2022/igniteui-angular-navigation-drawer.mjs

@@ -72,10 +72,10 @@ class IgxNavDrawerItemDirective {
     get disabledCSS() {
         return this.disabled;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxNavDrawerItemDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "22.1.1", type: IgxNavDrawerItemDirective, isStandalone: true, selector: "[igxDrawerItem]", inputs: { active: ["active", "active", booleanAttribute], disabled: ["disabled", "disabled", booleanAttribute], isHeader: ["isHeader", "isHeader", booleanAttribute] }, host: { properties: { "class.igx-nav-drawer-item": "this.defaultCSS", "class.igx-nav-drawer__item": "this.defaultCSS", "class.igx-nav-drawer-item--active": "this.currentCSS", "class.igx-nav-drawer__item--active": "this.currentCSS", "class.igx-nav-drawer-item--header": "this.headerCSS", "class.igx-nav-drawer__item--header": "this.headerCSS", "class.igx-nav-drawer-item--disabled": "this.disabledCSS", "class.igx-nav-drawer__item--disabled": "this.disabledCSS" } }, exportAs: ["igxDrawerItem"], hostDirectives: [{ directive: i1.IgxNoTypographyDirective }], ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxNavDrawerItemDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "22.1.7", type: IgxNavDrawerItemDirective, isStandalone: true, selector: "[igxDrawerItem]", inputs: { active: ["active", "active", booleanAttribute], disabled: ["disabled", "disabled", booleanAttribute], isHeader: ["isHeader", "isHeader", booleanAttribute] }, host: { properties: { "class.igx-nav-drawer-item": "this.defaultCSS", "class.igx-nav-drawer__item": "this.defaultCSS", "class.igx-nav-drawer-item--active": "this.currentCSS", "class.igx-nav-drawer__item--active": "this.currentCSS", "class.igx-nav-drawer-item--header": "this.headerCSS", "class.igx-nav-drawer__item--header": "this.headerCSS", "class.igx-nav-drawer-item--disabled": "this.disabledCSS", "class.igx-nav-drawer__item--disabled": "this.disabledCSS" } }, exportAs: ["igxDrawerItem"], hostDirectives: [{ directive: i1.IgxNoTypographyDirective }], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxNavDrawerItemDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxNavDrawerItemDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[igxDrawerItem]',
@@ -121,10 +121,10 @@ class IgxNavDrawerTemplateDirective {
     constructor() {
         this.template = inject(TemplateRef);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxNavDrawerTemplateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.1", type: IgxNavDrawerTemplateDirective, isStandalone: true, selector: "[igxDrawer]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxNavDrawerTemplateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: IgxNavDrawerTemplateDirective, isStandalone: true, selector: "[igxDrawer]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxNavDrawerTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxNavDrawerTemplateDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[igxDrawer]',
@@ -135,10 +135,10 @@ class IgxNavDrawerMiniTemplateDirective {
     constructor() {
         this.template = inject(TemplateRef);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxNavDrawerMiniTemplateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.1", type: IgxNavDrawerMiniTemplateDirective, isStandalone: true, selector: "[igxDrawerMini]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxNavDrawerMiniTemplateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: IgxNavDrawerMiniTemplateDirective, isStandalone: true, selector: "[igxDrawerMini]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxNavDrawerMiniTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxNavDrawerMiniTemplateDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[igxDrawerMini]',
@@ -909,10 +909,10 @@ class IgxNavigationDrawerComponent {
             this.drawer.hidePopover();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxNavigationDrawerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "22.1.1", type: IgxNavigationDrawerComponent, isStandalone: true, selector: "igx-nav-drawer", inputs: { id: "id", position: "position", enableGestures: ["enableGestures", "enableGestures", booleanAttribute], pinThreshold: "pinThreshold", pin: ["pin", "pin", booleanAttribute], width: "width", disableAnimation: ["disableAnimation", "disableAnimation", booleanAttribute], miniWidth: "miniWidth", isOpen: ["isOpen", "isOpen", booleanAttribute] }, outputs: { isOpenChange: "isOpenChange", pinChange: "pinChange", opening: "opening", opened: "opened", closing: "closing", closed: "closed" }, host: { properties: { "class.igx-nav-drawer": "this.cssClass", "attr.id": "this.id", "class.igx-nav-drawer--disable-animation": "this.animationsDisabled", "class.igx-nav-drawer--mini": "this.isMini", "class.igx-nav-drawer--pinned": "this.pinned", "style.--ig-nav-drawer-size": "this.normalSize", "style.--ig-nav-drawer-size--mini": "this.miniSize", "style.order": "this.isPinnedRight" } }, queries: [{ propertyName: "contentTemplate", first: true, predicate: IgxNavDrawerTemplateDirective, descendants: true, read: IgxNavDrawerTemplateDirective }, { propertyName: "miniTemplate", first: true, predicate: IgxNavDrawerMiniTemplateDirective, descendants: true, read: IgxNavDrawerMiniTemplateDirective }], viewQueries: [{ propertyName: "_drawer", first: true, predicate: ["aside"], descendants: true, static: true }, { propertyName: "_overlay", first: true, predicate: ["overlay"], descendants: true, static: true }, { propertyName: "_styleDummy", first: true, predicate: ["dummy"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<ng-template #defaultItemsTemplate>\n    <div igxDrawerItem [isHeader]=\"true\">Navigation Drawer</div>\n    <div igxDrawerItem> Start by adding</div>\n    <div igxDrawerItem> <code>&lt;ng-template igxDrawer&gt;</code> </div>\n    <div igxDrawerItem> And some items inside </div>\n    <div igxDrawerItem> Style with igxDrawerItem </div>\n    <div igxDrawerItem> and igxRipple directives</div>\n    <div igxDrawerItem [disabled]=\"true\">Disabled Item</div>\n</ng-template>\n\n<div [hidden]=\"pin\"\n    [attr.popover]=\"pin ? null : 'manual'\"\n    class=\"igx-nav-drawer__overlay\"\n    [class.igx-nav-drawer__overlay--hidden]=\"!isOpen\"\n    [class.igx-nav-drawer--disable-animation]=\"animationsDisabled\"\n    (click)=\"close()\" #overlay>\n</div>\n<nav\n    class=\"igx-nav-drawer__aside\"\n    [attr.popover]=\"pin ? null : 'manual'\"\n    [class.igx-nav-drawer__aside--collapsed]=\"!miniTemplate && !isOpen\"\n    [class.igx-nav-drawer__aside--mini]=\"miniTemplate && !isOpen\"\n    [class.igx-nav-drawer__aside--normal]=\"!miniTemplate || isOpen\"\n    [class.igx-nav-drawer__aside--pinned]=\"pin\"\n    [class.igx-nav-drawer__aside--right]=\"position === 'right'\" #aside\n    [class.igx-nav-drawer--disable-animation]=\"animationsDisabled\">\n\n    <ng-container *ngTemplateOutlet=\"template || defaultItemsTemplate\"></ng-container>\n</nav>\n<div class=\"igx-nav-drawer__style-dummy\" #dummy></div>\n", styles: ["@layer ig.base{.igx-nav-drawer{--ig-nav-drawer-transition-duration: .3s;display:block;height:100%;flex:0 0 0;transition-duration:var(--ig-nav-drawer-transition-duration)}.igx-nav-drawer--pinned{flex-basis:var(--size)}.igx-nav-drawer--mini.igx-nav-drawer--pinned{flex-basis:calc(var(--size--mini) + .0625rem)}.igx-nav-drawer__aside{position:fixed;display:block;height:100%;min-height:100%;overflow-x:hidden;background:var(--background);inset:0 auto;width:var(--size);inset-inline-start:0;box-shadow:var(--elevation);padding:var(--aside-padding);border:none;border-inline-end:.0625rem solid var(--border-color);border-radius:var(--border-radius);contain:content paint layout;margin:0;border-block:none}.igx-nav-drawer__aside--panning{overflow-x:hidden;transition:none}.igx-nav-drawer__aside--collapsed{transform:translate3d(-300px,0,0);box-shadow:none}[dir=rtl] .igx-nav-drawer__aside--collapsed{transform:translate3d(300px,0,0)}.igx-nav-drawer__aside--collapsed.igx-nav-drawer__aside--right{transform:translate3d(300px,0,0);box-shadow:none}[dir=rtl] .igx-nav-drawer__aside--collapsed.igx-nav-drawer__aside--right{transform:translate3d(-300px,0,0)}.igx-nav-drawer__aside--right{inset-inline-start:auto;inset-inline-end:0;border-inline-end:none;border-inline-start:.0625rem solid var(--border-color)}.igx-nav-drawer__aside--mini{transition-duration:var(--ig-nav-drawer-transition-duration);width:var(--size--mini);min-width:-moz-fit-content;min-width:fit-content}.igx-nav-drawer__aside--mini [igxDrawerItem]{justify-content:center;min-width:-moz-fit-content;min-width:fit-content;width:var(--item-mini-width)}.igx-nav-drawer__aside--mini [igxDrawerItem] igx-icon{margin-inline-start:0}.igx-nav-drawer__aside--normal{transition-duration:var(--ig-nav-drawer-transition-duration);width:var(--size)}.igx-nav-drawer__aside--pinned{position:relative;box-shadow:none}.igx-nav-drawer__aside--pinned.igx-nav-drawer__aside--collapsed{transform:none;width:0;overflow:hidden;border:none;padding-inline:0}.igx-nav-drawer__overlay{opacity:1;background:hsl(from var(--ig-gray-500) h s l/.54);transition:opacity,visibility;transition-duration:var(--ig-nav-drawer-transition-duration),var(--ig-nav-drawer-transition-duration);transition-delay:0s,0s;position:absolute;inset-inline-start:0;inset:0;width:100%;height:100%;visibility:visible;margin:0;padding:0;border:none;display:block}.igx-nav-drawer__overlay--panning{transform:translateZ(0);transition:none}.igx-nav-drawer__overlay--panning.igx-nav-drawer__overlay--hidden{visibility:visible}.igx-nav-drawer__overlay--hidden{visibility:hidden;opacity:0}.igx-nav-drawer__style-dummy{height:0;background:none;box-shadow:none;transition:none;visibility:hidden}.igx-nav-drawer--disable-animation{transition-duration:0s}.igx-nav-drawer-item{position:relative;display:flex;align-items:center;flex-flow:row nowrap;max-height:var(--item-min-height);gap:var(--item-gap);padding:var(--item-padding);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;outline:rgba(0,0,0,0);white-space:nowrap;border-radius:var(--item-border-radius);text-decoration:none;border:none;justify-content:flex-start;contain:paint layout content;color:var(--item-text-color)}.igx-nav-drawer-item igx-icon{--item-icon-color: inherit;--component-size: 3}.igx-nav-drawer-item[igxButton]{--ig-icon-size: 1.5rem;background:#0000;border:none;box-shadow:none}.igx-nav-drawer-item[igxButton] igx-icon{margin:0}.igx-nav-drawer-item[igxButton]:hover,.igx-nav-drawer-item[igxButton]:focus{box-shadow:none;border:none}.igx-nav-drawer-item:hover:not(.igx-nav-drawer-item--active),.igx-nav-drawer-item:focus:not(.igx-nav-drawer-item--active){background:var(--item-hover-background);color:var(--item-hover-text-color)}.igx-nav-drawer-item--header{display:flex;align-items:center;padding:var(--item-padding);min-height:var(--item-min-height);white-space:nowrap;color:var(--item-header-text-color)}.igx-nav-drawer-item--disabled{background:none;color:var(--item-disabled-text-color);cursor:default;pointer-events:none}.igx-nav-drawer-item--disabled igx-icon{color:var(--item-disabled-icon-color)}}@layer ig.material{@container style(--ig-theme: material){.igx-nav-drawer{--aside-padding: .5rem;--item-padding: .75rem .5rem;--item-gap: 2rem;--item-min-height: 3rem}}}@layer ig.material{@container style(--ig-theme: material){.igx-nav-drawer-item{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);border-radius:initial;clip-path:inset(.25rem 0 round var(--item-border-radius))}.igx-nav-drawer-item:after{content:\"\";position:absolute;width:100%;inset-block-start:.25rem;inset-inline-start:0;height:calc(100% - .5rem);border-radius:var(--item-border-radius);z-index:-1}.igx-nav-drawer-item:hover,.igx-nav-drawer-item:focus{background:unset}.igx-nav-drawer-item:hover:after,.igx-nav-drawer-item:focus:after{background:var(--item-hover-background)}.igx-nav-drawer-item--active{color:var(--item-active-text-color)}.igx-nav-drawer-item--active:after{background:var(--item-active-background)}.igx-nav-drawer-item--active:focus,.igx-nav-drawer-item--active:hover{color:var(--item-active-text-color)}.igx-nav-drawer-item--active:focus:after,.igx-nav-drawer-item--active:hover:after{background:var(--item-active-background)}.igx-nav-drawer-item--header{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)}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-nav-drawer{--aside-padding: 1rem;--item-padding: .5rem 1rem;--item-gap: .5rem;--item-min-height: 2.5rem;--item-mini-width: 3.5rem}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-nav-drawer-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)}.igx-nav-drawer-item--active{color:var(--item-active-text-color);background:var(--item-active-background)}.igx-nav-drawer-item--active igx-icon{color:var(--item-active-icon-color)}.igx-nav-drawer-item--active:focus,.igx-nav-drawer-item--active:hover{color:var(--item-active-text-color);background:var(--item-active-background)}.igx-nav-drawer-item--active:focus igx-icon,.igx-nav-drawer-item--active:hover igx-icon{color:var(--item-active-icon-color)}.igx-nav-drawer-item--header{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)}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-nav-drawer{--aside-padding: 0;--item-padding: .625rem .5rem;--item-gap: .5rem;--item-min-height: 2.75rem}.igx-nav-drawer__aside{border:.0625rem solid var(--border-color)}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-nav-drawer-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)}.igx-nav-drawer-item--active{color:var(--item-active-text-color);background:var(--item-active-background)}.igx-nav-drawer-item--active igx-icon{color:var(--item-active-icon-color)}.igx-nav-drawer-item--active:focus,.igx-nav-drawer-item--active:hover{color:var(--item-active-text-color);background:var(--item-active-background)}.igx-nav-drawer-item--active:focus igx-icon,.igx-nav-drawer-item--active:hover igx-icon{color:var(--item-active-icon-color)}.igx-nav-drawer-item--header{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)}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-nav-drawer{--aside-padding: .5rem;--item-padding: .5rem 1rem;--item-gap: 1rem;--item-min-height: 2rem;--item-mini-width: 2rem;--item-margin: .25rem}.igx-nav-drawer__aside--mini [igxDrawerItem]{margin:var(--item-margin) auto}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-nav-drawer-item{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-block-end:var(--item-margin)}.igx-nav-drawer-item igx-icon{--component-size: 2}.igx-nav-drawer-item--active{color:var(--item-active-text-color);background:var(--item-active-background)}.igx-nav-drawer-item--active igx-icon{color:var(--item-active-icon-color)}.igx-nav-drawer-item--active:focus,.igx-nav-drawer-item--active:hover{color:var(--item-active-text-color);background:var(--item-active-background)}.igx-nav-drawer-item--active:focus igx-icon,.igx-nav-drawer-item--active:hover igx-icon{color:var(--item-active-icon-color)}.igx-nav-drawer-item--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);margin-block-end:var(--item-margin)}}}\n"], dependencies: [{ kind: "directive", type: IgxNavDrawerItemDirective, selector: "[igxDrawerItem]", inputs: ["active", "disabled", "isHeader"], exportAs: ["igxDrawerItem"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxNavigationDrawerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "22.1.7", type: IgxNavigationDrawerComponent, isStandalone: true, selector: "igx-nav-drawer", inputs: { id: "id", position: "position", enableGestures: ["enableGestures", "enableGestures", booleanAttribute], pinThreshold: "pinThreshold", pin: ["pin", "pin", booleanAttribute], width: "width", disableAnimation: ["disableAnimation", "disableAnimation", booleanAttribute], miniWidth: "miniWidth", isOpen: ["isOpen", "isOpen", booleanAttribute] }, outputs: { isOpenChange: "isOpenChange", pinChange: "pinChange", opening: "opening", opened: "opened", closing: "closing", closed: "closed" }, host: { properties: { "class.igx-nav-drawer": "this.cssClass", "attr.id": "this.id", "class.igx-nav-drawer--disable-animation": "this.animationsDisabled", "class.igx-nav-drawer--mini": "this.isMini", "class.igx-nav-drawer--pinned": "this.pinned", "style.--ig-nav-drawer-size": "this.normalSize", "style.--ig-nav-drawer-size--mini": "this.miniSize", "style.order": "this.isPinnedRight" } }, queries: [{ propertyName: "contentTemplate", first: true, predicate: IgxNavDrawerTemplateDirective, descendants: true, read: IgxNavDrawerTemplateDirective }, { propertyName: "miniTemplate", first: true, predicate: IgxNavDrawerMiniTemplateDirective, descendants: true, read: IgxNavDrawerMiniTemplateDirective }], viewQueries: [{ propertyName: "_drawer", first: true, predicate: ["aside"], descendants: true, static: true }, { propertyName: "_overlay", first: true, predicate: ["overlay"], descendants: true, static: true }, { propertyName: "_styleDummy", first: true, predicate: ["dummy"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<ng-template #defaultItemsTemplate>\n    <div igxDrawerItem [isHeader]=\"true\">Navigation Drawer</div>\n    <div igxDrawerItem> Start by adding</div>\n    <div igxDrawerItem> <code>&lt;ng-template igxDrawer&gt;</code> </div>\n    <div igxDrawerItem> And some items inside </div>\n    <div igxDrawerItem> Style with igxDrawerItem </div>\n    <div igxDrawerItem> and igxRipple directives</div>\n    <div igxDrawerItem [disabled]=\"true\">Disabled Item</div>\n</ng-template>\n\n<div [hidden]=\"pin\"\n    [attr.popover]=\"pin ? null : 'manual'\"\n    class=\"igx-nav-drawer__overlay\"\n    [class.igx-nav-drawer__overlay--hidden]=\"!isOpen\"\n    [class.igx-nav-drawer--disable-animation]=\"animationsDisabled\"\n    (click)=\"close()\" #overlay>\n</div>\n<nav\n    class=\"igx-nav-drawer__aside\"\n    [attr.popover]=\"pin ? null : 'manual'\"\n    [class.igx-nav-drawer__aside--collapsed]=\"!miniTemplate && !isOpen\"\n    [class.igx-nav-drawer__aside--mini]=\"miniTemplate && !isOpen\"\n    [class.igx-nav-drawer__aside--normal]=\"!miniTemplate || isOpen\"\n    [class.igx-nav-drawer__aside--pinned]=\"pin\"\n    [class.igx-nav-drawer__aside--right]=\"position === 'right'\" #aside\n    [class.igx-nav-drawer--disable-animation]=\"animationsDisabled\">\n\n    <ng-container *ngTemplateOutlet=\"template || defaultItemsTemplate\"></ng-container>\n</nav>\n<div class=\"igx-nav-drawer__style-dummy\" #dummy></div>\n", styles: ["@layer ig.base{.igx-nav-drawer{--ig-nav-drawer-transition-duration: .3s;display:block;height:100%;flex:0 0 0;transition-duration:var(--ig-nav-drawer-transition-duration)}.igx-nav-drawer--pinned{flex-basis:var(--size)}.igx-nav-drawer--mini.igx-nav-drawer--pinned{flex-basis:calc(var(--size--mini) + .0625rem)}.igx-nav-drawer__aside{position:fixed;display:block;height:100%;min-height:100%;overflow-x:hidden;background:var(--background);inset:0 auto;width:var(--size);inset-inline-start:0;box-shadow:var(--elevation);padding:var(--aside-padding);border:none;border-inline-end:.0625rem solid var(--border-color);border-radius:var(--border-radius);contain:content paint layout;margin:0;border-block:none}.igx-nav-drawer__aside--panning{overflow-x:hidden;transition:none}.igx-nav-drawer__aside--collapsed{transform:translate3d(-300px,0,0);box-shadow:none}[dir=rtl] .igx-nav-drawer__aside--collapsed{transform:translate3d(300px,0,0)}.igx-nav-drawer__aside--collapsed.igx-nav-drawer__aside--right{transform:translate3d(300px,0,0);box-shadow:none}[dir=rtl] .igx-nav-drawer__aside--collapsed.igx-nav-drawer__aside--right{transform:translate3d(-300px,0,0)}.igx-nav-drawer__aside--right{inset-inline-start:auto;inset-inline-end:0;border-inline-end:none;border-inline-start:.0625rem solid var(--border-color)}.igx-nav-drawer__aside--mini{transition-duration:var(--ig-nav-drawer-transition-duration);width:var(--size--mini);min-width:-moz-fit-content;min-width:fit-content}.igx-nav-drawer__aside--mini [igxDrawerItem]{justify-content:center;min-width:-moz-fit-content;min-width:fit-content;width:var(--item-mini-width)}.igx-nav-drawer__aside--mini [igxDrawerItem] igx-icon{margin-inline-start:0}.igx-nav-drawer__aside--normal{transition-duration:var(--ig-nav-drawer-transition-duration);width:var(--size)}.igx-nav-drawer__aside--pinned{position:relative;box-shadow:none}.igx-nav-drawer__aside--pinned.igx-nav-drawer__aside--collapsed{transform:none;width:0;overflow:hidden;border:none;padding-inline:0}.igx-nav-drawer__overlay{opacity:1;background:hsl(from var(--ig-gray-500) h s l/.54);transition:opacity,visibility;transition-duration:var(--ig-nav-drawer-transition-duration),var(--ig-nav-drawer-transition-duration);transition-delay:0s,0s;position:absolute;inset-inline-start:0;inset:0;width:100%;height:100%;visibility:visible;margin:0;padding:0;border:none;display:block}.igx-nav-drawer__overlay--panning{transform:translateZ(0);transition:none}.igx-nav-drawer__overlay--panning.igx-nav-drawer__overlay--hidden{visibility:visible}.igx-nav-drawer__overlay--hidden{visibility:hidden;opacity:0}.igx-nav-drawer__style-dummy{height:0;background:none;box-shadow:none;transition:none;visibility:hidden}.igx-nav-drawer--disable-animation{transition-duration:0s}.igx-nav-drawer-item{position:relative;display:flex;align-items:center;flex-flow:row nowrap;max-height:var(--item-min-height);gap:var(--item-gap);padding:var(--item-padding);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;outline:rgba(0,0,0,0);white-space:nowrap;border-radius:var(--item-border-radius);text-decoration:none;border:none;justify-content:flex-start;contain:paint layout content;color:var(--item-text-color)}.igx-nav-drawer-item igx-icon{--item-icon-color: inherit;--component-size: 3}.igx-nav-drawer-item[igxButton]{--ig-icon-size: 1.5rem;background:#0000;border:none;box-shadow:none}.igx-nav-drawer-item[igxButton] igx-icon{margin:0}.igx-nav-drawer-item[igxButton]:hover,.igx-nav-drawer-item[igxButton]:focus{box-shadow:none;border:none}.igx-nav-drawer-item:hover:not(.igx-nav-drawer-item--active),.igx-nav-drawer-item:focus:not(.igx-nav-drawer-item--active){background:var(--item-hover-background);color:var(--item-hover-text-color)}.igx-nav-drawer-item--header{display:flex;align-items:center;padding:var(--item-padding);min-height:var(--item-min-height);white-space:nowrap;color:var(--item-header-text-color)}.igx-nav-drawer-item--disabled{background:none;color:var(--item-disabled-text-color);cursor:default;pointer-events:none}.igx-nav-drawer-item--disabled igx-icon{color:var(--item-disabled-icon-color)}}@layer ig.material{@container style(--ig-theme: material){.igx-nav-drawer{--aside-padding: .5rem;--item-padding: .75rem .5rem;--item-gap: 2rem;--item-min-height: 3rem}}}@layer ig.material{@container style(--ig-theme: material){.igx-nav-drawer-item{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);border-radius:initial;clip-path:inset(.25rem 0 round var(--item-border-radius))}.igx-nav-drawer-item:after{content:\"\";position:absolute;width:100%;inset-block-start:.25rem;inset-inline-start:0;height:calc(100% - .5rem);border-radius:var(--item-border-radius);z-index:-1}.igx-nav-drawer-item:hover,.igx-nav-drawer-item:focus{background:unset}.igx-nav-drawer-item:hover:after,.igx-nav-drawer-item:focus:after{background:var(--item-hover-background)}.igx-nav-drawer-item--active{color:var(--item-active-text-color)}.igx-nav-drawer-item--active:after{background:var(--item-active-background)}.igx-nav-drawer-item--active:focus,.igx-nav-drawer-item--active:hover{color:var(--item-active-text-color)}.igx-nav-drawer-item--active:focus:after,.igx-nav-drawer-item--active:hover:after{background:var(--item-active-background)}.igx-nav-drawer-item--header{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)}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-nav-drawer{--aside-padding: 1rem;--item-padding: .5rem 1rem;--item-gap: .5rem;--item-min-height: 2.5rem;--item-mini-width: 3.5rem}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-nav-drawer-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)}.igx-nav-drawer-item--active{color:var(--item-active-text-color);background:var(--item-active-background)}.igx-nav-drawer-item--active igx-icon{color:var(--item-active-icon-color)}.igx-nav-drawer-item--active:focus,.igx-nav-drawer-item--active:hover{color:var(--item-active-text-color);background:var(--item-active-background)}.igx-nav-drawer-item--active:focus igx-icon,.igx-nav-drawer-item--active:hover igx-icon{color:var(--item-active-icon-color)}.igx-nav-drawer-item--header{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)}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-nav-drawer{--aside-padding: 0;--item-padding: .625rem .5rem;--item-gap: .5rem;--item-min-height: 2.75rem}.igx-nav-drawer__aside{border:.0625rem solid var(--border-color)}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-nav-drawer-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)}.igx-nav-drawer-item--active{color:var(--item-active-text-color);background:var(--item-active-background)}.igx-nav-drawer-item--active igx-icon{color:var(--item-active-icon-color)}.igx-nav-drawer-item--active:focus,.igx-nav-drawer-item--active:hover{color:var(--item-active-text-color);background:var(--item-active-background)}.igx-nav-drawer-item--active:focus igx-icon,.igx-nav-drawer-item--active:hover igx-icon{color:var(--item-active-icon-color)}.igx-nav-drawer-item--header{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)}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-nav-drawer{--aside-padding: .5rem;--item-padding: .5rem 1rem;--item-gap: 1rem;--item-min-height: 2rem;--item-mini-width: 2rem;--item-margin: .25rem}.igx-nav-drawer__aside--mini [igxDrawerItem]{margin:var(--item-margin) auto}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-nav-drawer-item{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-block-end:var(--item-margin)}.igx-nav-drawer-item igx-icon{--component-size: 2}.igx-nav-drawer-item--active{color:var(--item-active-text-color);background:var(--item-active-background)}.igx-nav-drawer-item--active igx-icon{color:var(--item-active-icon-color)}.igx-nav-drawer-item--active:focus,.igx-nav-drawer-item--active:hover{color:var(--item-active-text-color);background:var(--item-active-background)}.igx-nav-drawer-item--active:focus igx-icon,.igx-nav-drawer-item--active:hover igx-icon{color:var(--item-active-icon-color)}.igx-nav-drawer-item--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);margin-block-end:var(--item-margin)}}}\n"], dependencies: [{ kind: "directive", type: IgxNavDrawerItemDirective, selector: "[igxDrawerItem]", inputs: ["active", "disabled", "isHeader"], exportAs: ["igxDrawerItem"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxNavigationDrawerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxNavigationDrawerComponent, decorators: [{
             type: Component,
             args: [{ selector: 'igx-nav-drawer', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxNavDrawerItemDirective, NgTemplateOutlet], template: "<ng-template #defaultItemsTemplate>\n    <div igxDrawerItem [isHeader]=\"true\">Navigation Drawer</div>\n    <div igxDrawerItem> Start by adding</div>\n    <div igxDrawerItem> <code>&lt;ng-template igxDrawer&gt;</code> </div>\n    <div igxDrawerItem> And some items inside </div>\n    <div igxDrawerItem> Style with igxDrawerItem </div>\n    <div igxDrawerItem> and igxRipple directives</div>\n    <div igxDrawerItem [disabled]=\"true\">Disabled Item</div>\n</ng-template>\n\n<div [hidden]=\"pin\"\n    [attr.popover]=\"pin ? null : 'manual'\"\n    class=\"igx-nav-drawer__overlay\"\n    [class.igx-nav-drawer__overlay--hidden]=\"!isOpen\"\n    [class.igx-nav-drawer--disable-animation]=\"animationsDisabled\"\n    (click)=\"close()\" #overlay>\n</div>\n<nav\n    class=\"igx-nav-drawer__aside\"\n    [attr.popover]=\"pin ? null : 'manual'\"\n    [class.igx-nav-drawer__aside--collapsed]=\"!miniTemplate && !isOpen\"\n    [class.igx-nav-drawer__aside--mini]=\"miniTemplate && !isOpen\"\n    [class.igx-nav-drawer__aside--normal]=\"!miniTemplate || isOpen\"\n    [class.igx-nav-drawer__aside--pinned]=\"pin\"\n    [class.igx-nav-drawer__aside--right]=\"position === 'right'\" #aside\n    [class.igx-nav-drawer--disable-animation]=\"animationsDisabled\">\n\n    <ng-container *ngTemplateOutlet=\"template || defaultItemsTemplate\"></ng-container>\n</nav>\n<div class=\"igx-nav-drawer__style-dummy\" #dummy></div>\n", styles: ["@layer ig.base{.igx-nav-drawer{--ig-nav-drawer-transition-duration: .3s;display:block;height:100%;flex:0 0 0;transition-duration:var(--ig-nav-drawer-transition-duration)}.igx-nav-drawer--pinned{flex-basis:var(--size)}.igx-nav-drawer--mini.igx-nav-drawer--pinned{flex-basis:calc(var(--size--mini) + .0625rem)}.igx-nav-drawer__aside{position:fixed;display:block;height:100%;min-height:100%;overflow-x:hidden;background:var(--background);inset:0 auto;width:var(--size);inset-inline-start:0;box-shadow:var(--elevation);padding:var(--aside-padding);border:none;border-inline-end:.0625rem solid var(--border-color);border-radius:var(--border-radius);contain:content paint layout;margin:0;border-block:none}.igx-nav-drawer__aside--panning{overflow-x:hidden;transition:none}.igx-nav-drawer__aside--collapsed{transform:translate3d(-300px,0,0);box-shadow:none}[dir=rtl] .igx-nav-drawer__aside--collapsed{transform:translate3d(300px,0,0)}.igx-nav-drawer__aside--collapsed.igx-nav-drawer__aside--right{transform:translate3d(300px,0,0);box-shadow:none}[dir=rtl] .igx-nav-drawer__aside--collapsed.igx-nav-drawer__aside--right{transform:translate3d(-300px,0,0)}.igx-nav-drawer__aside--right{inset-inline-start:auto;inset-inline-end:0;border-inline-end:none;border-inline-start:.0625rem solid var(--border-color)}.igx-nav-drawer__aside--mini{transition-duration:var(--ig-nav-drawer-transition-duration);width:var(--size--mini);min-width:-moz-fit-content;min-width:fit-content}.igx-nav-drawer__aside--mini [igxDrawerItem]{justify-content:center;min-width:-moz-fit-content;min-width:fit-content;width:var(--item-mini-width)}.igx-nav-drawer__aside--mini [igxDrawerItem] igx-icon{margin-inline-start:0}.igx-nav-drawer__aside--normal{transition-duration:var(--ig-nav-drawer-transition-duration);width:var(--size)}.igx-nav-drawer__aside--pinned{position:relative;box-shadow:none}.igx-nav-drawer__aside--pinned.igx-nav-drawer__aside--collapsed{transform:none;width:0;overflow:hidden;border:none;padding-inline:0}.igx-nav-drawer__overlay{opacity:1;background:hsl(from var(--ig-gray-500) h s l/.54);transition:opacity,visibility;transition-duration:var(--ig-nav-drawer-transition-duration),var(--ig-nav-drawer-transition-duration);transition-delay:0s,0s;position:absolute;inset-inline-start:0;inset:0;width:100%;height:100%;visibility:visible;margin:0;padding:0;border:none;display:block}.igx-nav-drawer__overlay--panning{transform:translateZ(0);transition:none}.igx-nav-drawer__overlay--panning.igx-nav-drawer__overlay--hidden{visibility:visible}.igx-nav-drawer__overlay--hidden{visibility:hidden;opacity:0}.igx-nav-drawer__style-dummy{height:0;background:none;box-shadow:none;transition:none;visibility:hidden}.igx-nav-drawer--disable-animation{transition-duration:0s}.igx-nav-drawer-item{position:relative;display:flex;align-items:center;flex-flow:row nowrap;max-height:var(--item-min-height);gap:var(--item-gap);padding:var(--item-padding);cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;outline:rgba(0,0,0,0);white-space:nowrap;border-radius:var(--item-border-radius);text-decoration:none;border:none;justify-content:flex-start;contain:paint layout content;color:var(--item-text-color)}.igx-nav-drawer-item igx-icon{--item-icon-color: inherit;--component-size: 3}.igx-nav-drawer-item[igxButton]{--ig-icon-size: 1.5rem;background:#0000;border:none;box-shadow:none}.igx-nav-drawer-item[igxButton] igx-icon{margin:0}.igx-nav-drawer-item[igxButton]:hover,.igx-nav-drawer-item[igxButton]:focus{box-shadow:none;border:none}.igx-nav-drawer-item:hover:not(.igx-nav-drawer-item--active),.igx-nav-drawer-item:focus:not(.igx-nav-drawer-item--active){background:var(--item-hover-background);color:var(--item-hover-text-color)}.igx-nav-drawer-item--header{display:flex;align-items:center;padding:var(--item-padding);min-height:var(--item-min-height);white-space:nowrap;color:var(--item-header-text-color)}.igx-nav-drawer-item--disabled{background:none;color:var(--item-disabled-text-color);cursor:default;pointer-events:none}.igx-nav-drawer-item--disabled igx-icon{color:var(--item-disabled-icon-color)}}@layer ig.material{@container style(--ig-theme: material){.igx-nav-drawer{--aside-padding: .5rem;--item-padding: .75rem .5rem;--item-gap: 2rem;--item-min-height: 3rem}}}@layer ig.material{@container style(--ig-theme: material){.igx-nav-drawer-item{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);border-radius:initial;clip-path:inset(.25rem 0 round var(--item-border-radius))}.igx-nav-drawer-item:after{content:\"\";position:absolute;width:100%;inset-block-start:.25rem;inset-inline-start:0;height:calc(100% - .5rem);border-radius:var(--item-border-radius);z-index:-1}.igx-nav-drawer-item:hover,.igx-nav-drawer-item:focus{background:unset}.igx-nav-drawer-item:hover:after,.igx-nav-drawer-item:focus:after{background:var(--item-hover-background)}.igx-nav-drawer-item--active{color:var(--item-active-text-color)}.igx-nav-drawer-item--active:after{background:var(--item-active-background)}.igx-nav-drawer-item--active:focus,.igx-nav-drawer-item--active:hover{color:var(--item-active-text-color)}.igx-nav-drawer-item--active:focus:after,.igx-nav-drawer-item--active:hover:after{background:var(--item-active-background)}.igx-nav-drawer-item--header{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)}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-nav-drawer{--aside-padding: 1rem;--item-padding: .5rem 1rem;--item-gap: .5rem;--item-min-height: 2.5rem;--item-mini-width: 3.5rem}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-nav-drawer-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)}.igx-nav-drawer-item--active{color:var(--item-active-text-color);background:var(--item-active-background)}.igx-nav-drawer-item--active igx-icon{color:var(--item-active-icon-color)}.igx-nav-drawer-item--active:focus,.igx-nav-drawer-item--active:hover{color:var(--item-active-text-color);background:var(--item-active-background)}.igx-nav-drawer-item--active:focus igx-icon,.igx-nav-drawer-item--active:hover igx-icon{color:var(--item-active-icon-color)}.igx-nav-drawer-item--header{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)}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-nav-drawer{--aside-padding: 0;--item-padding: .625rem .5rem;--item-gap: .5rem;--item-min-height: 2.75rem}.igx-nav-drawer__aside{border:.0625rem solid var(--border-color)}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-nav-drawer-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)}.igx-nav-drawer-item--active{color:var(--item-active-text-color);background:var(--item-active-background)}.igx-nav-drawer-item--active igx-icon{color:var(--item-active-icon-color)}.igx-nav-drawer-item--active:focus,.igx-nav-drawer-item--active:hover{color:var(--item-active-text-color);background:var(--item-active-background)}.igx-nav-drawer-item--active:focus igx-icon,.igx-nav-drawer-item--active:hover igx-icon{color:var(--item-active-icon-color)}.igx-nav-drawer-item--header{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)}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-nav-drawer{--aside-padding: .5rem;--item-padding: .5rem 1rem;--item-gap: 1rem;--item-min-height: 2rem;--item-mini-width: 2rem;--item-margin: .25rem}.igx-nav-drawer__aside--mini [igxDrawerItem]{margin:var(--item-margin) auto}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-nav-drawer-item{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-block-end:var(--item-margin)}.igx-nav-drawer-item igx-icon{--component-size: 2}.igx-nav-drawer-item--active{color:var(--item-active-text-color);background:var(--item-active-background)}.igx-nav-drawer-item--active igx-icon{color:var(--item-active-icon-color)}.igx-nav-drawer-item--active:focus,.igx-nav-drawer-item--active:hover{color:var(--item-active-text-color);background:var(--item-active-background)}.igx-nav-drawer-item--active:focus igx-icon,.igx-nav-drawer-item--active:hover igx-icon{color:var(--item-active-icon-color)}.igx-nav-drawer-item--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);margin-block-end:var(--item-margin)}}}\n"] }]
         }], ctorParameters: () => [], propDecorators: { cssClass: [{
@@ -1002,11 +1002,11 @@ const IGX_NAVIGATION_DRAWER_DIRECTIVES = [
  * @hidden
  */
 class IgxNavigationDrawerModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxNavigationDrawerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.1", ngImport: i0, type: IgxNavigationDrawerModule, imports: [IgxNavigationDrawerComponent, IgxNavDrawerItemDirective, IgxNavDrawerMiniTemplateDirective, IgxNavDrawerTemplateDirective], exports: [IgxNavigationDrawerComponent, IgxNavDrawerItemDirective, IgxNavDrawerMiniTemplateDirective, IgxNavDrawerTemplateDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxNavigationDrawerModule }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxNavigationDrawerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.7", ngImport: i0, type: IgxNavigationDrawerModule, imports: [IgxNavigationDrawerComponent, IgxNavDrawerItemDirective, IgxNavDrawerMiniTemplateDirective, IgxNavDrawerTemplateDirective], exports: [IgxNavigationDrawerComponent, IgxNavDrawerItemDirective, IgxNavDrawerMiniTemplateDirective, IgxNavDrawerTemplateDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxNavigationDrawerModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxNavigationDrawerModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxNavigationDrawerModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [

package/fesm2022/igniteui-angular-paginator.mjs

@@ -11,10 +11,10 @@ class IgxPaginatorDirective {
     constructor() {
         this.template = inject(TemplateRef);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxPaginatorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.1", type: IgxPaginatorDirective, isStandalone: true, selector: "[igxPaginator]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxPaginatorDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: IgxPaginatorDirective, isStandalone: true, selector: "[igxPaginator]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxPaginatorDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxPaginatorDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[igxPaginator]',
@@ -34,10 +34,10 @@ class IgxPaginatorContentDirective {
          */
         this.cssClass = 'igx-paginator-content';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxPaginatorContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.1", type: IgxPaginatorContentDirective, isStandalone: true, selector: "[igxPaginatorContent],igx-paginator-content", host: { properties: { "class.igx-paginator-content": "this.cssClass" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxPaginatorContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: IgxPaginatorContentDirective, isStandalone: true, selector: "[igxPaginatorContent],igx-paginator-content", host: { properties: { "class.igx-paginator-content": "this.cssClass" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxPaginatorContentDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxPaginatorContentDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[igxPaginatorContent],igx-paginator-content',
@@ -324,12 +324,12 @@ class IgxPaginatorComponent {
     sortUniqueOptions(values, newOption) {
         return Array.from(new Set([...values, newOption])).sort((a, b) => a - b);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxPaginatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: IgxPaginatorComponent, isStandalone: true, selector: "igx-paginator", inputs: { page: "page", perPage: "perPage", totalRecords: "totalRecords", selectOptions: "selectOptions", overlaySettings: "overlaySettings", resourceStrings: "resourceStrings" }, outputs: { perPageChange: "perPageChange", pageChange: "pageChange", paging: "paging", pagingDone: "pagingDone" }, host: { properties: { "class.igx-paginator": "this.cssClass" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxPaginatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: IgxPaginatorComponent, isStandalone: true, selector: "igx-paginator", inputs: { page: "page", perPage: "perPage", totalRecords: "totalRecords", selectOptions: "selectOptions", overlaySettings: "overlaySettings", resourceStrings: "resourceStrings" }, outputs: { perPageChange: "perPageChange", pageChange: "pageChange", paging: "paging", pagingDone: "pagingDone" }, host: { properties: { "class.igx-paginator": "this.cssClass" } }, providers: [
             { provide: IgxPaginatorToken, useExisting: IgxPaginatorComponent }
         ], queries: [{ propertyName: "customContent", first: true, predicate: IgxPaginatorContentDirective, descendants: true }], ngImport: i0, template: "<ng-content select=\"[igxPaginatorContent],igx-paginator-content\"></ng-content>\n\n@if (!customContent) {\n    <igx-page-size></igx-page-size>\n}\n@if (!customContent) {\n    <igx-page-nav></igx-page-nav>\n}\n", styles: ["@layer ig.base{.igx-paginator{--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(--ig-size-large));display:flex;justify-content:space-between;align-items:center;color:var(--foreground);background:var(--background);font-size:.75rem;border-top:.0625rem solid var(--border-color);z-index:1;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(1rem,-1 * 1rem)*var(--ig-spacing-inline-medium, var(--ig-spacing-inline, var(--ig-spacing))),var(--is-small, 1)*max(.75rem,-1 * .75rem)*var(--ig-spacing-inline-small, var(--ig-spacing-inline, var(--ig-spacing))));padding-block:0;height:var(--size);width:100%}.igx-paginator:empty{padding:0}.igx-page-nav{display:flex;justify-content:flex-end;align-items:center;flex:1}.igx-page-nav>*{margin-inline-start:.5rem}[dir=rtl] .igx-page-nav igx-icon{transform:scaleX(-1)}.igx-page-nav__text{display:flex}.igx-page-size{display:flex;justify-content:flex-start;align-items:center;flex:1}.igx-page-size__label{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;margin-inline-end:.5rem}.igx-page-size__select{display:flex;max-width:7.125rem;min-width:6.25rem}.igx-page-size__select igx-select{--ig-size: 1}.igx-paginator-content{display:flex;align-items:center;justify-content:space-between;width:100%}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-paginator{font-size:.6875rem;font-weight:400;line-height:.9375rem}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-page-size__select igx-select{--ig-size: inherit}}}\n"], dependencies: [{ kind: "component", type: i0.forwardRef(() => IgxPageSizeSelectorComponent), selector: "igx-page-size", inputs: ["id"] }, { kind: "component", type: i0.forwardRef(() => IgxPageNavigationComponent), selector: "igx-page-nav", inputs: ["role"] }], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxPaginatorComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxPaginatorComponent, decorators: [{
             type: Component,
             args: [{ selector: 'igx-paginator', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.Eager, imports: [forwardRef(() => IgxPageSizeSelectorComponent), forwardRef(() => IgxPageNavigationComponent)], providers: [
                         { provide: IgxPaginatorToken, useExisting: IgxPaginatorComponent }
@@ -375,10 +375,10 @@ class IgxPageSizeSelectorComponent {
     get labelId() {
         return `${this.id}-label`;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxPageSizeSelectorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: IgxPageSizeSelectorComponent, isStandalone: true, selector: "igx-page-size", inputs: { id: "id" }, host: { properties: { "class.igx-page-size": "this.cssClass", "attr.id": "this.id" } }, ngImport: i0, template: "<label [id]=\"labelId\" class=\"igx-page-size__label\">{{ paginator.resourceStrings.igx_paginator_label }}</label>\n<div class=\"igx-page-size__select\">\n    <igx-select [labelledBy]=\"labelId\" [overlaySettings]=\"paginator.overlaySettings\" [(ngModel)]=\"paginator.perPage\" type=\"border\">\n        @for (val of paginator.selectOptions; track val) {\n            <igx-select-item [value]=\"val\">\n                {{ val }}\n            </igx-select-item>\n        }\n    </igx-select>\n</div>\n", dependencies: [{ kind: "component", type: IgxSelectComponent, selector: "igx-select", inputs: ["placeholder", "disabled", "overlaySettings", "value", "type"], outputs: ["opening", "opened", "closing", "closed"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: IgxSelectItemComponent, selector: "igx-select-item", inputs: ["text"] }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxPageSizeSelectorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: IgxPageSizeSelectorComponent, isStandalone: true, selector: "igx-page-size", inputs: { id: "id" }, host: { properties: { "class.igx-page-size": "this.cssClass", "attr.id": "this.id" } }, ngImport: i0, template: "<label [id]=\"labelId\" class=\"igx-page-size__label\">{{ paginator.resourceStrings.igx_paginator_label }}</label>\n<div class=\"igx-page-size__select\">\n    <igx-select [labelledBy]=\"labelId\" [overlaySettings]=\"paginator.overlaySettings\" [(ngModel)]=\"paginator.perPage\" type=\"border\">\n        @for (val of paginator.selectOptions; track val) {\n            <igx-select-item [value]=\"val\">\n                {{ val }}\n            </igx-select-item>\n        }\n    </igx-select>\n</div>\n", dependencies: [{ kind: "component", type: IgxSelectComponent, selector: "igx-select", inputs: ["placeholder", "disabled", "overlaySettings", "value", "type"], outputs: ["opening", "opened", "closing", "closed"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: IgxSelectItemComponent, selector: "igx-select-item", inputs: ["text"] }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxPageSizeSelectorComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxPageSizeSelectorComponent, decorators: [{
             type: Component,
             args: [{ selector: 'igx-page-size', changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxSelectComponent, FormsModule, IgxSelectItemComponent], template: "<label [id]=\"labelId\" class=\"igx-page-size__label\">{{ paginator.resourceStrings.igx_paginator_label }}</label>\n<div class=\"igx-page-size__select\">\n    <igx-select [labelledBy]=\"labelId\" [overlaySettings]=\"paginator.overlaySettings\" [(ngModel)]=\"paginator.perPage\" type=\"border\">\n        @for (val of paginator.selectOptions; track val) {\n            <igx-select-item [value]=\"val\">\n                {{ val }}\n            </igx-select-item>\n        }\n    </igx-select>\n</div>\n" }]
         }], propDecorators: { cssClass: [{
@@ -403,10 +403,10 @@ class IgxPageNavigationComponent {
          */
         this.role = 'navigation';
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxPageNavigationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.1", type: IgxPageNavigationComponent, isStandalone: true, selector: "igx-page-nav", inputs: { role: "role" }, host: { properties: { "class.igx-page-nav": "this.cssClass", "attr.role": "this.role" } }, ngImport: i0, template: "<button\n    [title]=\"paginator.resourceStrings.igx_paginator_first_page_button_text\"\n    [attr.aria-label]=\"paginator.resourceStrings.igx_paginator_first_page_button_text\"\n    [disabled]=\"paginator.isFirstPage\"\n    [attr.aria-disabled]=\"paginator.isFirstPage\"\n    (click)=\"paginator.paginate(0)\"\n    igxIconButton=\"flat\"\n    igxRipple\n    [igxRippleCentered]=\"true\"\n    type=\"button\"\n>\n    <igx-icon family=\"default\" name=\"first_page\"></igx-icon>\n</button>\n<button\n    [title]=\"paginator.resourceStrings.igx_paginator_previous_page_button_text\"\n    [attr.aria-label]=\"paginator.resourceStrings.igx_paginator_previous_page_button_text\"\n    [disabled]=\"paginator.isFirstPage\"\n    [attr.aria-disabled]=\"paginator.isFirstPage\"\n    (click)=\"paginator.previousPage()\"\n    igxIconButton=\"flat\"\n    igxRipple\n    [igxRippleCentered]=\"true\"\n    type=\"button\"\n>\n    <igx-icon family=\"default\" name=\"prev\"></igx-icon>\n</button>\n<div class=\"igx-page-nav__text\" aria-current=\"page\">\n    <span>{{ paginator.page + 1 }}</span>\n    <span\n        >&nbsp;{{\n            paginator.resourceStrings.igx_paginator_pager_text\n        }}&nbsp;</span\n    >\n    <span>{{ paginator.totalPages || 1 }}</span>\n</div>\n<button\n    [title]=\"paginator.resourceStrings.igx_paginator_next_page_button_text\"\n    [attr.aria-label]=\"paginator.resourceStrings.igx_paginator_next_page_button_text\"\n    [disabled]=\"paginator.isLastPage\"\n    [attr.aria-disabled]=\"paginator.isLastPage\"\n    (click)=\"paginator.nextPage()\"\n    igxRipple\n    [igxRippleCentered]=\"true\"\n    igxIconButton=\"flat\"\n    type=\"button\"\n>\n    <igx-icon family=\"default\" name=\"next\"></igx-icon>\n</button>\n<button\n    [title]=\"paginator.resourceStrings.igx_paginator_last_page_button_text\"\n    [attr.aria-label]=\"paginator.resourceStrings.igx_paginator_last_page_button_text\"\n    [disabled]=\"paginator.isLastPage\"\n    [attr.aria-disabled]=\"paginator.isLastPage\"\n    (click)=\"paginator.paginate(paginator.totalPages - 1)\"\n    igxIconButton=\"flat\"\n    igxRipple\n    [igxRippleCentered]=\"true\"\n    type=\"button\"\n>\n    <igx-icon family=\"default\" name=\"last_page\"></igx-icon>\n</button>\n\n", dependencies: [{ kind: "directive", type: IgxRippleDirective, selector: "[igxRipple]", inputs: ["igxRippleTarget", "igxRipple", "igxRippleDuration", "igxRippleCentered", "igxRippleDisabled"] }, { kind: "component", type: IgxIconComponent, selector: "igx-icon", inputs: ["ariaHidden", "family", "name", "active"] }, { kind: "directive", type: IgxIconButtonDirective, selector: "[igxIconButton]", inputs: ["igxIconButton"] }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxPageNavigationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.7", type: IgxPageNavigationComponent, isStandalone: true, selector: "igx-page-nav", inputs: { role: "role" }, host: { properties: { "class.igx-page-nav": "this.cssClass", "attr.role": "this.role" } }, ngImport: i0, template: "<button\n    [title]=\"paginator.resourceStrings.igx_paginator_first_page_button_text\"\n    [attr.aria-label]=\"paginator.resourceStrings.igx_paginator_first_page_button_text\"\n    [disabled]=\"paginator.isFirstPage\"\n    [attr.aria-disabled]=\"paginator.isFirstPage\"\n    (click)=\"paginator.paginate(0)\"\n    igxIconButton=\"flat\"\n    igxRipple\n    [igxRippleCentered]=\"true\"\n    type=\"button\"\n>\n    <igx-icon family=\"default\" name=\"first_page\"></igx-icon>\n</button>\n<button\n    [title]=\"paginator.resourceStrings.igx_paginator_previous_page_button_text\"\n    [attr.aria-label]=\"paginator.resourceStrings.igx_paginator_previous_page_button_text\"\n    [disabled]=\"paginator.isFirstPage\"\n    [attr.aria-disabled]=\"paginator.isFirstPage\"\n    (click)=\"paginator.previousPage()\"\n    igxIconButton=\"flat\"\n    igxRipple\n    [igxRippleCentered]=\"true\"\n    type=\"button\"\n>\n    <igx-icon family=\"default\" name=\"prev\"></igx-icon>\n</button>\n<div class=\"igx-page-nav__text\" aria-current=\"page\">\n    <span>{{ paginator.page + 1 }}</span>\n    <span\n        >&nbsp;{{\n            paginator.resourceStrings.igx_paginator_pager_text\n        }}&nbsp;</span\n    >\n    <span>{{ paginator.totalPages || 1 }}</span>\n</div>\n<button\n    [title]=\"paginator.resourceStrings.igx_paginator_next_page_button_text\"\n    [attr.aria-label]=\"paginator.resourceStrings.igx_paginator_next_page_button_text\"\n    [disabled]=\"paginator.isLastPage\"\n    [attr.aria-disabled]=\"paginator.isLastPage\"\n    (click)=\"paginator.nextPage()\"\n    igxRipple\n    [igxRippleCentered]=\"true\"\n    igxIconButton=\"flat\"\n    type=\"button\"\n>\n    <igx-icon family=\"default\" name=\"next\"></igx-icon>\n</button>\n<button\n    [title]=\"paginator.resourceStrings.igx_paginator_last_page_button_text\"\n    [attr.aria-label]=\"paginator.resourceStrings.igx_paginator_last_page_button_text\"\n    [disabled]=\"paginator.isLastPage\"\n    [attr.aria-disabled]=\"paginator.isLastPage\"\n    (click)=\"paginator.paginate(paginator.totalPages - 1)\"\n    igxIconButton=\"flat\"\n    igxRipple\n    [igxRippleCentered]=\"true\"\n    type=\"button\"\n>\n    <igx-icon family=\"default\" name=\"last_page\"></igx-icon>\n</button>\n\n", dependencies: [{ kind: "directive", type: IgxRippleDirective, selector: "[igxRipple]", inputs: ["igxRippleTarget", "igxRipple", "igxRippleDuration", "igxRippleCentered", "igxRippleDisabled"] }, { kind: "component", type: IgxIconComponent, selector: "igx-icon", inputs: ["ariaHidden", "family", "name", "active"] }, { kind: "directive", type: IgxIconButtonDirective, selector: "[igxIconButton]", inputs: ["igxIconButton"] }], changeDetection: i0.ChangeDetectionStrategy.Eager }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxPageNavigationComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxPageNavigationComponent, decorators: [{
             type: Component,
             args: [{ selector: 'igx-page-nav', changeDetection: ChangeDetectionStrategy.Eager, imports: [IgxRippleDirective, IgxIconComponent, IgxIconButtonDirective], template: "<button\n    [title]=\"paginator.resourceStrings.igx_paginator_first_page_button_text\"\n    [attr.aria-label]=\"paginator.resourceStrings.igx_paginator_first_page_button_text\"\n    [disabled]=\"paginator.isFirstPage\"\n    [attr.aria-disabled]=\"paginator.isFirstPage\"\n    (click)=\"paginator.paginate(0)\"\n    igxIconButton=\"flat\"\n    igxRipple\n    [igxRippleCentered]=\"true\"\n    type=\"button\"\n>\n    <igx-icon family=\"default\" name=\"first_page\"></igx-icon>\n</button>\n<button\n    [title]=\"paginator.resourceStrings.igx_paginator_previous_page_button_text\"\n    [attr.aria-label]=\"paginator.resourceStrings.igx_paginator_previous_page_button_text\"\n    [disabled]=\"paginator.isFirstPage\"\n    [attr.aria-disabled]=\"paginator.isFirstPage\"\n    (click)=\"paginator.previousPage()\"\n    igxIconButton=\"flat\"\n    igxRipple\n    [igxRippleCentered]=\"true\"\n    type=\"button\"\n>\n    <igx-icon family=\"default\" name=\"prev\"></igx-icon>\n</button>\n<div class=\"igx-page-nav__text\" aria-current=\"page\">\n    <span>{{ paginator.page + 1 }}</span>\n    <span\n        >&nbsp;{{\n            paginator.resourceStrings.igx_paginator_pager_text\n        }}&nbsp;</span\n    >\n    <span>{{ paginator.totalPages || 1 }}</span>\n</div>\n<button\n    [title]=\"paginator.resourceStrings.igx_paginator_next_page_button_text\"\n    [attr.aria-label]=\"paginator.resourceStrings.igx_paginator_next_page_button_text\"\n    [disabled]=\"paginator.isLastPage\"\n    [attr.aria-disabled]=\"paginator.isLastPage\"\n    (click)=\"paginator.nextPage()\"\n    igxRipple\n    [igxRippleCentered]=\"true\"\n    igxIconButton=\"flat\"\n    type=\"button\"\n>\n    <igx-icon family=\"default\" name=\"next\"></igx-icon>\n</button>\n<button\n    [title]=\"paginator.resourceStrings.igx_paginator_last_page_button_text\"\n    [attr.aria-label]=\"paginator.resourceStrings.igx_paginator_last_page_button_text\"\n    [disabled]=\"paginator.isLastPage\"\n    [attr.aria-disabled]=\"paginator.isLastPage\"\n    (click)=\"paginator.paginate(paginator.totalPages - 1)\"\n    igxIconButton=\"flat\"\n    igxRipple\n    [igxRippleCentered]=\"true\"\n    type=\"button\"\n>\n    <igx-icon family=\"default\" name=\"last_page\"></igx-icon>\n</button>\n\n" }]
         }], propDecorators: { cssClass: [{
@@ -433,11 +433,11 @@ const IGX_PAGINATOR_DIRECTIVES = [
  * IMPORTANT: The following is NgModule exported for backwards-compatibility before standalone components
  */
 class IgxPaginatorModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxPaginatorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.1", ngImport: i0, type: IgxPaginatorModule, imports: [IgxPaginatorComponent, IgxPageNavigationComponent, IgxPageSizeSelectorComponent, IgxPaginatorContentDirective, IgxPaginatorDirective], exports: [IgxPaginatorComponent, IgxPageNavigationComponent, IgxPageSizeSelectorComponent, IgxPaginatorContentDirective, IgxPaginatorDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxPaginatorModule, imports: [IgxPaginatorComponent, IgxPageNavigationComponent, IgxPageSizeSelectorComponent] }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxPaginatorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.7", ngImport: i0, type: IgxPaginatorModule, imports: [IgxPaginatorComponent, IgxPageNavigationComponent, IgxPageSizeSelectorComponent, IgxPaginatorContentDirective, IgxPaginatorDirective], exports: [IgxPaginatorComponent, IgxPageNavigationComponent, IgxPageSizeSelectorComponent, IgxPaginatorContentDirective, IgxPaginatorDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxPaginatorModule, imports: [IgxPaginatorComponent, IgxPageNavigationComponent, IgxPageSizeSelectorComponent] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxPaginatorModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxPaginatorModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [

package/fesm2022/igniteui-angular-progressbar.mjs

@@ -6,10 +6,10 @@ class IgxProgressBarTextTemplateDirective {
     constructor() {
         this.template = inject(TemplateRef);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxProgressBarTextTemplateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.1", type: IgxProgressBarTextTemplateDirective, isStandalone: true, selector: "[igxProgressBarText]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxProgressBarTextTemplateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: IgxProgressBarTextTemplateDirective, isStandalone: true, selector: "[igxProgressBarText]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxProgressBarTextTemplateDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxProgressBarTextTemplateDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[igxProgressBarText]',
@@ -20,10 +20,10 @@ class IgxProgressBarGradientDirective {
     constructor() {
         this.template = inject(TemplateRef);
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxProgressBarGradientDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.1", type: IgxProgressBarGradientDirective, isStandalone: true, selector: "[igxProgressBarGradient]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxProgressBarGradientDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: IgxProgressBarGradientDirective, isStandalone: true, selector: "[igxProgressBarGradient]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxProgressBarGradientDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxProgressBarGradientDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[igxProgressBarGradient]',
@@ -313,10 +313,10 @@ class BaseProgressDirective {
             currentValue: this._value,
         });
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: BaseProgressDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "22.1.1", type: BaseProgressDirective, isStandalone: true, inputs: { animationDuration: "animationDuration", indeterminate: ["indeterminate", "indeterminate", booleanAttribute], step: "step", text: "text", animate: ["animate", "animate", booleanAttribute], max: "max", value: "value" }, outputs: { progressChanged: "progressChanged" }, host: { properties: { "attr.aria-valuemax": "this.max", "style.--_progress-integer": "this.progressInteger", "style.--_progress-fraction": "this.progressFraction", "style.--_progress-whole": "this.progressWhole", "style.--_transition-duration": "this.transitionDuration", "attr.aria-valuenow": "this.value" } }, ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: BaseProgressDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "22.1.7", type: BaseProgressDirective, isStandalone: true, inputs: { animationDuration: "animationDuration", indeterminate: ["indeterminate", "indeterminate", booleanAttribute], step: "step", text: "text", animate: ["animate", "animate", booleanAttribute], max: "max", value: "value" }, outputs: { progressChanged: "progressChanged" }, host: { properties: { "attr.aria-valuemax": "this.max", "style.--_progress-integer": "this.progressInteger", "style.--_progress-fraction": "this.progressFraction", "style.--_progress-whole": "this.progressWhole", "style.--_transition-duration": "this.transitionDuration", "attr.aria-valuenow": "this.value" } }, ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: BaseProgressDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: BaseProgressDirective, decorators: [{
             type: Directive
         }], propDecorators: { progressChanged: [{
                 type: Output
@@ -467,10 +467,10 @@ class IgxLinearProgressBarComponent extends BaseProgressDirective {
     ngAfterContentInit() {
         this._contentInit = true;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxLinearProgressBarComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "22.1.1", type: IgxLinearProgressBarComponent, isStandalone: true, selector: "igx-linear-bar", inputs: { striped: ["striped", "striped", booleanAttribute], role: "role", id: "id", textAlign: "textAlign", textVisibility: ["textVisibility", "textVisibility", booleanAttribute], textTop: ["textTop", "textTop", booleanAttribute], type: "type" }, host: { properties: { "attr.aria-valuemin": "this.valueMin", "class.igx-linear-bar": "this.cssClass", "class.igx-linear-bar--striped": "this.striped", "class.igx-linear-bar--indeterminate": "this.isIndeterminate", "attr.role": "this.role", "attr.id": "this.id", "class.igx-linear-bar--animation-none": "this.disableAnimationClass", "class.igx-linear-bar--hide-counter": "this.hasText", "class.igx-linear-bar--danger": "this.error", "class.igx-linear-bar--info": "this.info", "class.igx-linear-bar--warning": "this.warning", "class.igx-linear-bar--success": "this.success" } }, usesInheritance: true, ngImport: i0, template: "<div class=\"igx-linear-bar__base\">\n    <div class=\"igx-linear-bar__indicator\"></div>\n    <div class=\"igx-linear-bar__indicator-secondary\"></div>\n</div>\n<span\n    class=\"igx-linear-bar__value\"\n    [ngClass]=\"{\n    'igx-linear-bar__value--start': textAlign === 'start',\n    'igx-linear-bar__value--center': textAlign === 'center',\n    'igx-linear-bar__value--end': textAlign === 'end',\n    'igx-linear-bar__value--top': textTop,\n    'igx-linear-bar__value--hidden': !textVisibility,\n    'igx-linear-bar__value--fraction': hasFraction\n}\">\n    {{text}}\n</span>\n\n", styles: ["@keyframes igx-indeterminate-primary{0%{transform:translate(0)}20%{animation-timing-function:cubic-bezier(.5,0,.7017,.4958);transform:translate(0)}59.15%{animation-timing-function:cubic-bezier(.3024,.3813,.55,.9563);transform:translate(83.671%)}to{transform:translate(200.611%)}}@keyframes igx-indeterminate-primary-scale{0%{transform:scaleX(.08)}36.65%{animation-timing-function:cubic-bezier(.3347,.124,.7858,1);transform:scaleX(.08)}69.15%{animation-timing-function:cubic-bezier(.06,.11,.6,1);transform:scaleX(.6614)}to{transform:scaleX(.08)}}@keyframes igx-indeterminate-secondary{0%{animation-timing-function:cubic-bezier(.15,0,.515,.4096);transform:translate(0)}25%{animation-timing-function:cubic-bezier(.31,.284,.8,.7337);transform:translate(37.6519%)}48.35%{animation-timing-function:cubic-bezier(.4,.627,.6,.902);transform:translate(84.3861%)}to{transform:translate(160.2777%)}}@keyframes igx-indeterminate-secondary-scale{0%{animation-timing-function:cubic-bezier(.15,0,.515,.4096);transform:scaleX(.08)}19.15%{animation-timing-function:cubic-bezier(.31,.284,.8,.7337);transform:scaleX(.4571)}44.15%{animation-timing-function:cubic-bezier(.4,.627,.6,.902);transform:scaleX(.727)}to{transform:scaleX(.08)}}@keyframes igx-indeterminate-bar-fluent{0%{transform:translate(-100%);transform-origin:left}to{transform:translate(310%);transform-origin:right}}@keyframes igx-indeterminate-bar-fluent-rtl{0%{transform:translate(100%);transform-origin:right}to{transform:translate(-310%);transform-origin:left}}@keyframes igx-initial-width{0%{width:0}to{width:calc(var(--_progress-whole, 0)*1%)}}@layer ig.base{.igx-linear-bar:not(.igx-linear-bar--indeterminate) .igx-linear-bar__indicator{animation:igx-initial-width var(--_transition-duration) linear;background-color:var(--fill-color-default)}.igx-linear-bar{position:relative;display:flex;width:100%;flex:1 1 100%;flex-direction:column}.igx-linear-bar__base{--stripe-size: var(--strip-size);--linear-animation-duration: 2s;display:flex;flex-direction:column;position:relative;width:inherit;height:var(--track-height);background:var(--track-color);overflow:hidden;border-radius:var(--track-border-radius);z-index:0}.igx-linear-bar__indicator{width:calc(var(--_progress-whole)*1%);position:absolute;height:100%;transition:width var(--_transition-duration) linear}.igx-linear-bar__value{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;color:var(--text-color);animation:initial-counter var(--_transition-duration) ease-in-out;counter-reset:progress-integer round(down,var(--_progress-integer, 0),1) progress-fraction round(down,var(--_progress-fraction, 0),1);transition:--_progress-integer var(--_transition-duration) ease-in-out,--_progress-fraction var(--_transition-duration) ease-in-out}.igx-linear-bar__value--start{align-self:flex-start}.igx-linear-bar__value--center{align-self:center}.igx-linear-bar__value--end{align-self:flex-end}.igx-linear-bar__value--top{order:-1}.igx-linear-bar__value--hidden{display:none}.igx-linear-bar__value--fraction:before{content:counter(progress-integer) \".\" counter(progress-fraction,decimal-leading-zero) \"%\"}.igx-linear-bar__value:not(.igx-linear-bar__value--fraction):before{content:counter(progress-integer) \"%\"}.igx-linear-bar--danger:not(.igx-linear-bar--indeterminate) .igx-linear-bar__indicator{background-color:var(--fill-color-danger)}.igx-linear-bar--danger:not(.igx-linear-bar--indeterminate) .igx-linear-bar__indicator-secondary{background-color:var(--fill-color-danger)}.igx-linear-bar--danger .igx-linear-bar__indicator:after{background-color:var(--fill-color-danger)}.igx-linear-bar--danger .igx-linear-bar__indicator-secondary:after{background-color:var(--fill-color-danger)}.igx-linear-bar--warning:not(.igx-linear-bar--indeterminate) .igx-linear-bar__indicator{background-color:var(--fill-color-warning)}.igx-linear-bar--warning:not(.igx-linear-bar--indeterminate) .igx-linear-bar__indicator-secondary{background-color:var(--fill-color-warning)}.igx-linear-bar--warning .igx-linear-bar__indicator:after{background-color:var(--fill-color-warning)}.igx-linear-bar--warning .igx-linear-bar__indicator-secondary:after{background-color:var(--fill-color-warning)}.igx-linear-bar--info:not(.igx-linear-bar--indeterminate) .igx-linear-bar__indicator{background-color:var(--fill-color-info)}.igx-linear-bar--info:not(.igx-linear-bar--indeterminate) .igx-linear-bar__indicator-secondary{background-color:var(--fill-color-info)}.igx-linear-bar--info .igx-linear-bar__indicator:after{background-color:var(--fill-color-info)}.igx-linear-bar--info .igx-linear-bar__indicator-secondary:after{background-color:var(--fill-color-info)}.igx-linear-bar--success:not(.igx-linear-bar--indeterminate) .igx-linear-bar__indicator{background-color:var(--fill-color-success)}.igx-linear-bar--success:not(.igx-linear-bar--indeterminate) .igx-linear-bar__indicator-secondary{background-color:var(--fill-color-success)}.igx-linear-bar--success .igx-linear-bar__indicator:after{background-color:var(--fill-color-success)}.igx-linear-bar--success .igx-linear-bar__indicator-secondary:after{background-color:var(--fill-color-success)}.igx-linear-bar--indeterminate:not(.igx-linear-bar--danger,.igx-linear-bar--warning,.igx-linear-bar--info,.igx-linear-bar--success) .igx-linear-bar__indicator:after{background-color:var(--fill-color-default)}.igx-linear-bar--indeterminate:not(.igx-linear-bar--danger,.igx-linear-bar--warning,.igx-linear-bar--info,.igx-linear-bar--success) .igx-linear-bar__indicator-secondary:after{background-color:var(--fill-color-default)}.igx-linear-bar--striped:not(.igx-linear-bar--indeterminate){--linear-strips-orientation: -45deg}.igx-linear-bar--striped:not(.igx-linear-bar--indeterminate):dir(rtl){--linear-strips-orientation: 45deg }.igx-linear-bar--striped:not(.igx-linear-bar--indeterminate) .igx-linear-bar__indicator{background-image:repeating-linear-gradient(var(--linear-strips-orientation),transparent,transparent var(--stripe-size),var(--stripes-color) var(--stripe-size),var(--stripes-color) calc(var(--stripe-size) * 2))}.igx-linear-bar--indeterminate .igx-linear-bar__indicator{animation-name:igx-indeterminate-bar-fluent-rtl}.igx-linear-bar--indeterminate .igx-linear-bar__indicator-secondary{animation:igx-indeterminate-secondary var(--linear-animation-duration) infinite linear;left:-54.8888%}.igx-linear-bar--indeterminate .igx-linear-bar__indicator-secondary:after{animation:igx-indeterminate-secondary-scale var(--linear-animation-duration) infinite linear;width:100%;height:inherit}.igx-linear-bar--indeterminate .igx-linear-bar__value{display:none}.igx-linear-bar--animation-none:not(.igx-linear-bar--indeterminate){--_transition-duration: 0s !important}.igx-linear-bar--hide-counter .igx-linear-bar__value:before{display:none}}@layer ig.material{@container style(--ig-theme: material){.igx-linear-bar--indeterminate:dir(rtl) .igx-linear-bar__base{transform:rotateY(180deg)}.igx-linear-bar--indeterminate .igx-linear-bar__indicator{transform-origin:top left;width:100%!important;height:inherit;position:absolute;transform:scale3d(0,1,1);animation:igx-indeterminate-primary var(--linear-animation-duration) infinite linear;left:-145.1666%}.igx-linear-bar--indeterminate .igx-linear-bar__indicator:after{content:\"\";position:absolute;top:0;inset-inline-start:0;width:inherit;height:inherit;backface-visibility:hidden;animation:igx-indeterminate-primary-scale var(--linear-animation-duration) infinite linear}.igx-linear-bar--indeterminate .igx-linear-bar__indicator-secondary{transform-origin:top left;width:100%!important;height:inherit;position:absolute}.igx-linear-bar--indeterminate .igx-linear-bar__indicator-secondary:after{content:\"\";position:absolute;top:0;inset-inline-start:0;width:inherit;height:inherit;backface-visibility:hidden}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-linear-bar--indeterminate:dir(rtl) .igx-linear-bar__base{transform:rotateY(180deg)}.igx-linear-bar--indeterminate .igx-linear-bar__indicator{transform-origin:top left;width:100%!important;height:inherit;position:absolute;transform:scale3d(0,1,1);animation:igx-indeterminate-primary var(--linear-animation-duration) infinite linear;left:-145.1666%}.igx-linear-bar--indeterminate .igx-linear-bar__indicator:after{content:\"\";position:absolute;top:0;inset-inline-start:0;width:inherit;height:inherit;backface-visibility:hidden;animation:igx-indeterminate-primary-scale var(--linear-animation-duration) infinite linear}.igx-linear-bar--indeterminate .igx-linear-bar__indicator-secondary{transform-origin:top left;width:100%!important;height:inherit;position:absolute}.igx-linear-bar--indeterminate .igx-linear-bar__indicator-secondary:after{content:\"\";position:absolute;top:0;inset-inline-start:0;width:inherit;height:inherit;backface-visibility:hidden}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-linear-bar{gap:.125rem}.igx-linear-bar--indeterminate .igx-linear-bar__indicator{background:linear-gradient(90deg,transparent 0%,var(--fill-color-default) 50%,transparent 100%);width:33%!important;min-width:33%;animation-name:igx-indeterminate-bar-fluent;animation-duration:var(--linear-animation-duration);animation-timing-function:ease;animation-iteration-count:infinite;left:auto}.igx-linear-bar--indeterminate:dir(rtl) .igx-linear-bar__indicator{animation-name:igx-indeterminate-bar-fluent-rtl}.igx-linear-bar--indeterminate .igx-linear-bar__indicator-secondary{display:none}.igx-linear-bar--danger.igx-linear-bar--indeterminate .igx-linear-bar__indicator{background:linear-gradient(90deg,transparent 0%,var(--fill-color-danger) 50%,transparent 100%)}.igx-linear-bar--warning.igx-linear-bar--indeterminate .igx-linear-bar__indicator{background:linear-gradient(90deg,transparent 0%,var(--fill-color-warning) 50%,transparent 100%)}.igx-linear-bar--info.igx-linear-bar--indeterminate .igx-linear-bar__indicator{background:linear-gradient(90deg,transparent 0%,var(--fill-color-info) 50%,transparent 100%)}.igx-linear-bar--success.igx-linear-bar--indeterminate .igx-linear-bar__indicator{background:linear-gradient(90deg,transparent 0%,var(--fill-color-success) 50%,transparent 100%)}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-linear-bar{gap:.25rem}.igx-linear-bar--indeterminate:dir(rtl) .igx-linear-bar__base{transform:rotateY(180deg)}.igx-linear-bar--indeterminate .igx-linear-bar__indicator{transform-origin:top left;width:100%!important;height:inherit;position:absolute;transform:scale3d(0,1,1);animation:igx-indeterminate-primary var(--linear-animation-duration) infinite linear;left:-145.1666%}.igx-linear-bar--indeterminate .igx-linear-bar__indicator:after{content:\"\";position:absolute;top:0;inset-inline-start:0;width:inherit;height:inherit;backface-visibility:hidden;animation:igx-indeterminate-primary-scale var(--linear-animation-duration) infinite linear}.igx-linear-bar--indeterminate .igx-linear-bar__indicator-secondary{transform-origin:top left;width:100%!important;height:inherit;position:absolute}.igx-linear-bar--indeterminate .igx-linear-bar__indicator-secondary:after{content:\"\";position:absolute;top:0;inset-inline-start:0;width:inherit;height:inherit;backface-visibility:hidden}}}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxLinearProgressBarComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "22.1.7", type: IgxLinearProgressBarComponent, isStandalone: true, selector: "igx-linear-bar", inputs: { striped: ["striped", "striped", booleanAttribute], role: "role", id: "id", textAlign: "textAlign", textVisibility: ["textVisibility", "textVisibility", booleanAttribute], textTop: ["textTop", "textTop", booleanAttribute], type: "type" }, host: { properties: { "attr.aria-valuemin": "this.valueMin", "class.igx-linear-bar": "this.cssClass", "class.igx-linear-bar--striped": "this.striped", "class.igx-linear-bar--indeterminate": "this.isIndeterminate", "attr.role": "this.role", "attr.id": "this.id", "class.igx-linear-bar--animation-none": "this.disableAnimationClass", "class.igx-linear-bar--hide-counter": "this.hasText", "class.igx-linear-bar--danger": "this.error", "class.igx-linear-bar--info": "this.info", "class.igx-linear-bar--warning": "this.warning", "class.igx-linear-bar--success": "this.success" } }, usesInheritance: true, ngImport: i0, template: "<div class=\"igx-linear-bar__base\">\n    <div class=\"igx-linear-bar__indicator\"></div>\n    <div class=\"igx-linear-bar__indicator-secondary\"></div>\n</div>\n<span\n    class=\"igx-linear-bar__value\"\n    [ngClass]=\"{\n    'igx-linear-bar__value--start': textAlign === 'start',\n    'igx-linear-bar__value--center': textAlign === 'center',\n    'igx-linear-bar__value--end': textAlign === 'end',\n    'igx-linear-bar__value--top': textTop,\n    'igx-linear-bar__value--hidden': !textVisibility,\n    'igx-linear-bar__value--fraction': hasFraction\n}\">\n    {{text}}\n</span>\n\n", styles: ["@keyframes igx-indeterminate-primary{0%{transform:translate(0)}20%{animation-timing-function:cubic-bezier(.5,0,.7017,.4958);transform:translate(0)}59.15%{animation-timing-function:cubic-bezier(.3024,.3813,.55,.9563);transform:translate(83.671%)}to{transform:translate(200.611%)}}@keyframes igx-indeterminate-primary-scale{0%{transform:scaleX(.08)}36.65%{animation-timing-function:cubic-bezier(.3347,.124,.7858,1);transform:scaleX(.08)}69.15%{animation-timing-function:cubic-bezier(.06,.11,.6,1);transform:scaleX(.6614)}to{transform:scaleX(.08)}}@keyframes igx-indeterminate-secondary{0%{animation-timing-function:cubic-bezier(.15,0,.515,.4096);transform:translate(0)}25%{animation-timing-function:cubic-bezier(.31,.284,.8,.7337);transform:translate(37.6519%)}48.35%{animation-timing-function:cubic-bezier(.4,.627,.6,.902);transform:translate(84.3861%)}to{transform:translate(160.2777%)}}@keyframes igx-indeterminate-secondary-scale{0%{animation-timing-function:cubic-bezier(.15,0,.515,.4096);transform:scaleX(.08)}19.15%{animation-timing-function:cubic-bezier(.31,.284,.8,.7337);transform:scaleX(.4571)}44.15%{animation-timing-function:cubic-bezier(.4,.627,.6,.902);transform:scaleX(.727)}to{transform:scaleX(.08)}}@keyframes igx-indeterminate-bar-fluent{0%{transform:translate(-100%);transform-origin:left}to{transform:translate(310%);transform-origin:right}}@keyframes igx-indeterminate-bar-fluent-rtl{0%{transform:translate(100%);transform-origin:right}to{transform:translate(-310%);transform-origin:left}}@keyframes igx-initial-width{0%{width:0}to{width:calc(var(--_progress-whole, 0)*1%)}}@layer ig.base{.igx-linear-bar:not(.igx-linear-bar--indeterminate) .igx-linear-bar__indicator{animation:igx-initial-width var(--_transition-duration) linear;background-color:var(--fill-color-default)}.igx-linear-bar{position:relative;display:flex;width:100%;flex:1 1 100%;flex-direction:column}.igx-linear-bar__base{--stripe-size: var(--strip-size);--linear-animation-duration: 2s;display:flex;flex-direction:column;position:relative;width:inherit;height:var(--track-height);background:var(--track-color);overflow:hidden;border-radius:var(--track-border-radius);z-index:0}.igx-linear-bar__indicator{width:calc(var(--_progress-whole)*1%);position:absolute;height:100%;transition:width var(--_transition-duration) linear}.igx-linear-bar__value{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;color:var(--text-color);animation:initial-counter var(--_transition-duration) ease-in-out;counter-reset:progress-integer round(down,var(--_progress-integer, 0),1) progress-fraction round(down,var(--_progress-fraction, 0),1);transition:--_progress-integer var(--_transition-duration) ease-in-out,--_progress-fraction var(--_transition-duration) ease-in-out}.igx-linear-bar__value--start{align-self:flex-start}.igx-linear-bar__value--center{align-self:center}.igx-linear-bar__value--end{align-self:flex-end}.igx-linear-bar__value--top{order:-1}.igx-linear-bar__value--hidden{display:none}.igx-linear-bar__value--fraction:before{content:counter(progress-integer) \".\" counter(progress-fraction,decimal-leading-zero) \"%\"}.igx-linear-bar__value:not(.igx-linear-bar__value--fraction):before{content:counter(progress-integer) \"%\"}.igx-linear-bar--danger:not(.igx-linear-bar--indeterminate) .igx-linear-bar__indicator{background-color:var(--fill-color-danger)}.igx-linear-bar--danger:not(.igx-linear-bar--indeterminate) .igx-linear-bar__indicator-secondary{background-color:var(--fill-color-danger)}.igx-linear-bar--danger .igx-linear-bar__indicator:after{background-color:var(--fill-color-danger)}.igx-linear-bar--danger .igx-linear-bar__indicator-secondary:after{background-color:var(--fill-color-danger)}.igx-linear-bar--warning:not(.igx-linear-bar--indeterminate) .igx-linear-bar__indicator{background-color:var(--fill-color-warning)}.igx-linear-bar--warning:not(.igx-linear-bar--indeterminate) .igx-linear-bar__indicator-secondary{background-color:var(--fill-color-warning)}.igx-linear-bar--warning .igx-linear-bar__indicator:after{background-color:var(--fill-color-warning)}.igx-linear-bar--warning .igx-linear-bar__indicator-secondary:after{background-color:var(--fill-color-warning)}.igx-linear-bar--info:not(.igx-linear-bar--indeterminate) .igx-linear-bar__indicator{background-color:var(--fill-color-info)}.igx-linear-bar--info:not(.igx-linear-bar--indeterminate) .igx-linear-bar__indicator-secondary{background-color:var(--fill-color-info)}.igx-linear-bar--info .igx-linear-bar__indicator:after{background-color:var(--fill-color-info)}.igx-linear-bar--info .igx-linear-bar__indicator-secondary:after{background-color:var(--fill-color-info)}.igx-linear-bar--success:not(.igx-linear-bar--indeterminate) .igx-linear-bar__indicator{background-color:var(--fill-color-success)}.igx-linear-bar--success:not(.igx-linear-bar--indeterminate) .igx-linear-bar__indicator-secondary{background-color:var(--fill-color-success)}.igx-linear-bar--success .igx-linear-bar__indicator:after{background-color:var(--fill-color-success)}.igx-linear-bar--success .igx-linear-bar__indicator-secondary:after{background-color:var(--fill-color-success)}.igx-linear-bar--indeterminate:not(.igx-linear-bar--danger,.igx-linear-bar--warning,.igx-linear-bar--info,.igx-linear-bar--success) .igx-linear-bar__indicator:after{background-color:var(--fill-color-default)}.igx-linear-bar--indeterminate:not(.igx-linear-bar--danger,.igx-linear-bar--warning,.igx-linear-bar--info,.igx-linear-bar--success) .igx-linear-bar__indicator-secondary:after{background-color:var(--fill-color-default)}.igx-linear-bar--striped:not(.igx-linear-bar--indeterminate){--linear-strips-orientation: -45deg}.igx-linear-bar--striped:not(.igx-linear-bar--indeterminate):dir(rtl){--linear-strips-orientation: 45deg }.igx-linear-bar--striped:not(.igx-linear-bar--indeterminate) .igx-linear-bar__indicator{background-image:repeating-linear-gradient(var(--linear-strips-orientation),transparent,transparent var(--stripe-size),var(--stripes-color) var(--stripe-size),var(--stripes-color) calc(var(--stripe-size) * 2))}.igx-linear-bar--indeterminate .igx-linear-bar__indicator{animation-name:igx-indeterminate-bar-fluent-rtl}.igx-linear-bar--indeterminate .igx-linear-bar__indicator-secondary{animation:igx-indeterminate-secondary var(--linear-animation-duration) infinite linear;left:-54.8888%}.igx-linear-bar--indeterminate .igx-linear-bar__indicator-secondary:after{animation:igx-indeterminate-secondary-scale var(--linear-animation-duration) infinite linear;width:100%;height:inherit}.igx-linear-bar--indeterminate .igx-linear-bar__value{display:none}.igx-linear-bar--animation-none:not(.igx-linear-bar--indeterminate){--_transition-duration: 0s !important}.igx-linear-bar--hide-counter .igx-linear-bar__value:before{display:none}}@layer ig.material{@container style(--ig-theme: material){.igx-linear-bar--indeterminate:dir(rtl) .igx-linear-bar__base{transform:rotateY(180deg)}.igx-linear-bar--indeterminate .igx-linear-bar__indicator{transform-origin:top left;width:100%!important;height:inherit;position:absolute;transform:scale3d(0,1,1);animation:igx-indeterminate-primary var(--linear-animation-duration) infinite linear;left:-145.1666%}.igx-linear-bar--indeterminate .igx-linear-bar__indicator:after{content:\"\";position:absolute;top:0;inset-inline-start:0;width:inherit;height:inherit;backface-visibility:hidden;animation:igx-indeterminate-primary-scale var(--linear-animation-duration) infinite linear}.igx-linear-bar--indeterminate .igx-linear-bar__indicator-secondary{transform-origin:top left;width:100%!important;height:inherit;position:absolute}.igx-linear-bar--indeterminate .igx-linear-bar__indicator-secondary:after{content:\"\";position:absolute;top:0;inset-inline-start:0;width:inherit;height:inherit;backface-visibility:hidden}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-linear-bar--indeterminate:dir(rtl) .igx-linear-bar__base{transform:rotateY(180deg)}.igx-linear-bar--indeterminate .igx-linear-bar__indicator{transform-origin:top left;width:100%!important;height:inherit;position:absolute;transform:scale3d(0,1,1);animation:igx-indeterminate-primary var(--linear-animation-duration) infinite linear;left:-145.1666%}.igx-linear-bar--indeterminate .igx-linear-bar__indicator:after{content:\"\";position:absolute;top:0;inset-inline-start:0;width:inherit;height:inherit;backface-visibility:hidden;animation:igx-indeterminate-primary-scale var(--linear-animation-duration) infinite linear}.igx-linear-bar--indeterminate .igx-linear-bar__indicator-secondary{transform-origin:top left;width:100%!important;height:inherit;position:absolute}.igx-linear-bar--indeterminate .igx-linear-bar__indicator-secondary:after{content:\"\";position:absolute;top:0;inset-inline-start:0;width:inherit;height:inherit;backface-visibility:hidden}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-linear-bar{gap:.125rem}.igx-linear-bar--indeterminate .igx-linear-bar__indicator{background:linear-gradient(90deg,transparent 0%,var(--fill-color-default) 50%,transparent 100%);width:33%!important;min-width:33%;animation-name:igx-indeterminate-bar-fluent;animation-duration:var(--linear-animation-duration);animation-timing-function:ease;animation-iteration-count:infinite;left:auto}.igx-linear-bar--indeterminate:dir(rtl) .igx-linear-bar__indicator{animation-name:igx-indeterminate-bar-fluent-rtl}.igx-linear-bar--indeterminate .igx-linear-bar__indicator-secondary{display:none}.igx-linear-bar--danger.igx-linear-bar--indeterminate .igx-linear-bar__indicator{background:linear-gradient(90deg,transparent 0%,var(--fill-color-danger) 50%,transparent 100%)}.igx-linear-bar--warning.igx-linear-bar--indeterminate .igx-linear-bar__indicator{background:linear-gradient(90deg,transparent 0%,var(--fill-color-warning) 50%,transparent 100%)}.igx-linear-bar--info.igx-linear-bar--indeterminate .igx-linear-bar__indicator{background:linear-gradient(90deg,transparent 0%,var(--fill-color-info) 50%,transparent 100%)}.igx-linear-bar--success.igx-linear-bar--indeterminate .igx-linear-bar__indicator{background:linear-gradient(90deg,transparent 0%,var(--fill-color-success) 50%,transparent 100%)}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-linear-bar{gap:.25rem}.igx-linear-bar--indeterminate:dir(rtl) .igx-linear-bar__base{transform:rotateY(180deg)}.igx-linear-bar--indeterminate .igx-linear-bar__indicator{transform-origin:top left;width:100%!important;height:inherit;position:absolute;transform:scale3d(0,1,1);animation:igx-indeterminate-primary var(--linear-animation-duration) infinite linear;left:-145.1666%}.igx-linear-bar--indeterminate .igx-linear-bar__indicator:after{content:\"\";position:absolute;top:0;inset-inline-start:0;width:inherit;height:inherit;backface-visibility:hidden;animation:igx-indeterminate-primary-scale var(--linear-animation-duration) infinite linear}.igx-linear-bar--indeterminate .igx-linear-bar__indicator-secondary{transform-origin:top left;width:100%!important;height:inherit;position:absolute}.igx-linear-bar--indeterminate .igx-linear-bar__indicator-secondary:after{content:\"\";position:absolute;top:0;inset-inline-start:0;width:inherit;height:inherit;backface-visibility:hidden}}}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxLinearProgressBarComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxLinearProgressBarComponent, decorators: [{
             type: Component,
             args: [{ selector: 'igx-linear-bar', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.Eager, imports: [NgClass], template: "<div class=\"igx-linear-bar__base\">\n    <div class=\"igx-linear-bar__indicator\"></div>\n    <div class=\"igx-linear-bar__indicator-secondary\"></div>\n</div>\n<span\n    class=\"igx-linear-bar__value\"\n    [ngClass]=\"{\n    'igx-linear-bar__value--start': textAlign === 'start',\n    'igx-linear-bar__value--center': textAlign === 'center',\n    'igx-linear-bar__value--end': textAlign === 'end',\n    'igx-linear-bar__value--top': textTop,\n    'igx-linear-bar__value--hidden': !textVisibility,\n    'igx-linear-bar__value--fraction': hasFraction\n}\">\n    {{text}}\n</span>\n\n", styles: ["@keyframes igx-indeterminate-primary{0%{transform:translate(0)}20%{animation-timing-function:cubic-bezier(.5,0,.7017,.4958);transform:translate(0)}59.15%{animation-timing-function:cubic-bezier(.3024,.3813,.55,.9563);transform:translate(83.671%)}to{transform:translate(200.611%)}}@keyframes igx-indeterminate-primary-scale{0%{transform:scaleX(.08)}36.65%{animation-timing-function:cubic-bezier(.3347,.124,.7858,1);transform:scaleX(.08)}69.15%{animation-timing-function:cubic-bezier(.06,.11,.6,1);transform:scaleX(.6614)}to{transform:scaleX(.08)}}@keyframes igx-indeterminate-secondary{0%{animation-timing-function:cubic-bezier(.15,0,.515,.4096);transform:translate(0)}25%{animation-timing-function:cubic-bezier(.31,.284,.8,.7337);transform:translate(37.6519%)}48.35%{animation-timing-function:cubic-bezier(.4,.627,.6,.902);transform:translate(84.3861%)}to{transform:translate(160.2777%)}}@keyframes igx-indeterminate-secondary-scale{0%{animation-timing-function:cubic-bezier(.15,0,.515,.4096);transform:scaleX(.08)}19.15%{animation-timing-function:cubic-bezier(.31,.284,.8,.7337);transform:scaleX(.4571)}44.15%{animation-timing-function:cubic-bezier(.4,.627,.6,.902);transform:scaleX(.727)}to{transform:scaleX(.08)}}@keyframes igx-indeterminate-bar-fluent{0%{transform:translate(-100%);transform-origin:left}to{transform:translate(310%);transform-origin:right}}@keyframes igx-indeterminate-bar-fluent-rtl{0%{transform:translate(100%);transform-origin:right}to{transform:translate(-310%);transform-origin:left}}@keyframes igx-initial-width{0%{width:0}to{width:calc(var(--_progress-whole, 0)*1%)}}@layer ig.base{.igx-linear-bar:not(.igx-linear-bar--indeterminate) .igx-linear-bar__indicator{animation:igx-initial-width var(--_transition-duration) linear;background-color:var(--fill-color-default)}.igx-linear-bar{position:relative;display:flex;width:100%;flex:1 1 100%;flex-direction:column}.igx-linear-bar__base{--stripe-size: var(--strip-size);--linear-animation-duration: 2s;display:flex;flex-direction:column;position:relative;width:inherit;height:var(--track-height);background:var(--track-color);overflow:hidden;border-radius:var(--track-border-radius);z-index:0}.igx-linear-bar__indicator{width:calc(var(--_progress-whole)*1%);position:absolute;height:100%;transition:width var(--_transition-duration) linear}.igx-linear-bar__value{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;color:var(--text-color);animation:initial-counter var(--_transition-duration) ease-in-out;counter-reset:progress-integer round(down,var(--_progress-integer, 0),1) progress-fraction round(down,var(--_progress-fraction, 0),1);transition:--_progress-integer var(--_transition-duration) ease-in-out,--_progress-fraction var(--_transition-duration) ease-in-out}.igx-linear-bar__value--start{align-self:flex-start}.igx-linear-bar__value--center{align-self:center}.igx-linear-bar__value--end{align-self:flex-end}.igx-linear-bar__value--top{order:-1}.igx-linear-bar__value--hidden{display:none}.igx-linear-bar__value--fraction:before{content:counter(progress-integer) \".\" counter(progress-fraction,decimal-leading-zero) \"%\"}.igx-linear-bar__value:not(.igx-linear-bar__value--fraction):before{content:counter(progress-integer) \"%\"}.igx-linear-bar--danger:not(.igx-linear-bar--indeterminate) .igx-linear-bar__indicator{background-color:var(--fill-color-danger)}.igx-linear-bar--danger:not(.igx-linear-bar--indeterminate) .igx-linear-bar__indicator-secondary{background-color:var(--fill-color-danger)}.igx-linear-bar--danger .igx-linear-bar__indicator:after{background-color:var(--fill-color-danger)}.igx-linear-bar--danger .igx-linear-bar__indicator-secondary:after{background-color:var(--fill-color-danger)}.igx-linear-bar--warning:not(.igx-linear-bar--indeterminate) .igx-linear-bar__indicator{background-color:var(--fill-color-warning)}.igx-linear-bar--warning:not(.igx-linear-bar--indeterminate) .igx-linear-bar__indicator-secondary{background-color:var(--fill-color-warning)}.igx-linear-bar--warning .igx-linear-bar__indicator:after{background-color:var(--fill-color-warning)}.igx-linear-bar--warning .igx-linear-bar__indicator-secondary:after{background-color:var(--fill-color-warning)}.igx-linear-bar--info:not(.igx-linear-bar--indeterminate) .igx-linear-bar__indicator{background-color:var(--fill-color-info)}.igx-linear-bar--info:not(.igx-linear-bar--indeterminate) .igx-linear-bar__indicator-secondary{background-color:var(--fill-color-info)}.igx-linear-bar--info .igx-linear-bar__indicator:after{background-color:var(--fill-color-info)}.igx-linear-bar--info .igx-linear-bar__indicator-secondary:after{background-color:var(--fill-color-info)}.igx-linear-bar--success:not(.igx-linear-bar--indeterminate) .igx-linear-bar__indicator{background-color:var(--fill-color-success)}.igx-linear-bar--success:not(.igx-linear-bar--indeterminate) .igx-linear-bar__indicator-secondary{background-color:var(--fill-color-success)}.igx-linear-bar--success .igx-linear-bar__indicator:after{background-color:var(--fill-color-success)}.igx-linear-bar--success .igx-linear-bar__indicator-secondary:after{background-color:var(--fill-color-success)}.igx-linear-bar--indeterminate:not(.igx-linear-bar--danger,.igx-linear-bar--warning,.igx-linear-bar--info,.igx-linear-bar--success) .igx-linear-bar__indicator:after{background-color:var(--fill-color-default)}.igx-linear-bar--indeterminate:not(.igx-linear-bar--danger,.igx-linear-bar--warning,.igx-linear-bar--info,.igx-linear-bar--success) .igx-linear-bar__indicator-secondary:after{background-color:var(--fill-color-default)}.igx-linear-bar--striped:not(.igx-linear-bar--indeterminate){--linear-strips-orientation: -45deg}.igx-linear-bar--striped:not(.igx-linear-bar--indeterminate):dir(rtl){--linear-strips-orientation: 45deg }.igx-linear-bar--striped:not(.igx-linear-bar--indeterminate) .igx-linear-bar__indicator{background-image:repeating-linear-gradient(var(--linear-strips-orientation),transparent,transparent var(--stripe-size),var(--stripes-color) var(--stripe-size),var(--stripes-color) calc(var(--stripe-size) * 2))}.igx-linear-bar--indeterminate .igx-linear-bar__indicator{animation-name:igx-indeterminate-bar-fluent-rtl}.igx-linear-bar--indeterminate .igx-linear-bar__indicator-secondary{animation:igx-indeterminate-secondary var(--linear-animation-duration) infinite linear;left:-54.8888%}.igx-linear-bar--indeterminate .igx-linear-bar__indicator-secondary:after{animation:igx-indeterminate-secondary-scale var(--linear-animation-duration) infinite linear;width:100%;height:inherit}.igx-linear-bar--indeterminate .igx-linear-bar__value{display:none}.igx-linear-bar--animation-none:not(.igx-linear-bar--indeterminate){--_transition-duration: 0s !important}.igx-linear-bar--hide-counter .igx-linear-bar__value:before{display:none}}@layer ig.material{@container style(--ig-theme: material){.igx-linear-bar--indeterminate:dir(rtl) .igx-linear-bar__base{transform:rotateY(180deg)}.igx-linear-bar--indeterminate .igx-linear-bar__indicator{transform-origin:top left;width:100%!important;height:inherit;position:absolute;transform:scale3d(0,1,1);animation:igx-indeterminate-primary var(--linear-animation-duration) infinite linear;left:-145.1666%}.igx-linear-bar--indeterminate .igx-linear-bar__indicator:after{content:\"\";position:absolute;top:0;inset-inline-start:0;width:inherit;height:inherit;backface-visibility:hidden;animation:igx-indeterminate-primary-scale var(--linear-animation-duration) infinite linear}.igx-linear-bar--indeterminate .igx-linear-bar__indicator-secondary{transform-origin:top left;width:100%!important;height:inherit;position:absolute}.igx-linear-bar--indeterminate .igx-linear-bar__indicator-secondary:after{content:\"\";position:absolute;top:0;inset-inline-start:0;width:inherit;height:inherit;backface-visibility:hidden}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-linear-bar--indeterminate:dir(rtl) .igx-linear-bar__base{transform:rotateY(180deg)}.igx-linear-bar--indeterminate .igx-linear-bar__indicator{transform-origin:top left;width:100%!important;height:inherit;position:absolute;transform:scale3d(0,1,1);animation:igx-indeterminate-primary var(--linear-animation-duration) infinite linear;left:-145.1666%}.igx-linear-bar--indeterminate .igx-linear-bar__indicator:after{content:\"\";position:absolute;top:0;inset-inline-start:0;width:inherit;height:inherit;backface-visibility:hidden;animation:igx-indeterminate-primary-scale var(--linear-animation-duration) infinite linear}.igx-linear-bar--indeterminate .igx-linear-bar__indicator-secondary{transform-origin:top left;width:100%!important;height:inherit;position:absolute}.igx-linear-bar--indeterminate .igx-linear-bar__indicator-secondary:after{content:\"\";position:absolute;top:0;inset-inline-start:0;width:inherit;height:inherit;backface-visibility:hidden}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-linear-bar{gap:.125rem}.igx-linear-bar--indeterminate .igx-linear-bar__indicator{background:linear-gradient(90deg,transparent 0%,var(--fill-color-default) 50%,transparent 100%);width:33%!important;min-width:33%;animation-name:igx-indeterminate-bar-fluent;animation-duration:var(--linear-animation-duration);animation-timing-function:ease;animation-iteration-count:infinite;left:auto}.igx-linear-bar--indeterminate:dir(rtl) .igx-linear-bar__indicator{animation-name:igx-indeterminate-bar-fluent-rtl}.igx-linear-bar--indeterminate .igx-linear-bar__indicator-secondary{display:none}.igx-linear-bar--danger.igx-linear-bar--indeterminate .igx-linear-bar__indicator{background:linear-gradient(90deg,transparent 0%,var(--fill-color-danger) 50%,transparent 100%)}.igx-linear-bar--warning.igx-linear-bar--indeterminate .igx-linear-bar__indicator{background:linear-gradient(90deg,transparent 0%,var(--fill-color-warning) 50%,transparent 100%)}.igx-linear-bar--info.igx-linear-bar--indeterminate .igx-linear-bar__indicator{background:linear-gradient(90deg,transparent 0%,var(--fill-color-info) 50%,transparent 100%)}.igx-linear-bar--success.igx-linear-bar--indeterminate .igx-linear-bar__indicator{background:linear-gradient(90deg,transparent 0%,var(--fill-color-success) 50%,transparent 100%)}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-linear-bar{gap:.25rem}.igx-linear-bar--indeterminate:dir(rtl) .igx-linear-bar__base{transform:rotateY(180deg)}.igx-linear-bar--indeterminate .igx-linear-bar__indicator{transform-origin:top left;width:100%!important;height:inherit;position:absolute;transform:scale3d(0,1,1);animation:igx-indeterminate-primary var(--linear-animation-duration) infinite linear;left:-145.1666%}.igx-linear-bar--indeterminate .igx-linear-bar__indicator:after{content:\"\";position:absolute;top:0;inset-inline-start:0;width:inherit;height:inherit;backface-visibility:hidden;animation:igx-indeterminate-primary-scale var(--linear-animation-duration) infinite linear}.igx-linear-bar--indeterminate .igx-linear-bar__indicator-secondary{transform-origin:top left;width:100%!important;height:inherit;position:absolute}.igx-linear-bar--indeterminate .igx-linear-bar__indicator-secondary:after{content:\"\";position:absolute;top:0;inset-inline-start:0;width:inherit;height:inherit;backface-visibility:hidden}}}\n"] }]
         }], propDecorators: { valueMin: [{
@@ -626,10 +626,10 @@ class IgxCircularProgressBarComponent extends BaseProgressDirective {
     ngAfterContentInit() {
         this._contentInit = true;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxCircularProgressBarComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.1", type: IgxCircularProgressBarComponent, isStandalone: true, selector: "igx-circular-bar", inputs: { id: "id", textVisibility: ["textVisibility", "textVisibility", booleanAttribute], type: "type" }, host: { properties: { "class.igx-circular-bar": "this.cssClass", "attr.id": "this.id", "class.igx-circular-bar--indeterminate": "this.isIndeterminate", "class.igx-circular-bar--animation-none": "this.disableAnimationClass", "class.igx-circular-bar--hide-counter": "this.hasText", "class.igx-circular-bar--danger": "this.error", "class.igx-circular-bar--info": "this.info", "class.igx-circular-bar--warning": "this.warning", "class.igx-circular-bar--success": "this.success", "style.stroke": "this.strokeStyle" } }, queries: [{ propertyName: "textTemplate", first: true, predicate: IgxProgressBarTextTemplateDirective, descendants: true, read: IgxProgressBarTextTemplateDirective }, { propertyName: "gradientTemplate", first: true, predicate: IgxProgressBarGradientDirective, descendants: true, read: IgxProgressBarGradientDirective }], usesInheritance: true, ngImport: i0, template: "<svg #svg\n     role=\"progressbar\"\n     aria-valuemin=\"0\"\n     [ngClass]=\"{'igx-circular-svg': true, 'igx-circular-svg--indeterminate': indeterminate}\"\n     [attr.aria-valuemax]=\"max\"\n     [attr.aria-valuenow]=\"value\">\n    <svg:circle class=\"igx-circular-svg__inner\" />\n    <svg:circle #circle class=\"igx-circular-bar__outer igx-circular-svg__outer\"/>\n\n    <svg:defs>\n        <ng-container\n                *ngTemplateOutlet=\"gradientTemplate ? gradientTemplate.template : defaultGradientTemplate;\n        context: { $implicit: gradientId }\">\n        </ng-container>\n    </svg:defs>\n\n    <ng-template #defaultGradientTemplate>\n        <svg:linearGradient [id]=\"gradientId\" gradientTransform=\"rotate(90)\">\n            <stop offset=\"0%\"   class=\"igx-circular-svg__gradient-start\" />\n            <stop offset=\"100%\" class=\"igx-circular-svg__gradient-end\" />\n        </svg:linearGradient>\n    </ng-template>\n</svg>\n\n@if (textVisibility) {\n    <span class=\"igx-circular-bar__text\" [ngClass]=\"hasFraction ? 'igx-circular-bar__value--fraction' : ''\">\n        <ng-container *ngTemplateOutlet=\"textTemplate ? textTemplate.template : defaultTextTemplate;\n            context: context\">\n        </ng-container>\n    </span>\n}\n\n<ng-template #defaultTextTemplate>\n    {{textContent}}\n</ng-template>\n\n\n", styles: ["@keyframes igx-indeterminate-accordion{0%{stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)*2);stroke-dasharray:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)*9/10)}to{stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)*2/5)}}@keyframes igx-indeterminate-accordion-rtl{0%{stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)*-2);stroke-dasharray:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)*9/10)}to{stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)*-2/5)}}@keyframes igx-indeterminate-circular-fluent{0%{stroke-dasharray:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)*.0001),calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416);stroke-dashoffset:calc(-1*calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)/4);transform:rotate(-90deg)}50%{stroke-dasharray:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)/2),calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)/2);stroke-dashoffset:calc(-1*calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)/4);transform:rotate(360deg)}to{stroke-dasharray:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)*.0001),calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416);stroke-dashoffset:calc(-1*calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)/4);transform:rotate(990deg)}}@keyframes igx-indeterminate-circular-fluent-rtl{0%{stroke-dasharray:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)*.0001),calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416);stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)/4);transform:rotate(90deg)}50%{stroke-dasharray:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)/2),calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)/2);stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)/4);transform:rotate(-360deg)}to{stroke-dasharray:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)*.0001),calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416);stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)/4);transform:rotate(-990deg)}}@keyframes igx-initial-dashoffset{0%{stroke-dashoffset:calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)}to{stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416) - var(--_progress-percentage)*calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416))}}@keyframes igc-initial-counter{0%{--_progress-integer: 0;--_progress-fraction: 0}}@keyframes igx-rotate-center{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.igx-circular-svg__outer,.igx-circular-svg__inner{width:100%;height:100%;fill:#0000;cx:calc(calc(var(--circular-size) + var(--stroke-thickness))/2);cy:calc(calc(var(--circular-size) + var(--stroke-thickness))/2);r:calc(var(--circular-size)/2 - var(--stroke-thickness)*.5);transform-origin:center}@layer ig.base{.igx-circular-bar{--circular-size: calc(var(--diameter) - var(--stroke-thickness));display:inline-flex;align-items:center;justify-content:center;position:relative}.igx-circular-bar__text{position:absolute;color:var(--text-color);font-size:round(var(--diameter)/var(--scale-factor) - var(--stroke-thickness),1px);line-height:normal;text-align:center;font-weight:600;animation:igx-initial-counter var(--_transition-duration) ease-in-out;counter-reset:progress-integer round(down,var(--_progress-integer, 0),1) progress-fraction round(down,var(--_progress-fraction, 0),1);transition:--_progress-integer var(--_transition-duration) ease-in-out,--_progress-fraction var(--_transition-duration) ease-in-out}.igx-circular-bar__text:before{content:counter(progress-integer) \"%\"}.igx-circular-bar__value--fraction:before{content:counter(progress-integer) \".\" counter(progress-fraction,decimal-leading-zero) \"%\"}.igx-circular-bar--indeterminate .igx-circular-bar__text{visibility:hidden}.igx-circular-bar--danger .igx-circular-bar__outer{stroke:var(--fill-color-danger)}.igx-circular-bar--warning .igx-circular-bar__outer{stroke:var(--fill-color-warning)}.igx-circular-bar--info .igx-circular-bar__outer{stroke:var(--fill-color-info)}.igx-circular-bar--success .igx-circular-bar__outer{stroke:var(--fill-color-success)}.igx-circular-bar--animation-none{--_transition-duration: 0s !important}.igx-circular-bar--hide-counter .igx-circular-bar__text:before{display:none}.igx-circular-svg{width:calc(var(--circular-size) + var(--stroke-thickness));height:calc(var(--circular-size) + var(--stroke-thickness));transform:rotate(-90deg);transform-origin:center;--fill-color-default-start: var(--fill-color-default);--fill-color-default-end: var(--fill-color-default)}.igx-circular-svg__gradient-start{stop-color:var(--ig-circular-bar-fill-color-default-end, var(--fill-color-default-end))}.igx-circular-svg__gradient-end{stop-color:var(--ig-circular-bar-fill-color-default-start, var(--fill-color-default-start))}.igx-circular-svg__inner{stroke-width:var(--stroke-thickness);stroke:var(--track-color)}.igx-circular-svg__outer{--_progress-percentage: calc(var(--_progress-whole, 0) / 100);transition:stroke-dashoffset var(--_transition-duration) linear;stroke-dasharray:calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416) calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416);stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416) - var(--_progress-percentage)*calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416))}.igx-circular-svg--indeterminate .igx-circular-svg__outer{stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)*2);animation:igx-indeterminate-accordion 1.5s cubic-bezier(0,.085,.68,.53) normal infinite}.igx-circular-svg--indeterminate:dir(rtl) .igx-circular-svg__outer{stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416) + var(--_progress-percentage)*calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416))}.igx-circular-svg:not(.igx-circular-svg--indeterminate) .igx-circular-svg__outer{animation:igx-initial-dashoffset var(--_transition-duration) linear;stroke-dasharray:calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416) calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416);stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416) - var(--_progress-percentage)*calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416))}.igx-circular-svg:not(.igx-circular-svg--indeterminate):dir(rtl) .igx-circular-svg__outer{animation:igx-initial-dashoffset-rtl var(--_transition-duration) linear;animation-direction:reverse}}@layer ig.material{@container style(--ig-theme: material){.igx-circular-bar{--stroke-thickness: 1.3px;--scale-factor: 2.95}}}@layer ig.material{@container style(--ig-theme: material){.igx-circular-svg__outer{animation:igx-initial-dashoffset var(--_transition-duration) linear;stroke-width:calc(var(--stroke-thickness) + .046875rem)}.igx-circular-svg--indeterminate{animation:3s linear 0s infinite normal none running igx-rotate-center;transform-origin:50% 50%}.igx-circular-svg--indeterminate .igx-circular-svg__outer{animation:igx-indeterminate-accordion 1.5s cubic-bezier(0,.085,.68,.53) normal infinite;stroke-dasharray:calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416) calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)}.igx-circular-svg--indeterminate:dir(rtl){animation-direction:reverse}.igx-circular-svg--indeterminate:dir(rtl) .igx-circular-svg__outer{animation-direction:reverse}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-circular-bar{--stroke-thickness: 2px;--scale-factor: 3.05}.igx-circular-bar__text{font-weight:700}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-circular-svg__outer{stroke-width:var(--stroke-thickness)}.igx-circular-svg--indeterminate{animation:3s linear 0s infinite normal none running igx-rotate-center;animation-duration:.75s}.igx-circular-svg--indeterminate:dir(rtl){animation-direction:reverse}.igx-circular-svg--indeterminate .igx-circular-svg__inner{stroke:#0000}.igx-circular-svg--indeterminate .igx-circular-svg__outer{stroke-dashoffset:60%;animation:none}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-circular-bar{--stroke-thickness: 2px;--scale-factor: 2.75}.igx-circular-bar__text{font-weight:700}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-circular-svg__outer{stroke-width:var(--stroke-thickness);animation:igx-initial-dashoffset var(--_transition-duration) linear}.igx-circular-svg--indeterminate{transform-origin:50% 50%}.igx-circular-svg--indeterminate .igx-circular-svg__outer{stroke-linecap:round;animation:2s linear 0s infinite normal none running igx-indeterminate-circular-fluent;stroke-dasharray:289}.igx-circular-svg--indeterminate:dir(rtl){animation-direction:reverse}.igx-circular-svg--indeterminate:dir(rtl) .igx-circular-svg__outer{animation-direction:reverse}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-circular-bar{--stroke-thickness: 3px;--scale-factor: 3.4}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-circular-svg__outer{stroke-width:var(--stroke-thickness);animation:igx-initial-dashoffset var(--_transition-duration) linear}.igx-circular-svg--indeterminate{animation:3s linear 0s infinite normal none running igx-rotate-center;transform-origin:50% 50%}.igx-circular-svg--indeterminate .igx-circular-svg__outer{animation:igx-indeterminate-accordion 1.5s cubic-bezier(0,.085,.68,.53) normal infinite;stroke-dasharray:calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416) calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)}.igx-circular-svg--indeterminate:dir(rtl){animation-direction:reverse}.igx-circular-svg--indeterminate:dir(rtl) .igx-circular-svg__outer{animation-direction:reverse}}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCircularProgressBarComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: IgxCircularProgressBarComponent, isStandalone: true, selector: "igx-circular-bar", inputs: { id: "id", textVisibility: ["textVisibility", "textVisibility", booleanAttribute], type: "type" }, host: { properties: { "class.igx-circular-bar": "this.cssClass", "attr.id": "this.id", "class.igx-circular-bar--indeterminate": "this.isIndeterminate", "class.igx-circular-bar--animation-none": "this.disableAnimationClass", "class.igx-circular-bar--hide-counter": "this.hasText", "class.igx-circular-bar--danger": "this.error", "class.igx-circular-bar--info": "this.info", "class.igx-circular-bar--warning": "this.warning", "class.igx-circular-bar--success": "this.success", "style.stroke": "this.strokeStyle" } }, queries: [{ propertyName: "textTemplate", first: true, predicate: IgxProgressBarTextTemplateDirective, descendants: true, read: IgxProgressBarTextTemplateDirective }, { propertyName: "gradientTemplate", first: true, predicate: IgxProgressBarGradientDirective, descendants: true, read: IgxProgressBarGradientDirective }], usesInheritance: true, ngImport: i0, template: "<svg #svg\n     role=\"progressbar\"\n     aria-valuemin=\"0\"\n     [ngClass]=\"{'igx-circular-svg': true, 'igx-circular-svg--indeterminate': indeterminate}\"\n     [attr.aria-valuemax]=\"max\"\n     [attr.aria-valuenow]=\"value\">\n    <svg:circle class=\"igx-circular-svg__inner\" />\n    <svg:circle #circle class=\"igx-circular-bar__outer igx-circular-svg__outer\"/>\n\n    <svg:defs>\n        <ng-container\n                *ngTemplateOutlet=\"gradientTemplate ? gradientTemplate.template : defaultGradientTemplate;\n        context: { $implicit: gradientId }\">\n        </ng-container>\n    </svg:defs>\n\n    <ng-template #defaultGradientTemplate>\n        <svg:linearGradient [id]=\"gradientId\" gradientTransform=\"rotate(90)\">\n            <stop offset=\"0%\"   class=\"igx-circular-svg__gradient-start\" />\n            <stop offset=\"100%\" class=\"igx-circular-svg__gradient-end\" />\n        </svg:linearGradient>\n    </ng-template>\n</svg>\n\n@if (textVisibility) {\n    <span class=\"igx-circular-bar__text\" [ngClass]=\"hasFraction ? 'igx-circular-bar__value--fraction' : ''\">\n        <ng-container *ngTemplateOutlet=\"textTemplate ? textTemplate.template : defaultTextTemplate;\n            context: context\">\n        </ng-container>\n    </span>\n}\n\n<ng-template #defaultTextTemplate>\n    {{textContent}}\n</ng-template>\n\n\n", styles: ["@keyframes igx-indeterminate-accordion{0%{stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)*2);stroke-dasharray:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)*9/10)}to{stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)*2/5)}}@keyframes igx-indeterminate-accordion-rtl{0%{stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)*-2);stroke-dasharray:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)*9/10)}to{stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)*-2/5)}}@keyframes igx-indeterminate-circular-fluent{0%{stroke-dasharray:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)*.0001),calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416);stroke-dashoffset:calc(-1*calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)/4);transform:rotate(-90deg)}50%{stroke-dasharray:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)/2),calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)/2);stroke-dashoffset:calc(-1*calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)/4);transform:rotate(360deg)}to{stroke-dasharray:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)*.0001),calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416);stroke-dashoffset:calc(-1*calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)/4);transform:rotate(990deg)}}@keyframes igx-indeterminate-circular-fluent-rtl{0%{stroke-dasharray:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)*.0001),calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416);stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)/4);transform:rotate(90deg)}50%{stroke-dasharray:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)/2),calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)/2);stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)/4);transform:rotate(-360deg)}to{stroke-dasharray:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)*.0001),calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416);stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)/4);transform:rotate(-990deg)}}@keyframes igx-initial-dashoffset{0%{stroke-dashoffset:calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)}to{stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416) - var(--_progress-percentage)*calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416))}}@keyframes igc-initial-counter{0%{--_progress-integer: 0;--_progress-fraction: 0}}@keyframes igx-rotate-center{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.igx-circular-svg__outer,.igx-circular-svg__inner{width:100%;height:100%;fill:#0000;cx:calc(calc(var(--circular-size) + var(--stroke-thickness))/2);cy:calc(calc(var(--circular-size) + var(--stroke-thickness))/2);r:calc(var(--circular-size)/2 - var(--stroke-thickness)*.5);transform-origin:center}@layer ig.base{.igx-circular-bar{--circular-size: calc(var(--diameter) - var(--stroke-thickness));display:inline-flex;align-items:center;justify-content:center;position:relative}.igx-circular-bar__text{position:absolute;color:var(--text-color);font-size:round(var(--diameter)/var(--scale-factor) - var(--stroke-thickness),1px);line-height:normal;text-align:center;font-weight:600;animation:igx-initial-counter var(--_transition-duration) ease-in-out;counter-reset:progress-integer round(down,var(--_progress-integer, 0),1) progress-fraction round(down,var(--_progress-fraction, 0),1);transition:--_progress-integer var(--_transition-duration) ease-in-out,--_progress-fraction var(--_transition-duration) ease-in-out}.igx-circular-bar__text:before{content:counter(progress-integer) \"%\"}.igx-circular-bar__value--fraction:before{content:counter(progress-integer) \".\" counter(progress-fraction,decimal-leading-zero) \"%\"}.igx-circular-bar--indeterminate .igx-circular-bar__text{visibility:hidden}.igx-circular-bar--danger .igx-circular-bar__outer{stroke:var(--fill-color-danger)}.igx-circular-bar--warning .igx-circular-bar__outer{stroke:var(--fill-color-warning)}.igx-circular-bar--info .igx-circular-bar__outer{stroke:var(--fill-color-info)}.igx-circular-bar--success .igx-circular-bar__outer{stroke:var(--fill-color-success)}.igx-circular-bar--animation-none{--_transition-duration: 0s !important}.igx-circular-bar--hide-counter .igx-circular-bar__text:before{display:none}.igx-circular-svg{width:calc(var(--circular-size) + var(--stroke-thickness));height:calc(var(--circular-size) + var(--stroke-thickness));transform:rotate(-90deg);transform-origin:center;--fill-color-default-start: var(--fill-color-default);--fill-color-default-end: var(--fill-color-default)}.igx-circular-svg__gradient-start{stop-color:var(--ig-circular-bar-fill-color-default-end, var(--fill-color-default-end))}.igx-circular-svg__gradient-end{stop-color:var(--ig-circular-bar-fill-color-default-start, var(--fill-color-default-start))}.igx-circular-svg__inner{stroke-width:var(--stroke-thickness);stroke:var(--track-color)}.igx-circular-svg__outer{--_progress-percentage: calc(var(--_progress-whole, 0) / 100);transition:stroke-dashoffset var(--_transition-duration) linear;stroke-dasharray:calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416) calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416);stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416) - var(--_progress-percentage)*calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416))}.igx-circular-svg--indeterminate .igx-circular-svg__outer{stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)*2);animation:igx-indeterminate-accordion 1.5s cubic-bezier(0,.085,.68,.53) normal infinite}.igx-circular-svg--indeterminate:dir(rtl) .igx-circular-svg__outer{stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416) + var(--_progress-percentage)*calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416))}.igx-circular-svg:not(.igx-circular-svg--indeterminate) .igx-circular-svg__outer{animation:igx-initial-dashoffset var(--_transition-duration) linear;stroke-dasharray:calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416) calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416);stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416) - var(--_progress-percentage)*calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416))}.igx-circular-svg:not(.igx-circular-svg--indeterminate):dir(rtl) .igx-circular-svg__outer{animation:igx-initial-dashoffset-rtl var(--_transition-duration) linear;animation-direction:reverse}}@layer ig.material{@container style(--ig-theme: material){.igx-circular-bar{--stroke-thickness: 1.3px;--scale-factor: 2.95}}}@layer ig.material{@container style(--ig-theme: material){.igx-circular-svg__outer{animation:igx-initial-dashoffset var(--_transition-duration) linear;stroke-width:calc(var(--stroke-thickness) + .046875rem)}.igx-circular-svg--indeterminate{animation:3s linear 0s infinite normal none running igx-rotate-center;transform-origin:50% 50%}.igx-circular-svg--indeterminate .igx-circular-svg__outer{animation:igx-indeterminate-accordion 1.5s cubic-bezier(0,.085,.68,.53) normal infinite;stroke-dasharray:calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416) calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)}.igx-circular-svg--indeterminate:dir(rtl){animation-direction:reverse}.igx-circular-svg--indeterminate:dir(rtl) .igx-circular-svg__outer{animation-direction:reverse}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-circular-bar{--stroke-thickness: 2px;--scale-factor: 3.05}.igx-circular-bar__text{font-weight:700}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-circular-svg__outer{stroke-width:var(--stroke-thickness)}.igx-circular-svg--indeterminate{animation:3s linear 0s infinite normal none running igx-rotate-center;animation-duration:.75s}.igx-circular-svg--indeterminate:dir(rtl){animation-direction:reverse}.igx-circular-svg--indeterminate .igx-circular-svg__inner{stroke:#0000}.igx-circular-svg--indeterminate .igx-circular-svg__outer{stroke-dashoffset:60%;animation:none}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-circular-bar{--stroke-thickness: 2px;--scale-factor: 2.75}.igx-circular-bar__text{font-weight:700}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-circular-svg__outer{stroke-width:var(--stroke-thickness);animation:igx-initial-dashoffset var(--_transition-duration) linear}.igx-circular-svg--indeterminate{transform-origin:50% 50%}.igx-circular-svg--indeterminate .igx-circular-svg__outer{stroke-linecap:round;animation:2s linear 0s infinite normal none running igx-indeterminate-circular-fluent;stroke-dasharray:289}.igx-circular-svg--indeterminate:dir(rtl){animation-direction:reverse}.igx-circular-svg--indeterminate:dir(rtl) .igx-circular-svg__outer{animation-direction:reverse}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-circular-bar{--stroke-thickness: 3px;--scale-factor: 3.4}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-circular-svg__outer{stroke-width:var(--stroke-thickness);animation:igx-initial-dashoffset var(--_transition-duration) linear}.igx-circular-svg--indeterminate{animation:3s linear 0s infinite normal none running igx-rotate-center;transform-origin:50% 50%}.igx-circular-svg--indeterminate .igx-circular-svg__outer{animation:igx-indeterminate-accordion 1.5s cubic-bezier(0,.085,.68,.53) normal infinite;stroke-dasharray:calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416) calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)}.igx-circular-svg--indeterminate:dir(rtl){animation-direction:reverse}.igx-circular-svg--indeterminate:dir(rtl) .igx-circular-svg__outer{animation-direction:reverse}}}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.Eager, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxCircularProgressBarComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxCircularProgressBarComponent, decorators: [{
             type: Component,
             args: [{ selector: 'igx-circular-bar', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.Eager, imports: [NgTemplateOutlet, NgClass], template: "<svg #svg\n     role=\"progressbar\"\n     aria-valuemin=\"0\"\n     [ngClass]=\"{'igx-circular-svg': true, 'igx-circular-svg--indeterminate': indeterminate}\"\n     [attr.aria-valuemax]=\"max\"\n     [attr.aria-valuenow]=\"value\">\n    <svg:circle class=\"igx-circular-svg__inner\" />\n    <svg:circle #circle class=\"igx-circular-bar__outer igx-circular-svg__outer\"/>\n\n    <svg:defs>\n        <ng-container\n                *ngTemplateOutlet=\"gradientTemplate ? gradientTemplate.template : defaultGradientTemplate;\n        context: { $implicit: gradientId }\">\n        </ng-container>\n    </svg:defs>\n\n    <ng-template #defaultGradientTemplate>\n        <svg:linearGradient [id]=\"gradientId\" gradientTransform=\"rotate(90)\">\n            <stop offset=\"0%\"   class=\"igx-circular-svg__gradient-start\" />\n            <stop offset=\"100%\" class=\"igx-circular-svg__gradient-end\" />\n        </svg:linearGradient>\n    </ng-template>\n</svg>\n\n@if (textVisibility) {\n    <span class=\"igx-circular-bar__text\" [ngClass]=\"hasFraction ? 'igx-circular-bar__value--fraction' : ''\">\n        <ng-container *ngTemplateOutlet=\"textTemplate ? textTemplate.template : defaultTextTemplate;\n            context: context\">\n        </ng-container>\n    </span>\n}\n\n<ng-template #defaultTextTemplate>\n    {{textContent}}\n</ng-template>\n\n\n", styles: ["@keyframes igx-indeterminate-accordion{0%{stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)*2);stroke-dasharray:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)*9/10)}to{stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)*2/5)}}@keyframes igx-indeterminate-accordion-rtl{0%{stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)*-2);stroke-dasharray:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)*9/10)}to{stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)*-2/5)}}@keyframes igx-indeterminate-circular-fluent{0%{stroke-dasharray:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)*.0001),calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416);stroke-dashoffset:calc(-1*calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)/4);transform:rotate(-90deg)}50%{stroke-dasharray:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)/2),calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)/2);stroke-dashoffset:calc(-1*calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)/4);transform:rotate(360deg)}to{stroke-dasharray:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)*.0001),calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416);stroke-dashoffset:calc(-1*calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)/4);transform:rotate(990deg)}}@keyframes igx-indeterminate-circular-fluent-rtl{0%{stroke-dasharray:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)*.0001),calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416);stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)/4);transform:rotate(90deg)}50%{stroke-dasharray:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)/2),calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)/2);stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)/4);transform:rotate(-360deg)}to{stroke-dasharray:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)*.0001),calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416);stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)/4);transform:rotate(-990deg)}}@keyframes igx-initial-dashoffset{0%{stroke-dashoffset:calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)}to{stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416) - var(--_progress-percentage)*calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416))}}@keyframes igc-initial-counter{0%{--_progress-integer: 0;--_progress-fraction: 0}}@keyframes igx-rotate-center{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.igx-circular-svg__outer,.igx-circular-svg__inner{width:100%;height:100%;fill:#0000;cx:calc(calc(var(--circular-size) + var(--stroke-thickness))/2);cy:calc(calc(var(--circular-size) + var(--stroke-thickness))/2);r:calc(var(--circular-size)/2 - var(--stroke-thickness)*.5);transform-origin:center}@layer ig.base{.igx-circular-bar{--circular-size: calc(var(--diameter) - var(--stroke-thickness));display:inline-flex;align-items:center;justify-content:center;position:relative}.igx-circular-bar__text{position:absolute;color:var(--text-color);font-size:round(var(--diameter)/var(--scale-factor) - var(--stroke-thickness),1px);line-height:normal;text-align:center;font-weight:600;animation:igx-initial-counter var(--_transition-duration) ease-in-out;counter-reset:progress-integer round(down,var(--_progress-integer, 0),1) progress-fraction round(down,var(--_progress-fraction, 0),1);transition:--_progress-integer var(--_transition-duration) ease-in-out,--_progress-fraction var(--_transition-duration) ease-in-out}.igx-circular-bar__text:before{content:counter(progress-integer) \"%\"}.igx-circular-bar__value--fraction:before{content:counter(progress-integer) \".\" counter(progress-fraction,decimal-leading-zero) \"%\"}.igx-circular-bar--indeterminate .igx-circular-bar__text{visibility:hidden}.igx-circular-bar--danger .igx-circular-bar__outer{stroke:var(--fill-color-danger)}.igx-circular-bar--warning .igx-circular-bar__outer{stroke:var(--fill-color-warning)}.igx-circular-bar--info .igx-circular-bar__outer{stroke:var(--fill-color-info)}.igx-circular-bar--success .igx-circular-bar__outer{stroke:var(--fill-color-success)}.igx-circular-bar--animation-none{--_transition-duration: 0s !important}.igx-circular-bar--hide-counter .igx-circular-bar__text:before{display:none}.igx-circular-svg{width:calc(var(--circular-size) + var(--stroke-thickness));height:calc(var(--circular-size) + var(--stroke-thickness));transform:rotate(-90deg);transform-origin:center;--fill-color-default-start: var(--fill-color-default);--fill-color-default-end: var(--fill-color-default)}.igx-circular-svg__gradient-start{stop-color:var(--ig-circular-bar-fill-color-default-end, var(--fill-color-default-end))}.igx-circular-svg__gradient-end{stop-color:var(--ig-circular-bar-fill-color-default-start, var(--fill-color-default-start))}.igx-circular-svg__inner{stroke-width:var(--stroke-thickness);stroke:var(--track-color)}.igx-circular-svg__outer{--_progress-percentage: calc(var(--_progress-whole, 0) / 100);transition:stroke-dashoffset var(--_transition-duration) linear;stroke-dasharray:calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416) calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416);stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416) - var(--_progress-percentage)*calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416))}.igx-circular-svg--indeterminate .igx-circular-svg__outer{stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)*2);animation:igx-indeterminate-accordion 1.5s cubic-bezier(0,.085,.68,.53) normal infinite}.igx-circular-svg--indeterminate:dir(rtl) .igx-circular-svg__outer{stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416) + var(--_progress-percentage)*calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416))}.igx-circular-svg:not(.igx-circular-svg--indeterminate) .igx-circular-svg__outer{animation:igx-initial-dashoffset var(--_transition-duration) linear;stroke-dasharray:calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416) calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416);stroke-dashoffset:calc(calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416) - var(--_progress-percentage)*calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416))}.igx-circular-svg:not(.igx-circular-svg--indeterminate):dir(rtl) .igx-circular-svg__outer{animation:igx-initial-dashoffset-rtl var(--_transition-duration) linear;animation-direction:reverse}}@layer ig.material{@container style(--ig-theme: material){.igx-circular-bar{--stroke-thickness: 1.3px;--scale-factor: 2.95}}}@layer ig.material{@container style(--ig-theme: material){.igx-circular-svg__outer{animation:igx-initial-dashoffset var(--_transition-duration) linear;stroke-width:calc(var(--stroke-thickness) + .046875rem)}.igx-circular-svg--indeterminate{animation:3s linear 0s infinite normal none running igx-rotate-center;transform-origin:50% 50%}.igx-circular-svg--indeterminate .igx-circular-svg__outer{animation:igx-indeterminate-accordion 1.5s cubic-bezier(0,.085,.68,.53) normal infinite;stroke-dasharray:calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416) calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)}.igx-circular-svg--indeterminate:dir(rtl){animation-direction:reverse}.igx-circular-svg--indeterminate:dir(rtl) .igx-circular-svg__outer{animation-direction:reverse}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-circular-bar{--stroke-thickness: 2px;--scale-factor: 3.05}.igx-circular-bar__text{font-weight:700}}}@layer ig.bootstrap{@container style(--ig-theme: bootstrap){.igx-circular-svg__outer{stroke-width:var(--stroke-thickness)}.igx-circular-svg--indeterminate{animation:3s linear 0s infinite normal none running igx-rotate-center;animation-duration:.75s}.igx-circular-svg--indeterminate:dir(rtl){animation-direction:reverse}.igx-circular-svg--indeterminate .igx-circular-svg__inner{stroke:#0000}.igx-circular-svg--indeterminate .igx-circular-svg__outer{stroke-dashoffset:60%;animation:none}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-circular-bar{--stroke-thickness: 2px;--scale-factor: 2.75}.igx-circular-bar__text{font-weight:700}}}@layer ig.fluent{@container style(--ig-theme: fluent){.igx-circular-svg__outer{stroke-width:var(--stroke-thickness);animation:igx-initial-dashoffset var(--_transition-duration) linear}.igx-circular-svg--indeterminate{transform-origin:50% 50%}.igx-circular-svg--indeterminate .igx-circular-svg__outer{stroke-linecap:round;animation:2s linear 0s infinite normal none running igx-indeterminate-circular-fluent;stroke-dasharray:289}.igx-circular-svg--indeterminate:dir(rtl){animation-direction:reverse}.igx-circular-svg--indeterminate:dir(rtl) .igx-circular-svg__outer{animation-direction:reverse}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-circular-bar{--stroke-thickness: 3px;--scale-factor: 3.4}}}@layer ig.indigo{@container style(--ig-theme: indigo){.igx-circular-svg__outer{stroke-width:var(--stroke-thickness);animation:igx-initial-dashoffset var(--_transition-duration) linear}.igx-circular-svg--indeterminate{animation:3s linear 0s infinite normal none running igx-rotate-center;transform-origin:50% 50%}.igx-circular-svg--indeterminate .igx-circular-svg__outer{animation:igx-indeterminate-accordion 1.5s cubic-bezier(0,.085,.68,.53) normal infinite;stroke-dasharray:calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416) calc(calc(var(--circular-size) / 2 - var(--stroke-thickness) * .5) * 2 * 3.1416)}.igx-circular-svg--indeterminate:dir(rtl){animation-direction:reverse}.igx-circular-svg--indeterminate:dir(rtl) .igx-circular-svg__outer{animation-direction:reverse}}}\n"] }]
         }], propDecorators: { cssClass: [{
@@ -701,11 +701,11 @@ const IGX_CIRCULAR_PROGRESS_BAR_DIRECTIVES = [
  * IMPORTANT: The following is NgModule exported for backwards-compatibility before standalone components
  */
 class IgxProgressBarModule {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxProgressBarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.1", ngImport: i0, type: IgxProgressBarModule, imports: [IgxLinearProgressBarComponent, IgxCircularProgressBarComponent, IgxProgressBarTextTemplateDirective, IgxProgressBarGradientDirective], exports: [IgxLinearProgressBarComponent, IgxCircularProgressBarComponent, IgxProgressBarTextTemplateDirective, IgxProgressBarGradientDirective] }); }
-    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxProgressBarModule }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxProgressBarModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "22.1.7", ngImport: i0, type: IgxProgressBarModule, imports: [IgxLinearProgressBarComponent, IgxCircularProgressBarComponent, IgxProgressBarTextTemplateDirective, IgxProgressBarGradientDirective], exports: [IgxLinearProgressBarComponent, IgxCircularProgressBarComponent, IgxProgressBarTextTemplateDirective, IgxProgressBarGradientDirective] }); }
+    static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxProgressBarModule }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.1", ngImport: i0, type: IgxProgressBarModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: IgxProgressBarModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [