primeng 16.0.1 → 16.1.0

package/fesm2022/primeng-steps.mjs

@@ -1,9 +1,10 @@
 import * as i2 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import * as i0 from '@angular/core';
-import { EventEmitter, Component, ChangeDetectionStrategy, ViewEncapsulation, Input, Output, NgModule } from '@angular/core';
+import { EventEmitter, Component, ChangeDetectionStrategy, ViewEncapsulation, Input, Output, ViewChild, NgModule } from '@angular/core';
 import * as i1 from '@angular/router';
 import { RouterModule } from '@angular/router';
+import { DomHandler } from 'primeng/dom';
 import * as i3 from 'primeng/tooltip';
 import { TooltipModule } from 'primeng/tooltip';
 
@@ -40,12 +41,18 @@ class Steps {
      * @group Props
      */
     styleClass;
+    /**
+     * Whether to apply 'router-link-active-exact' class if route exactly matches the item path.
+     * @group Props
+     */
+    exact = true;
     /**
      * Callback to invoke when the new step is selected.
      * @param {number} number - current index.
      * @group Emits
      */
     activeIndexChange = new EventEmitter();
+    listViewChild;
     constructor(router, route, cd) {
         this.router = router;
         this.route = route;
@@ -55,7 +62,7 @@ class Steps {
     ngOnInit() {
         this.subscription = this.router.events.subscribe(() => this.cd.markForCheck());
     }
-    itemClick(event, item, i) {
+    onItemClick(event, item, i) {
         if (this.readonly || item.disabled) {
             event.preventDefault();
             return;
@@ -72,6 +79,78 @@ class Steps {
             });
         }
     }
+    onItemKeydown(event, item, i) {
+        switch (event.code) {
+            case 'ArrowRight': {
+                this.navigateToNextItem(event.target);
+                event.preventDefault();
+                break;
+            }
+            case 'ArrowLeft': {
+                this.navigateToPrevItem(event.target);
+                event.preventDefault();
+                break;
+            }
+            case 'Home': {
+                this.navigateToFirstItem(event.target);
+                event.preventDefault();
+                break;
+            }
+            case 'End': {
+                this.navigateToLastItem(event.target);
+                event.preventDefault();
+                break;
+            }
+            case 'Tab':
+                //no op
+                break;
+            case 'Enter':
+            case 'Space': {
+                this.onItemClick(event, item, i);
+                event.preventDefault();
+                break;
+            }
+            default:
+                break;
+        }
+    }
+    navigateToNextItem(target) {
+        const nextItem = this.findNextItem(target);
+        nextItem && this.setFocusToMenuitem(target, nextItem);
+    }
+    navigateToPrevItem(target) {
+        const prevItem = this.findPrevItem(target);
+        prevItem && this.setFocusToMenuitem(target, prevItem);
+    }
+    navigateToFirstItem(target) {
+        const firstItem = this.findFirstItem();
+        firstItem && this.setFocusToMenuitem(target, firstItem);
+    }
+    navigateToLastItem(target) {
+        const lastItem = this.findLastItem();
+        lastItem && this.setFocusToMenuitem(target, lastItem);
+    }
+    findNextItem(item) {
+        const nextItem = item.parentElement.nextElementSibling;
+        return nextItem ? nextItem.children[0] : null;
+    }
+    findPrevItem(item) {
+        const prevItem = item.parentElement.previousElementSibling;
+        return prevItem ? prevItem.children[0] : null;
+    }
+    findFirstItem() {
+        const firstSibling = DomHandler.findSingle(this.listViewChild.nativeElement, '[data-pc-section="menuitem"]');
+        return firstSibling ? firstSibling.children[0] : null;
+    }
+    findLastItem() {
+        const siblings = DomHandler.find(this.listViewChild.nativeElement, '[data-pc-section="menuitem"]');
+        return siblings ? siblings[siblings.length - 1].children[0] : null;
+    }
+    setFocusToMenuitem(target, focusableItem) {
+        target.tabIndex = '-1';
+        focusableItem.tabIndex = '0';
+        focusableItem.focus();
+    }
     isClickableRouterLink(item) {
         return item.routerLink && !this.readonly && !item.disabled;
     }
@@ -88,9 +167,9 @@ class Steps {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: Steps, deps: [{ token: i1.Router }, { token: i1.ActivatedRoute }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: Steps, selector: "p-steps", inputs: { activeIndex: "activeIndex", model: "model", readonly: "readonly", style: "style", styleClass: "styleClass" }, outputs: { activeIndexChange: "activeIndexChange" }, host: { classAttribute: "p-element" }, ngImport: i0, template: `
-        <div [ngClass]="{ 'p-steps p-component': true, 'p-readonly': readonly }" [ngStyle]="style" [class]="styleClass">
-            <ul role="tablist">
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.2", type: Steps, selector: "p-steps", inputs: { activeIndex: "activeIndex", model: "model", readonly: "readonly", style: "style", styleClass: "styleClass", exact: "exact" }, outputs: { activeIndexChange: "activeIndexChange" }, host: { classAttribute: "p-element" }, viewQueries: [{ propertyName: "listViewChild", first: true, predicate: ["list"], descendants: true }], ngImport: i0, template: `
+        <nav [ngClass]="{ 'p-steps p-component': true, 'p-readonly': readonly }" [ngStyle]="style" [class]="styleClass" [attr.data-pc-name]="'steps'">
+            <ul #list role="tablist" [attr.data-pc-section]="'menu'">
                 <li
                     *ngFor="let item of model; let i = index"
                     class="p-steps-item"
@@ -103,6 +182,7 @@ class Steps {
                     pTooltip
                     [tooltipOptions]="item.tooltipOptions"
                     [ngClass]="{ 'p-highlight p-steps-current': isActive(item, i), 'p-disabled': item.disabled || (readonly && !isActive(item, i)) }"
+                    [attr.data-pc-section]="'menuitem'"
                 >
                     <a
                         *ngIf="isClickableRouterLink(item); else elseBlock"
@@ -112,17 +192,18 @@ class Steps {
                         [routerLinkActive]="'p-menuitem-link-active'"
                         [routerLinkActiveOptions]="item.routerLinkActiveOptions || { exact: false }"
                         class="p-menuitem-link"
-                        (click)="itemClick($event, item, i)"
-                        (keydown.enter)="itemClick($event, item, i)"
+                        (click)="onItemClick($event, item, i)"
+                        (keydown)="onItemKeydown($event, item, i)"
                         [target]="item.target"
                         [attr.id]="item.id"
-                        [attr.tabindex]="item.disabled || readonly ? null : item.tabindex ? item.tabindex : '0'"
+                        [attr.tabindex]="item.disabled || readonly ? null : item.tabindex ? item.tabindex : '-1'"
                         [fragment]="item.fragment"
                         [queryParamsHandling]="item.queryParamsHandling"
                         [preserveFragment]="item.preserveFragment"
                         [skipLocationChange]="item.skipLocationChange"
                         [replaceUrl]="item.replaceUrl"
                         [state]="item.state"
+                        [ariaCurrentWhenActive]="exact ? 'step' : undefined"
                     >
                         <span class="p-steps-number">{{ i + 1 }}</span>
                         <span class="p-steps-title" *ngIf="item.escape !== false; else htmlLabel">{{ item.label }}</span>
@@ -133,11 +214,12 @@ class Steps {
                             [attr.href]="item.url"
                             class="p-menuitem-link"
                             role="presentation"
-                            (click)="itemClick($event, item, i)"
-                            (keydown.enter)="itemClick($event, item, i)"
+                            (click)="onItemClick($event, item, i)"
+                            (keydown)="onItemKeydown($event, item, i)"
                             [target]="item.target"
                             [attr.id]="item.id"
-                            [attr.tabindex]="item.disabled || (i !== activeIndex && readonly) ? null : item.tabindex ? item.tabindex : '0'"
+                            [attr.tabindex]="item.disabled || (i !== activeIndex && readonly) ? null : item.tabindex ? item.tabindex : '-1'"
+                            [ariaCurrentWhenActive]="exact ? 'step' : undefined"
                         >
                             <span class="p-steps-number">{{ i + 1 }}</span>
                             <span class="p-steps-title" *ngIf="item.escape !== false; else htmlRouteLabel">{{ item.label }}</span>
@@ -146,14 +228,14 @@ class Steps {
                     </ng-template>
                 </li>
             </ul>
-        </div>
+        </nav>
     `, isInline: true, styles: [".p-steps{position:relative}.p-steps ul{padding:0;margin:0;list-style-type:none;display:flex}.p-steps-item{position:relative;display:flex;justify-content:center;flex:1 1 auto}.p-steps-item .p-menuitem-link{display:inline-flex;flex-direction:column;align-items:center;overflow:hidden;text-decoration:none}.p-steps.p-steps-readonly .p-steps-item{cursor:auto}.p-steps-item.p-steps-current .p-menuitem-link{cursor:default}.p-steps-title{white-space:nowrap}.p-steps-number{display:flex;align-items:center;justify-content:center}.p-steps-title{display:block}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i1.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: i3.Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "appendTo", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: Steps, decorators: [{
             type: Component,
             args: [{ selector: 'p-steps', template: `
-        <div [ngClass]="{ 'p-steps p-component': true, 'p-readonly': readonly }" [ngStyle]="style" [class]="styleClass">
-            <ul role="tablist">
+        <nav [ngClass]="{ 'p-steps p-component': true, 'p-readonly': readonly }" [ngStyle]="style" [class]="styleClass" [attr.data-pc-name]="'steps'">
+            <ul #list role="tablist" [attr.data-pc-section]="'menu'">
                 <li
                     *ngFor="let item of model; let i = index"
                     class="p-steps-item"
@@ -166,6 +248,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImpor
                     pTooltip
                     [tooltipOptions]="item.tooltipOptions"
                     [ngClass]="{ 'p-highlight p-steps-current': isActive(item, i), 'p-disabled': item.disabled || (readonly && !isActive(item, i)) }"
+                    [attr.data-pc-section]="'menuitem'"
                 >
                     <a
                         *ngIf="isClickableRouterLink(item); else elseBlock"
@@ -175,17 +258,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImpor
                         [routerLinkActive]="'p-menuitem-link-active'"
                         [routerLinkActiveOptions]="item.routerLinkActiveOptions || { exact: false }"
                         class="p-menuitem-link"
-                        (click)="itemClick($event, item, i)"
-                        (keydown.enter)="itemClick($event, item, i)"
+                        (click)="onItemClick($event, item, i)"
+                        (keydown)="onItemKeydown($event, item, i)"
                         [target]="item.target"
                         [attr.id]="item.id"
-                        [attr.tabindex]="item.disabled || readonly ? null : item.tabindex ? item.tabindex : '0'"
+                        [attr.tabindex]="item.disabled || readonly ? null : item.tabindex ? item.tabindex : '-1'"
                         [fragment]="item.fragment"
                         [queryParamsHandling]="item.queryParamsHandling"
                         [preserveFragment]="item.preserveFragment"
                         [skipLocationChange]="item.skipLocationChange"
                         [replaceUrl]="item.replaceUrl"
                         [state]="item.state"
+                        [ariaCurrentWhenActive]="exact ? 'step' : undefined"
                     >
                         <span class="p-steps-number">{{ i + 1 }}</span>
                         <span class="p-steps-title" *ngIf="item.escape !== false; else htmlLabel">{{ item.label }}</span>
@@ -196,11 +280,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImpor
                             [attr.href]="item.url"
                             class="p-menuitem-link"
                             role="presentation"
-                            (click)="itemClick($event, item, i)"
-                            (keydown.enter)="itemClick($event, item, i)"
+                            (click)="onItemClick($event, item, i)"
+                            (keydown)="onItemKeydown($event, item, i)"
                             [target]="item.target"
                             [attr.id]="item.id"
-                            [attr.tabindex]="item.disabled || (i !== activeIndex && readonly) ? null : item.tabindex ? item.tabindex : '0'"
+                            [attr.tabindex]="item.disabled || (i !== activeIndex && readonly) ? null : item.tabindex ? item.tabindex : '-1'"
+                            [ariaCurrentWhenActive]="exact ? 'step' : undefined"
                         >
                             <span class="p-steps-number">{{ i + 1 }}</span>
                             <span class="p-steps-title" *ngIf="item.escape !== false; else htmlRouteLabel">{{ item.label }}</span>
@@ -209,7 +294,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImpor
                     </ng-template>
                 </li>
             </ul>
-        </div>
+        </nav>
     `, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         class: 'p-element'
                     }, styles: [".p-steps{position:relative}.p-steps ul{padding:0;margin:0;list-style-type:none;display:flex}.p-steps-item{position:relative;display:flex;justify-content:center;flex:1 1 auto}.p-steps-item .p-menuitem-link{display:inline-flex;flex-direction:column;align-items:center;overflow:hidden;text-decoration:none}.p-steps.p-steps-readonly .p-steps-item{cursor:auto}.p-steps-item.p-steps-current .p-menuitem-link{cursor:default}.p-steps-title{white-space:nowrap}.p-steps-number{display:flex;align-items:center;justify-content:center}.p-steps-title{display:block}\n"] }]
@@ -223,8 +308,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImpor
                 type: Input
             }], styleClass: [{
                 type: Input
+            }], exact: [{
+                type: Input
             }], activeIndexChange: [{
                 type: Output
+            }], listViewChild: [{
+                type: ViewChild,
+                args: ['list', { static: false }]
             }] } });
 class StepsModule {
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: StepsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });

package/fesm2022/primeng-steps.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"primeng-steps.mjs","sources":["../../src/app/components/steps/steps.ts","../../src/app/components/steps/primeng-steps.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, ChangeDetectorRef, Component, EventEmitter, Input, NgModule, OnDestroy, OnInit, Output, ViewEncapsulation } from '@angular/core';\nimport { ActivatedRoute, Router, RouterModule } from '@angular/router';\nimport { MenuItem } from 'primeng/api';\nimport { TooltipModule } from 'primeng/tooltip';\nimport { Subscription } from 'rxjs';\n/**\n * Steps components is an indicator for the steps in a wizard workflow.\n * @group Components\n */\n@Component({\n    selector: 'p-steps',\n    template: `\n        <div [ngClass]=\"{ 'p-steps p-component': true, 'p-readonly': readonly }\" [ngStyle]=\"style\" [class]=\"styleClass\">\n            <ul role=\"tablist\">\n                <li\n                    *ngFor=\"let item of model; let i = index\"\n                    class=\"p-steps-item\"\n                    #menuitem\n                    [ngStyle]=\"item.style\"\n                    [class]=\"item.styleClass\"\n                    role=\"tab\"\n                    [attr.aria-selected]=\"i === activeIndex\"\n                    [attr.aria-expanded]=\"i === activeIndex\"\n                    pTooltip\n                    [tooltipOptions]=\"item.tooltipOptions\"\n                    [ngClass]=\"{ 'p-highlight p-steps-current': isActive(item, i), 'p-disabled': item.disabled || (readonly && !isActive(item, i)) }\"\n                >\n                    <a\n                        *ngIf=\"isClickableRouterLink(item); else elseBlock\"\n                        [routerLink]=\"item.routerLink\"\n                        [queryParams]=\"item.queryParams\"\n                        role=\"presentation\"\n                        [routerLinkActive]=\"'p-menuitem-link-active'\"\n                        [routerLinkActiveOptions]=\"item.routerLinkActiveOptions || { exact: false }\"\n                        class=\"p-menuitem-link\"\n                        (click)=\"itemClick($event, item, i)\"\n                        (keydown.enter)=\"itemClick($event, item, i)\"\n                        [target]=\"item.target\"\n                        [attr.id]=\"item.id\"\n                        [attr.tabindex]=\"item.disabled || readonly ? null : item.tabindex ? item.tabindex : '0'\"\n                        [fragment]=\"item.fragment\"\n                        [queryParamsHandling]=\"item.queryParamsHandling\"\n                        [preserveFragment]=\"item.preserveFragment\"\n                        [skipLocationChange]=\"item.skipLocationChange\"\n                        [replaceUrl]=\"item.replaceUrl\"\n                        [state]=\"item.state\"\n                    >\n                        <span class=\"p-steps-number\">{{ i + 1 }}</span>\n                        <span class=\"p-steps-title\" *ngIf=\"item.escape !== false; else htmlLabel\">{{ item.label }}</span>\n                        <ng-template #htmlLabel><span class=\"p-steps-title\" [innerHTML]=\"item.label\"></span></ng-template>\n                    </a>\n                    <ng-template #elseBlock>\n                        <a\n                            [attr.href]=\"item.url\"\n                            class=\"p-menuitem-link\"\n                            role=\"presentation\"\n                            (click)=\"itemClick($event, item, i)\"\n                            (keydown.enter)=\"itemClick($event, item, i)\"\n                            [target]=\"item.target\"\n                            [attr.id]=\"item.id\"\n                            [attr.tabindex]=\"item.disabled || (i !== activeIndex && readonly) ? null : item.tabindex ? item.tabindex : '0'\"\n                        >\n                            <span class=\"p-steps-number\">{{ i + 1 }}</span>\n                            <span class=\"p-steps-title\" *ngIf=\"item.escape !== false; else htmlRouteLabel\">{{ item.label }}</span>\n                            <ng-template #htmlRouteLabel><span class=\"p-steps-title\" [innerHTML]=\"item.label\"></span></ng-template>\n                        </a>\n                    </ng-template>\n                </li>\n            </ul>\n        </div>\n    `,\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    styleUrls: ['./steps.css'],\n    host: {\n        class: 'p-element'\n    }\n})\nexport class Steps implements OnInit, OnDestroy {\n    /**\n     * Index of the active item.\n     * @group Props\n     */\n    @Input() activeIndex: number = 0;\n    /**\n     * An array of menu items.\n     * @group Props\n     */\n    @Input() model: MenuItem[] | undefined;\n    /**\n     * Whether the items are clickable or not.\n     * @group Props\n     */\n    @Input() readonly: boolean = true;\n    /**\n     * Inline style of the component.\n     * @group Props\n     */\n    @Input() style: { [klass: string]: any } | null | undefined;\n    /**\n     * Style class of the component.\n     * @group Props\n     */\n    @Input() styleClass: string | undefined;\n    /**\n     * Callback to invoke when the new step is selected.\n     * @param {number} number - current index.\n     * @group Emits\n     */\n    @Output() activeIndexChange: EventEmitter<number> = new EventEmitter<number>();\n\n    constructor(private router: Router, private route: ActivatedRoute, private cd: ChangeDetectorRef) {}\n\n    subscription: Subscription | undefined;\n\n    ngOnInit() {\n        this.subscription = this.router.events.subscribe(() => this.cd.markForCheck());\n    }\n\n    itemClick(event: Event, item: MenuItem, i: number) {\n        if (this.readonly || item.disabled) {\n            event.preventDefault();\n            return;\n        }\n\n        this.activeIndexChange.emit(i);\n\n        if (!item.url && !item.routerLink) {\n            event.preventDefault();\n        }\n\n        if (item.command) {\n            item.command({\n                originalEvent: event,\n                item: item,\n                index: i\n            });\n        }\n    }\n\n    isClickableRouterLink(item: MenuItem) {\n        return item.routerLink && !this.readonly && !item.disabled;\n    }\n\n    isActive(item: MenuItem, index: number) {\n        if (item.routerLink) {\n            let routerLink = Array.isArray(item.routerLink) ? item.routerLink : [item.routerLink];\n\n            return this.router.isActive(this.router.createUrlTree(routerLink, { relativeTo: this.route }).toString(), false);\n        }\n\n        return index === this.activeIndex;\n    }\n\n    ngOnDestroy() {\n        if (this.subscription) {\n            this.subscription.unsubscribe();\n        }\n    }\n}\n\n@NgModule({\n    imports: [CommonModule, RouterModule, TooltipModule],\n    exports: [Steps, RouterModule, TooltipModule],\n    declarations: [Steps]\n})\nexport class StepsModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"primeng-steps.mjs","sources":["../../src/app/components/steps/steps.ts","../../src/app/components/steps/primeng-steps.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\nimport { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, EventEmitter, Input, NgModule, OnDestroy, OnInit, Output, ViewChild, ViewEncapsulation } from '@angular/core';\nimport { ActivatedRoute, Router, RouterModule } from '@angular/router';\nimport { DomHandler } from 'primeng/dom';\nimport { Nullable } from 'primeng/ts-helpers';\nimport { MenuItem } from 'primeng/api';\nimport { TooltipModule } from 'primeng/tooltip';\nimport { Subscription } from 'rxjs';\n/**\n * Steps components is an indicator for the steps in a wizard workflow.\n * @group Components\n */\n@Component({\n    selector: 'p-steps',\n    template: `\n        <nav [ngClass]=\"{ 'p-steps p-component': true, 'p-readonly': readonly }\" [ngStyle]=\"style\" [class]=\"styleClass\" [attr.data-pc-name]=\"'steps'\">\n            <ul #list role=\"tablist\" [attr.data-pc-section]=\"'menu'\">\n                <li\n                    *ngFor=\"let item of model; let i = index\"\n                    class=\"p-steps-item\"\n                    #menuitem\n                    [ngStyle]=\"item.style\"\n                    [class]=\"item.styleClass\"\n                    role=\"tab\"\n                    [attr.aria-selected]=\"i === activeIndex\"\n                    [attr.aria-expanded]=\"i === activeIndex\"\n                    pTooltip\n                    [tooltipOptions]=\"item.tooltipOptions\"\n                    [ngClass]=\"{ 'p-highlight p-steps-current': isActive(item, i), 'p-disabled': item.disabled || (readonly && !isActive(item, i)) }\"\n                    [attr.data-pc-section]=\"'menuitem'\"\n                >\n                    <a\n                        *ngIf=\"isClickableRouterLink(item); else elseBlock\"\n                        [routerLink]=\"item.routerLink\"\n                        [queryParams]=\"item.queryParams\"\n                        role=\"presentation\"\n                        [routerLinkActive]=\"'p-menuitem-link-active'\"\n                        [routerLinkActiveOptions]=\"item.routerLinkActiveOptions || { exact: false }\"\n                        class=\"p-menuitem-link\"\n                        (click)=\"onItemClick($event, item, i)\"\n                        (keydown)=\"onItemKeydown($event, item, i)\"\n                        [target]=\"item.target\"\n                        [attr.id]=\"item.id\"\n                        [attr.tabindex]=\"item.disabled || readonly ? null : item.tabindex ? item.tabindex : '-1'\"\n                        [fragment]=\"item.fragment\"\n                        [queryParamsHandling]=\"item.queryParamsHandling\"\n                        [preserveFragment]=\"item.preserveFragment\"\n                        [skipLocationChange]=\"item.skipLocationChange\"\n                        [replaceUrl]=\"item.replaceUrl\"\n                        [state]=\"item.state\"\n                        [ariaCurrentWhenActive]=\"exact ? 'step' : undefined\"\n                    >\n                        <span class=\"p-steps-number\">{{ i + 1 }}</span>\n                        <span class=\"p-steps-title\" *ngIf=\"item.escape !== false; else htmlLabel\">{{ item.label }}</span>\n                        <ng-template #htmlLabel><span class=\"p-steps-title\" [innerHTML]=\"item.label\"></span></ng-template>\n                    </a>\n                    <ng-template #elseBlock>\n                        <a\n                            [attr.href]=\"item.url\"\n                            class=\"p-menuitem-link\"\n                            role=\"presentation\"\n                            (click)=\"onItemClick($event, item, i)\"\n                            (keydown)=\"onItemKeydown($event, item, i)\"\n                            [target]=\"item.target\"\n                            [attr.id]=\"item.id\"\n                            [attr.tabindex]=\"item.disabled || (i !== activeIndex && readonly) ? null : item.tabindex ? item.tabindex : '-1'\"\n                            [ariaCurrentWhenActive]=\"exact ? 'step' : undefined\"\n                        >\n                            <span class=\"p-steps-number\">{{ i + 1 }}</span>\n                            <span class=\"p-steps-title\" *ngIf=\"item.escape !== false; else htmlRouteLabel\">{{ item.label }}</span>\n                            <ng-template #htmlRouteLabel><span class=\"p-steps-title\" [innerHTML]=\"item.label\"></span></ng-template>\n                        </a>\n                    </ng-template>\n                </li>\n            </ul>\n        </nav>\n    `,\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    styleUrls: ['./steps.css'],\n    host: {\n        class: 'p-element'\n    }\n})\nexport class Steps implements OnInit, OnDestroy {\n    /**\n     * Index of the active item.\n     * @group Props\n     */\n    @Input() activeIndex: number = 0;\n    /**\n     * An array of menu items.\n     * @group Props\n     */\n    @Input() model: MenuItem[] | undefined;\n    /**\n     * Whether the items are clickable or not.\n     * @group Props\n     */\n    @Input() readonly: boolean = true;\n    /**\n     * Inline style of the component.\n     * @group Props\n     */\n    @Input() style: { [klass: string]: any } | null | undefined;\n    /**\n     * Style class of the component.\n     * @group Props\n     */\n    @Input() styleClass: string | undefined;\n    /**\n     * Whether to apply 'router-link-active-exact' class if route exactly matches the item path.\n     * @group Props\n     */\n    @Input() exact: boolean = true;\n    /**\n     * Callback to invoke when the new step is selected.\n     * @param {number} number - current index.\n     * @group Emits\n     */\n    @Output() activeIndexChange: EventEmitter<number> = new EventEmitter<number>();\n\n    @ViewChild('list', { static: false }) listViewChild: Nullable<ElementRef>;\n\n    constructor(private router: Router, private route: ActivatedRoute, private cd: ChangeDetectorRef) {}\n\n    subscription: Subscription | undefined;\n\n    ngOnInit() {\n        this.subscription = this.router.events.subscribe(() => this.cd.markForCheck());\n    }\n\n    onItemClick(event: Event, item: MenuItem, i: number) {\n        if (this.readonly || item.disabled) {\n            event.preventDefault();\n            return;\n        }\n\n        this.activeIndexChange.emit(i);\n\n        if (!item.url && !item.routerLink) {\n            event.preventDefault();\n        }\n\n        if (item.command) {\n            item.command({\n                originalEvent: event,\n                item: item,\n                index: i\n            });\n        }\n    }\n\n    onItemKeydown(event: KeyboardEvent, item: MenuItem, i: number) {\n        switch (event.code) {\n            case 'ArrowRight': {\n                this.navigateToNextItem(event.target);\n                event.preventDefault();\n                break;\n            }\n\n            case 'ArrowLeft': {\n                this.navigateToPrevItem(event.target);\n                event.preventDefault();\n                break;\n            }\n\n            case 'Home': {\n                this.navigateToFirstItem(event.target);\n                event.preventDefault();\n                break;\n            }\n\n            case 'End': {\n                this.navigateToLastItem(event.target);\n                event.preventDefault();\n                break;\n            }\n\n            case 'Tab':\n                //no op\n                break;\n\n            case 'Enter':\n\n            case 'Space': {\n                this.onItemClick(event, item, i);\n                event.preventDefault();\n                break;\n            }\n\n            default:\n                break;\n        }\n    }\n\n    navigateToNextItem(target) {\n        const nextItem = this.findNextItem(target);\n\n        nextItem && this.setFocusToMenuitem(target, nextItem);\n    }\n    navigateToPrevItem(target) {\n        const prevItem = this.findPrevItem(target);\n\n        prevItem && this.setFocusToMenuitem(target, prevItem);\n    }\n    navigateToFirstItem(target) {\n        const firstItem = this.findFirstItem();\n\n        firstItem && this.setFocusToMenuitem(target, firstItem);\n    }\n    navigateToLastItem(target) {\n        const lastItem = this.findLastItem();\n\n        lastItem && this.setFocusToMenuitem(target, lastItem);\n    }\n    findNextItem(item) {\n        const nextItem = item.parentElement.nextElementSibling;\n\n        return nextItem ? nextItem.children[0] : null;\n    }\n    findPrevItem(item) {\n        const prevItem = item.parentElement.previousElementSibling;\n\n        return prevItem ? prevItem.children[0] : null;\n    }\n    findFirstItem() {\n        const firstSibling = DomHandler.findSingle(this.listViewChild.nativeElement, '[data-pc-section=\"menuitem\"]');\n\n        return firstSibling ? firstSibling.children[0] : null;\n    }\n    findLastItem() {\n        const siblings = DomHandler.find(this.listViewChild.nativeElement, '[data-pc-section=\"menuitem\"]');\n\n        return siblings ? siblings[siblings.length - 1].children[0] : null;\n    }\n    setFocusToMenuitem(target, focusableItem) {\n        target.tabIndex = '-1';\n        focusableItem.tabIndex = '0';\n        focusableItem.focus();\n    }\n\n    isClickableRouterLink(item: MenuItem) {\n        return item.routerLink && !this.readonly && !item.disabled;\n    }\n\n    isActive(item: MenuItem, index: number) {\n        if (item.routerLink) {\n            let routerLink = Array.isArray(item.routerLink) ? item.routerLink : [item.routerLink];\n\n            return this.router.isActive(this.router.createUrlTree(routerLink, { relativeTo: this.route }).toString(), false);\n        }\n\n        return index === this.activeIndex;\n    }\n\n    ngOnDestroy() {\n        if (this.subscription) {\n            this.subscription.unsubscribe();\n        }\n    }\n}\n\n@NgModule({\n    imports: [CommonModule, RouterModule, TooltipModule],\n    exports: [Steps, RouterModule, TooltipModule],\n    declarations: [Steps]\n})\nexport class StepsModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}

package/fesm2022/primeng-table.mjs

@@ -35,6 +35,7 @@ import { SortAltIcon } from 'primeng/icons/sortalt';
 import { SortAmountDownIcon } from 'primeng/icons/sortamountdown';
 import { SortAmountUpAltIcon } from 'primeng/icons/sortamountupalt';
 import { SpinnerIcon } from 'primeng/icons/spinner';
+import { FilterSlashIcon } from 'primeng/icons/filterslash';
 
 class TableService {
     sortSource = new Subject();
@@ -359,7 +360,7 @@ class Table {
     }
     set responsive(val) {
         this._responsive = val;
-        console.warn('responsive propery is deprecated as table is always responsive with scrollable behavior.');
+        console.warn('responsive property is deprecated as table is always responsive with scrollable behavior.');
     }
     _responsive;
     /**
@@ -443,7 +444,7 @@ class Table {
      */
     editMode = 'cell';
     /**
-     * One or more field names to use in row grouping.
+     * Field name to use in row grouping.
      * @group Props
      */
     groupRowsBy;
@@ -1019,6 +1020,7 @@ class Table {
     get processedData() {
         return this.filteredValue || this.value || [];
     }
+    _initialColWidths;
     dataToRender(data) {
         const _data = data || this.processedData;
         if (_data && this.paginator) {
@@ -2001,6 +2003,7 @@ class Table {
                 }
             }
             else if (this.columnResizeMode === 'expand') {
+                this._initialColWidths = this._totalTableWidth();
                 let tableWidth = this.tableViewChild?.nativeElement.offsetWidth + delta;
                 this.setResizeTableWidth(tableWidth + 'px');
                 this.resizeTableCells(newColumnWidth, null);
@@ -2016,16 +2019,20 @@ class Table {
         this.resizeHelperViewChild.nativeElement.style.display = 'none';
         DomHandler.removeClass(this.containerViewChild?.nativeElement, 'p-unselectable-text');
     }
-    resizeTableCells(newColumnWidth, nextColumnWidth) {
-        let colIndex = DomHandler.index(this.resizeColumnElement);
+    _totalTableWidth() {
         let widths = [];
-        const tableHead = DomHandler.findSingle(this.containerViewChild?.nativeElement, '.p-datatable-thead');
+        const tableHead = DomHandler.findSingle(this.containerViewChild.nativeElement, '.p-datatable-thead');
         let headers = DomHandler.find(tableHead, 'tr > th');
         headers.forEach((header) => widths.push(DomHandler.getOuterWidth(header)));
+        return widths;
+    }
+    resizeTableCells(newColumnWidth, nextColumnWidth) {
+        let colIndex = DomHandler.index(this.resizeColumnElement);
+        let width = this.columnResizeMode === 'expand' ? this._initialColWidths : this._totalTableWidth();
         this.destroyStyleElement();
         this.createStyleElement();
         let innerHTML = '';
-        widths.forEach((width, index) => {
+        width.forEach((width, index) => {
             let colWidth = index === colIndex ? newColumnWidth : nextColumnWidth && index === colIndex + 1 ? nextColumnWidth : width;
             let style = `width: ${colWidth}px !important; max-width: ${colWidth}px !important;`;
             innerHTML += `
@@ -5590,7 +5597,7 @@ class ColumnFilter {
                 <ng-container *ngTemplateOutlet="footerTemplate; context: { $implicit: field }"></ng-container>
             </div>
         </div>
-    `, isInline: true, dependencies: [{ kind: "directive", type: i0.forwardRef(function () { return i2.NgClass; }), selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i0.forwardRef(function () { return i2.NgForOf; }), selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i0.forwardRef(function () { return i2.NgIf; }), selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i0.forwardRef(function () { return i2.NgTemplateOutlet; }), selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i0.forwardRef(function () { return i5.Dropdown; }), selector: "p-dropdown", inputs: ["scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "filterPlaceholder", "filterLocale", "inputId", "selectId", "dataKey", "filterBy", "autofocus", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "overlayDirection", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i0.forwardRef(function () { return i6.NgControlStatus; }), selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i0.forwardRef(function () { return i6.NgModel; }), selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i0.forwardRef(function () { return i7.ButtonDirective; }), selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "component", type: i0.forwardRef(function () { return FilterIcon; }), selector: "FilterIcon" }, { kind: "component", type: i0.forwardRef(function () { return ColumnFilterFormElement; }), selector: "p-columnFilterFormElement", inputs: ["field", "type", "filterConstraint", "filterTemplate", "placeholder", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "locale", "localeMatcher", "currency", "currencyDisplay", "useGrouping"] }], animations: [trigger('overlayAnimation', [transition(':enter', [style({ opacity: 0, transform: 'scaleY(0.8)' }), animate('.12s cubic-bezier(0, 0, 0.2, 1)')]), transition(':leave', [animate('.1s linear', style({ opacity: 0 }))])])], encapsulation: i0.ViewEncapsulation.None });
+    `, isInline: true, dependencies: [{ kind: "directive", type: i0.forwardRef(function () { return i2.NgClass; }), selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i0.forwardRef(function () { return i2.NgForOf; }), selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i0.forwardRef(function () { return i2.NgIf; }), selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i0.forwardRef(function () { return i2.NgTemplateOutlet; }), selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i0.forwardRef(function () { return i5.Dropdown; }), selector: "p-dropdown", inputs: ["scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "filterPlaceholder", "filterLocale", "inputId", "selectId", "dataKey", "filterBy", "autofocus", "resetFilterOnHide", "dropdownIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "overlayDirection", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "directive", type: i0.forwardRef(function () { return i6.NgControlStatus; }), selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i0.forwardRef(function () { return i6.NgModel; }), selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i0.forwardRef(function () { return i7.ButtonDirective; }), selector: "[pButton]", inputs: ["iconPos", "loadingIcon", "label", "icon", "loading"] }, { kind: "component", type: i0.forwardRef(function () { return FilterIcon; }), selector: "FilterIcon" }, { kind: "component", type: i0.forwardRef(function () { return FilterSlashIcon; }), selector: "FilterSlashIcon" }, { kind: "component", type: i0.forwardRef(function () { return ColumnFilterFormElement; }), selector: "p-columnFilterFormElement", inputs: ["field", "type", "filterConstraint", "filterTemplate", "placeholder", "minFractionDigits", "maxFractionDigits", "prefix", "suffix", "locale", "localeMatcher", "currency", "currencyDisplay", "useGrouping"] }], animations: [trigger('overlayAnimation', [transition(':enter', [style({ opacity: 0, transform: 'scaleY(0.8)' }), animate('.12s cubic-bezier(0, 0, 0.2, 1)')]), transition(':leave', [animate('.1s linear', style({ opacity: 0 }))])])], encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: ColumnFilter, decorators: [{
             type: Component,
@@ -5991,7 +5998,8 @@ class TableModule {
             SortAmountUpAltIcon,
             SortAmountDownIcon,
             CheckIcon,
-            FilterIcon], exports: [Table, SharedModule, SortableColumn, FrozenColumn, RowGroupHeader, SelectableRow, RowToggler, ContextMenuRow, ResizableColumn, ReorderableColumn, EditableColumn, CellEditor, SortIcon, TableRadioButton, TableCheckbox, TableHeaderCheckbox, ReorderableRowHandle, ReorderableRow, SelectableRowDblClick, EditableRow, InitEditableRow, SaveEditableRow, CancelEditableRow, ColumnFilter, ColumnFilterFormElement, ScrollerModule] });
+            FilterIcon,
+            FilterSlashIcon], exports: [Table, SharedModule, SortableColumn, FrozenColumn, RowGroupHeader, SelectableRow, RowToggler, ContextMenuRow, ResizableColumn, ReorderableColumn, EditableColumn, CellEditor, SortIcon, TableRadioButton, TableCheckbox, TableHeaderCheckbox, ReorderableRowHandle, ReorderableRow, SelectableRowDblClick, EditableRow, InitEditableRow, SaveEditableRow, CancelEditableRow, ColumnFilter, ColumnFilterFormElement, ScrollerModule] });
     static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: TableModule, imports: [CommonModule,
             PaginatorModule,
             InputTextModule,
@@ -6010,7 +6018,8 @@ class TableModule {
             SortAmountUpAltIcon,
             SortAmountDownIcon,
             CheckIcon,
-            FilterIcon, SharedModule,
+            FilterIcon,
+            FilterSlashIcon, SharedModule,
             ScrollerModule] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImport: i0, type: TableModule, decorators: [{
@@ -6035,7 +6044,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.2", ngImpor
                         SortAmountUpAltIcon,
                         SortAmountDownIcon,
                         CheckIcon,
-                        FilterIcon
+                        FilterIcon,
+                        FilterSlashIcon
                     ],
                     exports: [
                         Table,