diff --git a/src/app/components/button/button.ts b/src/app/components/button/button.ts index fe19b3b6807..a47284d7231 100755 --- a/src/app/components/button/button.ts +++ b/src/app/components/button/button.ts @@ -300,10 +300,17 @@ export class ButtonDirective implements AfterViewInit, OnDestroy { let iconElement = DomHandler.findSingle(this.htmlElement, '.p-button-icon'); let labelElement = DomHandler.findSingle(this.htmlElement, '.p-button-label'); - if (this.loading && !this.loadingIcon && iconElement) { - iconElement.innerHTML = this.spinnerIcon; - } else if (iconElement?.innerHTML) { + if (this.loading) { + if (!this.loadingIcon && iconElement) { + iconElement.innerHTML = this.spinnerIcon; + } else if (this.loadingIcon && iconElement) { + iconElement.className = `p-button-icon ${this.loadingIcon}`; + } + } else if (this.icon && iconElement) { + iconElement.className = `p-button-icon ${this.icon}`; + } else if (iconElement) { iconElement.innerHTML = ''; + this.createIcon(); } if (iconElement) { @@ -360,7 +367,7 @@ export class ButtonDirective implements AfterViewInit, OnDestroy { - + {{ label }} @@ -523,14 +530,21 @@ export class Button implements AfterContentInit { } iconClass() { - return { - [`p-button-loading-icon pi-spin ${this.loadingIcon ?? ''}`]: this.loading, + const iconClasses = { 'p-button-icon': true, 'p-button-icon-left': this.iconPos === 'left' && this.label, 'p-button-icon-right': this.iconPos === 'right' && this.label, 'p-button-icon-top': this.iconPos === 'top' && this.label, 'p-button-icon-bottom': this.iconPos === 'bottom' && this.label }; + + if (this.loading) { + iconClasses[`p-button-loading-icon pi-spin ${this.loadingIcon ?? ''}`] = true; + } else if (this.icon) { + iconClasses[this.icon] = true; + } + + return iconClasses; } get buttonClass() { diff --git a/src/app/showcase/doc/apidoc/index.json b/src/app/showcase/doc/apidoc/index.json index f039c698085..a316803b222 100644 --- a/src/app/showcase/doc/apidoc/index.json +++ b/src/app/showcase/doc/apidoc/index.json @@ -22310,6 +22310,26 @@ ], "description": "Callback to invoke when default command button is clicked." }, + { + "name": "onMenuHide", + "parameters": [ + { + "name": "value", + "type": "any" + } + ], + "description": "Callback to invoke when overlay menu is hidden." + }, + { + "name": "onMenuShow", + "parameters": [ + { + "name": "value", + "type": "any" + } + ], + "description": "Callback to invoke when overlay menu is shown." + }, { "name": "onDropdownClick", "parameters": [