fix(action-sheet): button icons are not announced by screen readers (#26640)

This commit is contained in:
Amanda Johnston
2023-01-19 14:50:05 -06:00
committed by GitHub
parent 77ccac0590
commit 22e9ff866f

View File

@ -287,7 +287,7 @@ export class ActionSheet implements ComponentInterface, OverlayInterface {
{buttons.map((b) => (
<button type="button" id={b.id} class={buttonClass(b)} onClick={() => this.buttonClick(b)}>
<span class="action-sheet-button-inner">
{b.icon && <ion-icon icon={b.icon} lazy={false} class="action-sheet-icon" />}
{b.icon && <ion-icon icon={b.icon} aria-hidden="true" lazy={false} class="action-sheet-icon" />}
{b.text}
</span>
{mode === 'md' && <ion-ripple-effect></ion-ripple-effect>}
@ -299,7 +299,9 @@ export class ActionSheet implements ComponentInterface, OverlayInterface {
<div class="action-sheet-group action-sheet-group-cancel">
<button type="button" class={buttonClass(cancelButton)} onClick={() => this.buttonClick(cancelButton)}>
<span class="action-sheet-button-inner">
{cancelButton.icon && <ion-icon icon={cancelButton.icon} lazy={false} class="action-sheet-icon" />}
{cancelButton.icon && (
<ion-icon icon={cancelButton.icon} aria-hidden="true" lazy={false} class="action-sheet-icon" />
)}
{cancelButton.text}
</span>
{mode === 'md' && <ion-ripple-effect></ion-ripple-effect>}