diff --git a/iconbutton/internal/icon-button.ts b/iconbutton/internal/icon-button.ts index fba4927f92..f8ad7765da 100644 --- a/iconbutton/internal/icon-button.ts +++ b/iconbutton/internal/icon-button.ts @@ -7,8 +7,8 @@ import '../../focus/md-focus-ring.js'; import '../../ripple/ripple.js'; -import {html, isServer, LitElement, nothing} from 'lit'; -import {property, state} from 'lit/decorators.js'; +import {html, LitElement, nothing} from 'lit'; +import {property, query, state} from 'lit/decorators.js'; import {classMap} from 'lit/directives/class-map.js'; import {literal, html as staticHtml} from 'lit/static-html.js'; @@ -144,10 +144,11 @@ export class IconButton extends iconButtonBaseClass implements FormSubmitter { @state() private flipIcon = isRtl(this, this.flipIconInRtl); - constructor() { - super(); - if (!isServer) { - this.addEventListener('click', this.handleClick.bind(this)); + @query('.button') private readonly buttonElement!: HTMLElement | null; + + override click() { + if (!this.disabled && this.buttonElement) { + this.buttonElement.click(); } } @@ -195,7 +196,7 @@ export class IconButton extends iconButtonBaseClass implements FormSubmitter { const {ariaLabel} = this as ARIAMixinStrict; return html` or