From 425f936254345a5fd08b76e09d285ec4783dd4b3 Mon Sep 17 00:00:00 2001
From: Cory LaViska <cory@abeautifulsite.net>
Date: Mon, 6 Jun 2022 17:14:50 -0400
Subject: [PATCH] fixes #781

---
 docs/resources/changelog.md                      | 1 +
 src/components/icon-button/icon-button.styles.ts | 4 ++++
 src/components/icon-button/icon-button.ts        | 1 +
 3 files changed, 6 insertions(+)

diff --git a/docs/resources/changelog.md b/docs/resources/changelog.md
index 6267aba5..07f510f7 100644
--- a/docs/resources/changelog.md
+++ b/docs/resources/changelog.md
@@ -13,6 +13,7 @@ _During the beta period, these restrictions may be relaxed in the event of a mis
 - Fixed focus rings for `<sl-input>`, `<sl-select>`, and `<sl-textarea>` in Safari since they don't use `:focus-visible` [#767](https://github.com/shoelace-style/shoelace/issues/767)
 - Fixed a bug where calling `HTMLFormElement.reportValidity()` would skip Shoelace form controls [#772](https://github.com/shoelace-style/shoelace/issues/772)
 - Fixed a bug that prevented `<sl-tooltip>` from closing when disabled [#775](https://github.com/shoelace-style/shoelace/issues/775)
+- Fixed a bug that allowed `<sl-icon-button>` to emit a `click` event when disabled [#781](https://github.com/shoelace-style/shoelace/issues/781)
 - Improved the default icon for `<sl-image-comparer>` so it's more intuitive and removed `grip-vertical` from system icon library
 - Improved RTL styles for many components [#768](https://github.com/shoelace-style/shoelace/pull/768)
 - Revert menu item caching due to regression [#766](https://github.com/shoelace-style/shoelace/issues/766)
diff --git a/src/components/icon-button/icon-button.styles.ts b/src/components/icon-button/icon-button.styles.ts
index 94384c68..0d8472bb 100644
--- a/src/components/icon-button/icon-button.styles.ts
+++ b/src/components/icon-button/icon-button.styles.ts
@@ -46,4 +46,8 @@ export default css`
     outline: var(--sl-focus-ring);
     outline-offset: var(--sl-focus-ring-offset);
   }
+
+  .icon-button__icon {
+    pointer-events: none;
+  }
 `;
diff --git a/src/components/icon-button/icon-button.ts b/src/components/icon-button/icon-button.ts
index 010ef2c1..d1b02d7a 100644
--- a/src/components/icon-button/icon-button.ts
+++ b/src/components/icon-button/icon-button.ts
@@ -113,6 +113,7 @@ export default class SlIconButton extends LitElement {
         @click=${this.handleClick}
       >
         <sl-icon
+          class="icon-button__icon"
           name=${ifDefined(this.name)}
           library=${ifDefined(this.library)}
           src=${ifDefined(this.src)}