diff --git a/src/app/components/splitbutton/splitbutton.ts b/src/app/components/splitbutton/splitbutton.ts index 5602a5a4f98..6c643ecd524 100755 --- a/src/app/components/splitbutton/splitbutton.ts +++ b/src/app/components/splitbutton/splitbutton.ts @@ -52,7 +52,7 @@ type SplitButtonIconPosition = 'left' | 'right'; class="p-splitbutton-menubutton p-button-icon-only" (click)="onDropdownButtonClick($event)" (keydown)="onDropdownButtonKeydown($event)" - [disabled]="disabled" + [disabled]="menuButtonDisabled" [attr.aria-label]="menuButtonProps?.['aria-label'] || expandAriaLabel" [attr.aria-haspopup]="menuButtonProps?.['aria-haspopup'] || true" [attr.aria-expanded]="menuButtonProps?.['aria-expanded'] || isExpanded()" @@ -127,6 +127,11 @@ export class SplitButton { * @group Props */ @Input() disabled: boolean | undefined; + /** + * When present, it specifies that the element should be disabled. + * @group Props + */ + @Input() menuButtonDisabled: boolean | undefined; /** * Index of the element in tabbing order. * @group Prop diff --git a/src/app/showcase/doc/splitbutton/disableddoc.ts b/src/app/showcase/doc/splitbutton/disableddoc.ts index 7fc7b09cfe3..a9336333679 100644 --- a/src/app/showcase/doc/splitbutton/disableddoc.ts +++ b/src/app/showcase/doc/splitbutton/disableddoc.ts @@ -7,11 +7,16 @@ import { Code } from '../../domain/code'; template: `

When disabled is present, the element cannot be edited and focused.

+

You can now use menuButtonDisabled to disable menu icon button.

+
+ + +
`, providers: [MessageService] @@ -60,7 +65,15 @@ export class DisabledDoc {
-
`, + + + +
+ + + +
+`, typescript: ` import { Component } from '@angular/core';