Consolidate all icon button logic into <ha-icon-button> + ensure tooltip (#9230)

src/components/entity/ha-entity-attribute-picker.ts

@@ -1,4 +1,3 @@
-import "@material/mwc-icon-button/mwc-icon-button";
 import { mdiCheck, mdiClose, mdiMenuDown, mdiMenuUp } from "@mdi/js";
 import "@polymer/paper-input/paper-input";
 import "@polymer/paper-item/paper-item";
@@ -18,6 +17,7 @@ import { fireEvent } from "../../common/dom/fire_event";
 import { PolymerChangedEvent } from "../../polymer-types";
 import { HomeAssistant } from "../../types";
 import { formatAttributeName } from "../../util/hass-attributes-util";
+import "../ha-icon-button";
 import "../ha-svg-icon";
 import "./state-badge";
 
@@ -114,31 +114,27 @@ class HaEntityAttributePicker extends LitElement {
           <div class="suffix" slot="suffix">
             ${this.value
               ? html`
-                  <mwc-icon-button
+                  <ha-icon-button
                     .label=${this.hass.localize(
                       "ui.components.entity.entity-picker.clear"
                     )}
+                    .path=${mdiClose}
                     class="clear-button"
                     tabindex="-1"
                     @click=${this._clearValue}
                     no-ripple
-                  >
-                    <ha-svg-icon .path=${mdiClose}></ha-svg-icon>
-                  </mwc-icon-button>
+                  ></ha-icon-button>
                 `
               : ""}
 
-            <mwc-icon-button
+            <ha-icon-button
               .label=${this.hass.localize(
                 "ui.components.entity.entity-attribute-picker.show_attributes"
               )}
+              .path=${this._opened ? mdiMenuUp : mdiMenuDown}
               class="toggle-button"
               tabindex="-1"
-            >
-              <ha-svg-icon
-                .path=${this._opened ? mdiMenuUp : mdiMenuDown}
-              ></ha-svg-icon>
-            </mwc-icon-button>
+            ></ha-icon-button>
           </div>
         </paper-input>
       </vaadin-combo-box-light>
@@ -178,7 +174,7 @@ class HaEntityAttributePicker extends LitElement {
       .suffix {
         display: flex;
       }
-      mwc-icon-button {
+      ha-icon-button {
         --mdc-icon-button-size: 24px;
         padding: 0px 2px;
         color: var(--secondary-text-color);