diff --git a/src/components/ha-chips.ts b/src/components/ha-chips.ts index 15a7c7569b..ffa7013d99 100644 --- a/src/components/ha-chips.ts +++ b/src/components/ha-chips.ts @@ -8,7 +8,7 @@ import { customElement, unsafeCSS, } from "lit-element"; - +import { ripple } from "@material/mwc-ripple/ripple-directive"; // @ts-ignore import chipStyles from "@material/chips/dist/mdc.chips.min.css"; import { fireEvent } from "../common/dom/fire_event"; @@ -33,22 +33,27 @@ export class HaChips extends LitElement { ${this.items.map( (item, idx) => html` - +
+
+ + + ${item} + + +
` )} `; } - private _handleClick(ev) { + private _handleClick(ev): void { fireEvent(this, "chip-clicked", { - index: ev.target.closest("button").index, + index: ev.currentTarget.index, }); } diff --git a/src/components/ha-fab.ts b/src/components/ha-fab.ts index a2d0103b7f..e4dbebff2c 100644 --- a/src/components/ha-fab.ts +++ b/src/components/ha-fab.ts @@ -1,6 +1,6 @@ import { classMap } from "lit-html/directives/class-map"; import { html, customElement } from "lit-element"; -import { ripple } from "@material/mwc-ripple/ripple-directive.js"; +import { ripple } from "@material/mwc-ripple/ripple-directive"; import "@material/mwc-fab"; import { Constructor } from "../types";