Skip to content

Commit

Permalink
Merge branch 'master' into bugfix/#13435-fix-panelmenu-navigation
Browse files Browse the repository at this point in the history
  • Loading branch information
@cetincakiroglu
cetincakiroglu committed Aug 10, 2023
2 parents a784b79 + 3d5a4e2 commit a6b7c9b
Show file tree
Hide file tree
Showing 66 changed files with 942 additions and 342 deletions.
30 changes: 27 additions & 3 deletions src/app/components/accordion/accordion.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,11 +35,11 @@ import { UniqueComponentId } from 'primeng/utils';
selector: 'p-accordionTab',
template: `
<div class="p-accordion-tab" [class.p-accordion-tab-active]="selected" [ngClass]="tabStyleClass" [ngStyle]="tabStyle" [attr.data-pc-name]="'accordiontab'">
<div class="p-accordion-header" [class.p-highlight]="selected" [class.p-disabled]="disabled" [attr.data-p-disabled]="disabled" [attr.data-pc-section]="'header'">
<div class="p-accordion-header" role="heading" [attr.aria-level]="headerAriaLevel" [class.p-highlight]="selected" [class.p-disabled]="disabled" [attr.data-p-disabled]="disabled" [attr.data-pc-section]="'header'">
<a
[ngClass]="headerStyleClass"
[style]="headerStyle"
role="tab"
role="button"
class="p-accordion-header-link"
(click)="toggle($event)"
(keydown)="onKeydown($event)"
Expand Down Expand Up @@ -190,6 +190,11 @@ export class AccordionTab implements AfterContentInit, OnDestroy {
this.changeDetector.detectChanges();
}
}
/**
* The aria-level that each accordion header will have. The default value is 2 as per W3C specifications
* @group Props
*/
@Input() headerAriaLevel: number = 2;
/**
* Event triggered by changing the choice.
* @param {boolean} value - Boolean value indicates that the option is changed.
Expand Down Expand Up @@ -328,7 +333,7 @@ export class AccordionTab implements AfterContentInit, OnDestroy {
@Component({
selector: 'p-accordion',
template: `
<div [ngClass]="'p-accordion p-component'" [ngStyle]="style" [class]="styleClass" role="tablist">
<div [ngClass]="'p-accordion p-component'" [ngStyle]="style" [class]="styleClass">
<ng-content></ng-content>
</div>
`,
Expand Down Expand Up @@ -384,6 +389,20 @@ export class Accordion implements BlockableUI, AfterContentInit, OnDestroy {
* @group Props
*/
@Input() selectOnFocus: boolean = false;
/**
* The aria-level that each accordion header will have. The default value is 2 as per W3C specifications
* @group Props
*/
@Input() get headerAriaLevel(): number {
return this._headerAriaLevel;
}
set headerAriaLevel(val: number) {
if (typeof val === 'number' && val > 0) {
this._headerAriaLevel = val;
} else if (this._headerAriaLevel !== 2) {
this._headerAriaLevel = 2;
}
}
/**
* Callback to invoke when an active tab is collapsed by clicking on the header.
* @param {AccordionTabCloseEvent} event - Custom tab close event.
Expand All @@ -408,6 +427,7 @@ export class Accordion implements BlockableUI, AfterContentInit, OnDestroy {
tabListSubscription: Subscription | null = null;

private _activeIndex: any;
private _headerAriaLevel: number = 2;

preventActiveIndexPropagation: boolean = false;

Expand Down Expand Up @@ -536,6 +556,10 @@ export class Accordion implements BlockableUI, AfterContentInit, OnDestroy {
initTabs() {
this.tabs = (this.tabList as QueryList<AccordionTab>).toArray();

this.tabs.forEach(tab => {
tab.headerAriaLevel = this._headerAriaLevel;
})

this.updateSelectionState();
this.changeDetector.markForCheck();
}
Expand Down
4 changes: 4 additions & 0 deletions src/app/components/button/button.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -68,3 +68,7 @@
position: relative;
z-index: 1;
}

p-button[iconpos="right"] spinnericon {
order: 1;
}
29 changes: 22 additions & 7 deletions src/app/components/button/button.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -136,6 +136,11 @@ export class ButtonDirective implements AfterViewInit, OnDestroy {
if (!this.icon && this.label) {
styleClass.push(INTERNAL_BUTTON_CLASSES.labelOnly);
}

if(this.icon && !this.label && !ObjectUtils.isEmpty(this.htmlElement.textContent)){
styleClass.push(INTERNAL_BUTTON_CLASSES.iconOnly);
}

}

return styleClass;
Expand Down Expand Up @@ -199,22 +204,32 @@ export class ButtonDirective implements AfterViewInit, OnDestroy {

updateIcon() {
let iconElement = DomHandler.findSingle(this.htmlElement, '.p-button-icon');
let labelElement = DomHandler.findSingle(this.htmlElement, '.p-button-label');

if (!this.icon && !this.loading) {
iconElement && this.htmlElement.removeChild(iconElement);
return;
}

if(this.loading && !this.loadingIcon && iconElement) {
iconElement.innerHTML = this.spinnerIcon;
}

if (iconElement) {
if (this.iconPos) iconElement.className = 'p-button-icon p-button-icon-' + this.iconPos + ' ' + this.getIconClass();
else iconElement.className = 'p-button-icon ' + this.getIconClass();
if (this.iconPos) {
iconElement.className = 'p-button-icon ' + (labelElement ? 'p-button-icon-' + this.iconPos : '' )+ ' ' + this.getIconClass();
}
else {
iconElement.className = 'p-button-icon ' + this.getIconClass();
}
} else {
this.createIcon();
}
}


getIconClass() {
return this.loading ? 'p-button-loading-icon ' + (this.loadingIcon ? this.loadingIcon : 'p-icon') : this._icon;
return this.loading ? 'p-button-loading-icon ' + (this.loadingIcon ? this.loadingIcon : 'p-icon') : this.icon;
}

ngOnDestroy() {
Expand Down Expand Up @@ -244,10 +259,10 @@ export class ButtonDirective implements AfterViewInit, OnDestroy {
<ng-container *ngTemplateOutlet="contentTemplate"></ng-container>
<ng-container *ngIf="loading">
<ng-container *ngIf="!loadingIconTemplate">
<span *ngIf="loadingIcon" [class]="'p-button-loading-icon' + icon" [ngClass]="iconClass()"></span>
<span *ngIf="loadingIcon" [class]="'p-button-loading-icon pi-spin ' + loadingIcon" [ngClass]="iconClass()"></span>
<SpinnerIcon *ngIf="!loadingIcon" [styleClass]="spinnerIconClass()" [spin]="true" />
</ng-container>
<span *ngIf="loadingIconTemplate" class="p-button-loading-icon">
<span *ngIf="loadingIconTemplate" class="p-button-loading-icon" [ngClass]="iconClass()">
<ng-template *ngTemplateOutlet="loadingIconTemplate"></ng-template>
</span>
</ng-container>
Expand Down Expand Up @@ -377,11 +392,11 @@ export class Button implements AfterContentInit {
buttonClass() {
return {
'p-button p-component': true,
'p-button-icon-only': this.icon && !this.label,
'p-button-icon-only': (this.icon || this.iconTemplate || this.loadingIcon || this.loadingIconTemplate) && !this.label,
'p-button-vertical': (this.iconPos === 'top' || this.iconPos === 'bottom') && this.label,
'p-disabled': this.disabled || this.loading,
'p-button-loading': this.loading,
'p-button-loading-label-only': this.loading && !this.icon && this.label
'p-button-loading-label-only': this.loading && !this.icon && this.label && !this.loadingIcon && this.iconPos === 'left'
};
}

Expand Down
16 changes: 11 additions & 5 deletions src/app/components/contextmenu/contextmenu.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,12 +11,14 @@ import {
Inject,
Input,
NgModule,
OnChanges,
OnDestroy,
OnInit,
Output,
PLATFORM_ID,
QueryList,
Renderer2,
SimpleChanges,
TemplateRef,
ViewChild,
ViewContainerRef,
Expand Down Expand Up @@ -379,7 +381,13 @@ export class ContextMenu implements OnInit, AfterContentInit, OnDestroy {
* An array of menuitems.
* @group Props
*/
@Input() model: MenuItem[] | undefined;
@Input() set model(value: MenuItem[] | undefined) {
this._model = value;
this._processedItems = this.createProcessedItems(this._model || []);
}
get model(): MenuItem[] | undefined {
return this._model;
}
/**
* Event for which the menu must be displayed.
* @group Props
Expand Down Expand Up @@ -490,6 +498,8 @@ export class ContextMenu implements OnInit, AfterContentInit, OnDestroy {

_processedItems: any[];

_model: MenuItem[] | undefined;

get visibleItems() {
const processedItem = this.activeItemPath().find((p) => p.key === this.focusedItemInfo().parentKey);

Expand Down Expand Up @@ -917,10 +927,6 @@ export class ContextMenu implements OnInit, AfterContentInit, OnDestroy {
this.target = null;
}

if (this.appendTo) {
this.renderer.appendChild(this.el.nativeElement, this.containerViewChild?.nativeElement);
}

if (this.container && this.autoZIndex) {
ZIndexUtils.clear(this.container);
}
Expand Down
21 changes: 17 additions & 4 deletions src/app/components/inputnumber/inputnumber.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -440,9 +440,9 @@ export class InputNumber implements OnInit, AfterContentInit, OnChanges, Control

value: Nullable<number>;

onModelChange: Function = () => {};
onModelChange: Function = () => { };

onModelTouched: Function = () => {};
onModelTouched: Function = () => { };

focused: Nullable<boolean>;

Expand Down Expand Up @@ -482,7 +482,7 @@ export class InputNumber implements OnInit, AfterContentInit, OnChanges, Control

private ngControl: NgControl | null = null;

constructor(@Inject(DOCUMENT) private document: Document, public el: ElementRef, private cd: ChangeDetectorRef, private readonly injector: Injector) {}
constructor(@Inject(DOCUMENT) private document: Document, public el: ElementRef, private cd: ChangeDetectorRef, private readonly injector: Injector) { }

ngOnChanges(simpleChange: SimpleChanges) {
const props = ['locale', 'localeMatcher', 'mode', 'currency', 'currencyDisplay', 'useGrouping', 'minFractionDigits', 'maxFractionDigits', 'prefix', 'suffix'];
Expand Down Expand Up @@ -919,6 +919,12 @@ export class InputNumber implements OnInit, AfterContentInit, OnChanges, Control
event.preventDefault();
}

const newValue = this.parseValue(this.input.nativeElement.value + char);
const newValueStr = newValue != null ? newValue.toString() : '';
if (this.maxlength && newValueStr.length > this.maxlength) {
return;
}

if ((48 <= code && code <= 57) || isMinusSign || isDecimalSign) {
this.insert(event, char, { isDecimalSign, isMinusSign });
}
Expand Down Expand Up @@ -1214,6 +1220,13 @@ export class InputNumber implements OnInit, AfterContentInit, OnChanges, Control
} else {
let selectionStart = this.input.nativeElement.selectionStart;
let selectionEnd = this.input.nativeElement.selectionEnd;

if (this.maxlength && newValue.length > this.maxlength) {
newValue = newValue.slice(0, this.maxlength);
selectionStart = Math.min(selectionStart, this.maxlength);
selectionEnd = Math.min(selectionEnd, this.maxlength);
}

if (this.maxlength && this.maxlength < newValue.length) {
return;
}
Expand Down Expand Up @@ -1368,4 +1381,4 @@ export class InputNumber implements OnInit, AfterContentInit, OnChanges, Control
exports: [InputNumber, SharedModule],
declarations: [InputNumber]
})
export class InputNumberModule {}
export class InputNumberModule { }
4 changes: 2 additions & 2 deletions src/app/components/inputtextarea/inputtextarea.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -52,12 +52,12 @@ describe('InputTextarea', () => {
fixture.detectChanges();

const inputTextEl = fixture.debugElement.query(By.css('textarea'));
let cachedHeight = inputTextEl.nativeElement.style.height;
let cachedHeight = parseInt(inputTextEl.nativeElement.style.height);
inputTextEl.nativeElement.value = 'primeng';
inputTextEl.nativeElement.dispatchEvent(new Event('input'));
fixture.detectChanges();

expect(inputTextEl.nativeElement.style.height).toBeGreaterThan(cachedHeight);
expect(parseInt(inputTextEl.nativeElement.style.height)).toBeGreaterThan(cachedHeight);
expect(inputTextEl.nativeElement.style.overflow).toEqual('hidden');
});

Expand Down
18 changes: 14 additions & 4 deletions src/app/components/megamenu/megamenu.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -396,7 +396,13 @@ export class MegaMenu implements AfterContentInit, OnDestroy, OnInit {
* An array of menuitems.
* @group Props
*/
@Input() model: MegaMenuItem[] | undefined;
@Input() set model(value: MegaMenuItem[] | undefined) {
this._model = value;
this._processedItems = this.createProcessedItems(this._model || []);
}
get model(): MegaMenuItem[] | undefined {
return this._model;
}
/**
* Inline style of the element.
* @group Props
Expand Down Expand Up @@ -470,6 +476,8 @@ export class MegaMenu implements AfterContentInit, OnDestroy, OnInit {

_processedItems: any[];

_model: MegaMenuItem[] | undefined;

get visibleItems() {
const processedItem = ObjectUtils.isNotEmpty(this.activeItem()) ? this.activeItem() : null;

Expand Down Expand Up @@ -592,11 +600,13 @@ export class MegaMenu implements AfterContentInit, OnDestroy, OnInit {
}

onItemMouseEnter(event: any) {
if (this.dirty) {
this.onItemChange(event);
if(!DomHandler.isTouchDevice()) {
if (this.dirty) {
this.onItemChange(event);
}
}
}

scrollInView(index: number = -1) {
const id = index !== -1 ? `${this.id}_${index}` : this.focusedItemId;
const element = DomHandler.findSingle(this.rootmenu.el.nativeElement, `li[id="${id}"]`);
Expand Down
2 changes: 1 addition & 1 deletion src/app/components/menu/menu.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -128,7 +128,7 @@ describe('Menu', () => {
];
fixture.detectChanges();

const seperatorEl = fixture.debugElement.query(By.css('.p-menu-separator'));
const seperatorEl = fixture.debugElement.query(By.css('.p-menuitem-separator'));
const menuItemsEl = fixture.debugElement.queryAll(By.css('li'));
expect(seperatorEl).toBeTruthy();
expect(menuItemsEl.length).toEqual(4);
Expand Down
6 changes: 3 additions & 3 deletions src/app/components/menu/menu.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -159,7 +159,7 @@ export class MenuItemContent {
(keydown)="onListKeyDown($event)"
>
<ng-template ngFor let-submenu let-i="index" [ngForOf]="model" *ngIf="hasSubMenu()">
<li class="p-menu-separator" *ngIf="submenu.separator" [ngClass]="{ 'p-hidden': submenu.visible === false }" role="separator"></li>
<li class="p-menuitem-separator" *ngIf="submenu.separator" [ngClass]="{ 'p-hidden': submenu.visible === false }" role="separator"></li>
<li
class="p-submenu-header"
[attr.data-automationid]="submenu.automationId"
Expand All @@ -174,7 +174,7 @@ export class MenuItemContent {
<ng-template #htmlSubmenuLabel><span [innerHTML]="submenu.label | safeHtml"></span></ng-template>
</li>
<ng-template ngFor let-item let-j="index" [ngForOf]="submenu.items">
<li class="p-menu-separator" *ngIf="item.separator" [ngClass]="{ 'p-hidden': item.visible === false || submenu.visible === false }" role="separator"></li>
<li class="p-menuitem-separator" *ngIf="item.separator" [ngClass]="{ 'p-hidden': item.visible === false || submenu.visible === false }" role="separator"></li>
<li
class="p-menuitem"
*ngIf="!item.separator"
Expand All @@ -197,7 +197,7 @@ export class MenuItemContent {
</ng-template>
</ng-template>
<ng-template ngFor let-item let-i="index" [ngForOf]="model" *ngIf="!hasSubMenu()">
<li class="p-menu-separator" *ngIf="item.separator" [ngClass]="{ 'p-hidden': item.visible === false }" role="separator"></li>
<li class="p-menuitem-separator" *ngIf="item.separator" [ngClass]="{ 'p-hidden': item.visible === false }" role="separator"></li>
<li
class="p-menuitem"
*ngIf="!item.separator"
Expand Down
16 changes: 13 additions & 3 deletions src/app/components/menubar/menubar.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -401,7 +401,13 @@ export class Menubar implements AfterContentInit, OnDestroy, OnInit {
* An array of menuitems.
* @group Props
*/
@Input() model: MenuItem[] | undefined;
@Input() set model(value: MenuItem[] | undefined) {
this._model = value;
this._processedItems = this.createProcessedItems(this._model || []);
}
get model(): MenuItem[] | undefined {
return this._model;
}
/**
* Inline style of the element.
* @group Props
Expand Down Expand Up @@ -504,6 +510,8 @@ export class Menubar implements AfterContentInit, OnDestroy, OnInit {

_processedItems: any[];

_model: MenuItem[] | undefined;

get visibleItems() {
const processedItem = this.activeItemPath().find((p) => p.key === this.focusedItemInfo().parentKey);

Expand Down Expand Up @@ -636,8 +644,10 @@ export class Menubar implements AfterContentInit, OnDestroy, OnInit {
}

onItemMouseEnter(event: any) {
if (!this.mobileActive && this.dirty) {
this.onItemChange(event);
if(!DomHandler.isTouchDevice()) {
if (!this.mobileActive && this.dirty) {
this.onItemChange(event);
}
}
}

Expand Down
1 change: 1 addition & 0 deletions src/app/components/multiselect/multiselect.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -1088,6 +1088,7 @@ export class MultiSelect implements OnInit, AfterViewInit, AfterContentInit, Aft
this.updateFilledState();
this.updateLabel();
event.preventDefault();
event.stopPropagation();
}

checkAll() {
Expand Down
Loading

0 comments on commit a6b7c9b

Please sign in to comment.