Add extensions to imports from inside packages;2C

.eslintrc.json

@@ -69,7 +69,7 @@
     "import/extensions": [
       2,
       "ignorePackages",
-      { "ts": "never", "js": "never" }
+      { "ts": "ignorePackages", "js": "ignorePackages" }
     ],
     "no-restricted-syntax": ["error", "LabeledStatement", "WithStatement"],
     "object-curly-newline": 0,

build-scripts/babel.js

@@ -24,6 +24,7 @@ const options = ({ latestBuild }) => ({
   ],
 });
 
+module.exports.options = options;
 module.exports.babelLoaderConfig = ({ latestBuild }) => {
   if (latestBuild === undefined) {
     throw Error("latestBuild not defined for babel loader config");

src/auth/ha-pick-auth-provider.ts

@@ -1,5 +1,5 @@
-import "@polymer/paper-item/paper-item";
-import "@polymer/paper-item/paper-item-body";
+import "@polymer/paper-item/paper-item.js";
+import "@polymer/paper-item/paper-item-body.js";
 import { html, LitElement, property } from "lit-element";
 import { fireEvent } from "../common/dom/fire_event";
 import "../components/ha-icon-next";

src/cards/ha-history_graph-card.js

@@ -1,7 +1,7 @@
-import "@polymer/paper-card/paper-card";
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import "@polymer/paper-card";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import { computeStateName } from "../common/entity/compute_state_name";
 import "../components/state-history-charts";
 import "../data/ha-state-history-data";

src/common/search/search-input.ts

@@ -1,5 +1,5 @@
 import "../../components/ha-icon-button";
-import "@polymer/paper-input/paper-input";
+import "@polymer/paper-input/paper-input.js";
 import {
   css,
   CSSResult,
@@ -8,7 +8,7 @@ import {
   property,
 } from "lit-element";
 import { html, TemplateResult } from "lit-html";
-import { classMap } from "lit-html/directives/class-map";
+import { classMap } from "lit-html/directives/class-map.js";
 import "../../components/ha-icon";
 import { fireEvent } from "../dom/fire_event";
 

src/components/buttons/ha-call-service-button.js

@@ -1,6 +1,6 @@
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import { showConfirmationDialog } from "../../dialogs/generic/show-dialog-box";
 import { EventsMixin } from "../../mixins/events-mixin";
 import "./ha-progress-button";

src/components/buttons/ha-progress-button.js

@@ -1,8 +1,8 @@
 import "@material/mwc-button";
-import "@polymer/paper-spinner/paper-spinner";
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import "@polymer/paper-spinner/paper-spinner.js";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 
 class HaProgressButton extends PolymerElement {
   static get template() {

src/components/data-table/ha-data-table.ts

@@ -10,9 +10,9 @@ import {
   query,
   TemplateResult,
 } from "lit-element";
-import { classMap } from "lit-html/directives/class-map";
-import { ifDefined } from "lit-html/directives/if-defined";
-import { styleMap } from "lit-html/directives/style-map";
+import { classMap } from "lit-html/directives/class-map.js";
+import { ifDefined } from "lit-html/directives/if-defined.js";
+import { styleMap } from "lit-html/directives/style-map.js";
 import { scroll } from "lit-virtualizer";
 // @ts-ignore
 // eslint-disable-next-line import/no-webpack-loader-syntax

src/components/device/ha-area-devices-picker.ts

@@ -1,10 +1,10 @@
-import "@material/mwc-button/mwc-button";
+import "@material/mwc-button";
 import "../ha-icon-button";
-import "@polymer/paper-input/paper-input";
-import "@polymer/paper-item/paper-item";
-import "@polymer/paper-item/paper-item-body";
-import "@polymer/paper-listbox/paper-listbox";
-import "@vaadin/vaadin-combo-box/theme/material/vaadin-combo-box-light";
+import "@polymer/paper-input/paper-input.js";
+import "@polymer/paper-item/paper-item.js";
+import "@polymer/paper-item/paper-item-body.js";
+import "@polymer/paper-listbox";
+import "@vaadin/vaadin-combo-box/theme/material/vaadin-combo-box-light.js";
 import { UnsubscribeFunc } from "home-assistant-js-websocket";
 import {
   css,

src/components/device/ha-device-automation-picker.ts

@@ -1,7 +1,7 @@
-import "@polymer/paper-input/paper-input";
-import "@polymer/paper-item/paper-item";
-import "@polymer/paper-item/paper-item-body";
-import "@polymer/paper-listbox/paper-listbox";
+import "@polymer/paper-input/paper-input.js";
+import "@polymer/paper-item/paper-item.js";
+import "@polymer/paper-item/paper-item-body.js";
+import "@polymer/paper-listbox";
 import {
   css,
   CSSResult,

src/components/device/ha-device-picker.ts

@@ -1,9 +1,9 @@
 import "../ha-icon-button";
-import "@polymer/paper-input/paper-input";
-import "@polymer/paper-item/paper-item";
-import "@polymer/paper-item/paper-item-body";
-import "@polymer/paper-listbox/paper-listbox";
-import "@vaadin/vaadin-combo-box/theme/material/vaadin-combo-box-light";
+import "@polymer/paper-input/paper-input.js";
+import "@polymer/paper-item/paper-item.js";
+import "@polymer/paper-item/paper-item-body.js";
+import "@polymer/paper-listbox";
+import "@vaadin/vaadin-combo-box/theme/material/vaadin-combo-box-light.js";
 import { UnsubscribeFunc } from "home-assistant-js-websocket";
 import {
   css,

src/components/dialog/ha-iron-focusables-helper.js

@@ -11,8 +11,8 @@ found at http://polymer.github.io/PATENTS.txt
 /*
   Fixes issue with not using shadow dom properly in iron-overlay-behavior/icon-focusables-helper.js
 */
-import { IronFocusablesHelper } from "@polymer/iron-overlay-behavior/iron-focusables-helper";
-import { dom } from "@polymer/polymer/lib/legacy/polymer.dom";
+import { IronFocusablesHelper } from "@polymer/iron-overlay-behavior/iron-focusables-helper.js";
+import { dom } from "@polymer/polymer/lib/legacy/polymer.dom.js";
 
 export const HaIronFocusablesHelper = {
   /**

src/components/dialog/ha-paper-dialog.ts

@@ -1,6 +1,6 @@
-import "@polymer/paper-dialog/paper-dialog";
-import type { PaperDialogElement } from "@polymer/paper-dialog/paper-dialog";
-import { mixinBehaviors } from "@polymer/polymer/lib/legacy/class";
+import "@polymer/paper-dialog";
+import type { PaperDialogElement } from "@polymer/paper-dialog";
+import { mixinBehaviors } from "@polymer/polymer/lib/legacy/class.js";
 import type { Constructor } from "../../types";
 import { HaIronFocusablesHelper } from "./ha-iron-focusables-helper";
 

src/components/entity/ha-chart-base.js

@@ -1,11 +1,11 @@
 /* eslint-plugin-disable lit */
-import { IronResizableBehavior } from "@polymer/iron-resizable-behavior/iron-resizable-behavior";
+import { IronResizableBehavior } from "@polymer/iron-resizable-behavior";
 import "../ha-icon-button";
-import { mixinBehaviors } from "@polymer/polymer/lib/legacy/class";
-import { timeOut } from "@polymer/polymer/lib/utils/async";
-import { Debouncer } from "@polymer/polymer/lib/utils/debounce";
-import { html } from "@polymer/polymer/lib/utils/html-tag";
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { mixinBehaviors } from "@polymer/polymer/lib/legacy/class.js";
+import { timeOut } from "@polymer/polymer/lib/utils/async.js";
+import { Debouncer } from "@polymer/polymer/lib/utils/debounce.js";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import { formatTime } from "../../common/datetime/format_time";
 
 // eslint-disable-next-line no-unused-vars

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

@@ -1,8 +1,8 @@
 import "../ha-icon-button";
-import "@polymer/paper-input/paper-input";
-import "@polymer/paper-item/paper-icon-item";
-import "@polymer/paper-item/paper-item-body";
-import "@vaadin/vaadin-combo-box/theme/material/vaadin-combo-box-light";
+import "@polymer/paper-input/paper-input.js";
+import "@polymer/paper-item/paper-icon-item.js";
+import "@polymer/paper-item/paper-item-body.js";
+import "@vaadin/vaadin-combo-box/theme/material/vaadin-combo-box-light.js";
 import { HassEntity } from "home-assistant-js-websocket";
 import {
   css,

src/components/entity/ha-state-icon.js

@@ -1,6 +1,6 @@
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import { stateIcon } from "../../common/entity/state_icon";
 import "../ha-icon";
 

src/components/entity/ha-state-label-badge.ts

@@ -9,7 +9,7 @@ import {
   PropertyValues,
   TemplateResult,
 } from "lit-element";
-import { classMap } from "lit-html/directives/class-map";
+import { classMap } from "lit-html/directives/class-map.js";
 import secondsToDuration from "../../common/datetime/seconds_to_duration";
 import { computeStateDisplay } from "../../common/entity/compute_state_display";
 import { computeStateDomain } from "../../common/entity/compute_state_domain";

src/components/entity/state-badge.ts

@@ -9,7 +9,7 @@ import {
   query,
   TemplateResult,
 } from "lit-element";
-import { ifDefined } from "lit-html/directives/if-defined";
+import { ifDefined } from "lit-html/directives/if-defined.js";
 import { computeActiveState } from "../../common/entity/compute_active_state";
 import { computeStateDomain } from "../../common/entity/compute_state_domain";
 import { stateIcon } from "../../common/entity/state_icon";

src/components/entity/state-info.js

@@ -1,6 +1,6 @@
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import { computeStateName } from "../../common/entity/compute_state_name";
 import { computeRTL } from "../../common/util/compute_rtl";
 import "../ha-relative-time";

src/components/ha-area-picker.ts

@@ -1,9 +1,9 @@
 import "./ha-icon-button";
-import "@polymer/paper-input/paper-input";
-import "@polymer/paper-item/paper-item";
-import "@polymer/paper-item/paper-item-body";
-import "@polymer/paper-listbox/paper-listbox";
-import "@vaadin/vaadin-combo-box/theme/material/vaadin-combo-box-light";
+import "@polymer/paper-input/paper-input.js";
+import "@polymer/paper-item/paper-item.js";
+import "@polymer/paper-item/paper-item-body.js";
+import "@polymer/paper-listbox";
+import "@vaadin/vaadin-combo-box/theme/material/vaadin-combo-box-light.js";
 import { UnsubscribeFunc } from "home-assistant-js-websocket";
 import {
   css,

src/components/ha-attributes.ts

@@ -8,7 +8,7 @@ import {
   property,
   TemplateResult,
 } from "lit-element";
-import { until } from "lit-html/directives/until";
+import { until } from "lit-html/directives/until.js";
 import hassAttributeUtil from "../util/hass-attributes-util";
 
 let jsYamlPromise: Promise<typeof import("js-yaml")>;

src/components/ha-button-menu.ts

@@ -9,7 +9,7 @@ import {
 } from "lit-element";
 import "@material/mwc-button";
 import "@material/mwc-menu";
-import "@material/mwc-list/mwc-list-item";
+import "@material/mwc-list/mwc-list-item.js";
 import type { Menu } from "@material/mwc-menu";
 
 import { haStyle } from "../resources/styles";

src/components/ha-checkbox.ts

@@ -1,6 +1,6 @@
 import "@material/mwc-checkbox";
 import type { Checkbox } from "@material/mwc-checkbox";
-import { style } from "@material/mwc-checkbox/mwc-checkbox-css";
+import { style } from "@material/mwc-checkbox/mwc-checkbox-css.js";
 import { css, CSSResult, customElement } from "lit-element";
 import type { Constructor } from "../types";
 

src/components/ha-chips.ts

@@ -1,6 +1,6 @@
 // @ts-ignore
 import chipStyles from "@material/chips/dist/mdc.chips.min.css";
-import { ripple } from "@material/mwc-ripple/ripple-directive";
+import { ripple } from "@material/mwc-ripple/ripple-directive.js";
 import {
   css,
   CSSResult,

src/components/ha-climate-control.js

@@ -1,8 +1,8 @@
-import "@polymer/iron-flex-layout/iron-flex-layout-classes";
+import "@polymer/iron-flex-layout/iron-flex-layout-classes.js";
 import "./ha-icon-button";
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import { EventsMixin } from "../mixins/events-mixin";
 
 /*

src/components/ha-climate-state.js

@@ -1,6 +1,6 @@
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import { CLIMATE_PRESET_NONE } from "../data/climate";
 import LocalizeMixin from "../mixins/localize-mixin";
 

src/components/ha-color-picker.js

@@ -1,6 +1,6 @@
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import { EventsMixin } from "../mixins/events-mixin";
 
 /**

src/components/ha-combo-box.js

@@ -1,10 +1,10 @@
 import "./ha-icon-button";
-import "@polymer/paper-input/paper-input";
-import "@polymer/paper-item/paper-item";
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import "@polymer/paper-input/paper-input.js";
+import "@polymer/paper-item/paper-item.js";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
-import "@vaadin/vaadin-combo-box/theme/material/vaadin-combo-box-light";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
+import "@vaadin/vaadin-combo-box/theme/material/vaadin-combo-box-light.js";
 import { EventsMixin } from "../mixins/events-mixin";
 
 class HaComboBox extends EventsMixin(PolymerElement) {

src/components/ha-cover-controls.js

@@ -1,7 +1,7 @@
 import "./ha-icon-button";
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import { UNAVAILABLE } from "../data/entity";
 import CoverEntity from "../util/cover-model";
 

src/components/ha-cover-tilt-controls.js

@@ -1,8 +1,8 @@
-import "@polymer/iron-flex-layout/iron-flex-layout-classes";
+import "@polymer/iron-flex-layout/iron-flex-layout-classes.js";
 import "./ha-icon-button";
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import { UNAVAILABLE } from "../data/entity";
 import CoverEntity from "../util/cover-model";
 

src/components/ha-date-input.ts

@@ -1,5 +1,5 @@
-import "@polymer/paper-input/paper-input";
-import type { PaperInputElement } from "@polymer/paper-input/paper-input";
+import "@polymer/paper-input/paper-input.js";
+import type { PaperInputElement } from "@polymer/paper-input/paper-input.js";
 import {
   css,
   customElement,

src/components/ha-demo-badge.js

@@ -1,6 +1,6 @@
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import "./ha-label-badge";
 
 class HaDemoBadge extends PolymerElement {

src/components/ha-dialog.ts

@@ -1,6 +1,6 @@
 import "@material/mwc-dialog";
 import type { Dialog } from "@material/mwc-dialog";
-import { style } from "@material/mwc-dialog/mwc-dialog-css";
+import { style } from "@material/mwc-dialog/mwc-dialog-css.js";
 import "./ha-icon-button";
 import { css, CSSResult, customElement, html } from "lit-element";
 import type { Constructor, HomeAssistant } from "../types";

src/components/ha-fab.ts

@@ -1,8 +1,8 @@
 import "@material/mwc-fab";
 import type { Fab } from "@material/mwc-fab";
-import { ripple } from "@material/mwc-ripple/ripple-directive";
+import { ripple } from "@material/mwc-ripple/ripple-directive.js";
 import { customElement, html, TemplateResult } from "lit-element";
-import { classMap } from "lit-html/directives/class-map";
+import { classMap } from "lit-html/directives/class-map.js";
 import type { Constructor } from "../types";
 import "./ha-icon";
 

src/components/ha-form/ha-form-boolean.ts

@@ -1,5 +1,5 @@
-import "@polymer/paper-checkbox/paper-checkbox";
-import type { PaperCheckboxElement } from "@polymer/paper-checkbox/paper-checkbox";
+import "@polymer/paper-checkbox";
+import type { PaperCheckboxElement } from "@polymer/paper-checkbox";
 import {
   css,
   CSSResult,

src/components/ha-form/ha-form-float.ts

@@ -1,5 +1,5 @@
-import "@polymer/paper-input/paper-input";
-import type { PaperInputElement } from "@polymer/paper-input/paper-input";
+import "@polymer/paper-input/paper-input.js";
+import type { PaperInputElement } from "@polymer/paper-input/paper-input.js";
 import {
   customElement,
   html,

src/components/ha-form/ha-form-integer.ts

@@ -1,7 +1,7 @@
-import "@polymer/paper-input/paper-input";
-import type { PaperInputElement } from "@polymer/paper-input/paper-input";
-import "@polymer/paper-slider/paper-slider";
-import type { PaperSliderElement } from "@polymer/paper-slider/paper-slider";
+import "@polymer/paper-input/paper-input.js";
+import type { PaperInputElement } from "@polymer/paper-input/paper-input.js";
+import "@polymer/paper-slider";
+import type { PaperSliderElement } from "@polymer/paper-slider";
 import {
   css,
   CSSResult,

src/components/ha-form/ha-form-multi_select.ts

@@ -1,9 +1,9 @@
-import "@polymer/paper-checkbox/paper-checkbox";
-import "@polymer/paper-input/paper-input";
-import "@polymer/paper-item/paper-icon-item";
-import "@polymer/paper-listbox/paper-listbox";
-import "@polymer/paper-menu-button/paper-menu-button";
-import "@polymer/paper-ripple/paper-ripple";
+import "@polymer/paper-checkbox";
+import "@polymer/paper-input/paper-input.js";
+import "@polymer/paper-item/paper-icon-item.js";
+import "@polymer/paper-listbox";
+import "@polymer/paper-menu-button";
+import "@polymer/paper-ripple";
 import {
   css,
   CSSResult,

src/components/ha-form/ha-form-select.ts

@@ -1,6 +1,6 @@
-import "@polymer/paper-dropdown-menu/paper-dropdown-menu";
-import "@polymer/paper-item/paper-item";
-import "@polymer/paper-listbox/paper-listbox";
+import "@polymer/paper-dropdown-menu/paper-dropdown-menu.js";
+import "@polymer/paper-item/paper-item.js";
+import "@polymer/paper-listbox";
 import {
   css,
   CSSResult,

src/components/ha-form/ha-form-string.ts

@@ -1,6 +1,6 @@
 import "../ha-icon-button";
-import "@polymer/paper-input/paper-input";
-import type { PaperInputElement } from "@polymer/paper-input/paper-input";
+import "@polymer/paper-input/paper-input.js";
+import type { PaperInputElement } from "@polymer/paper-input/paper-input.js";
 import {
   customElement,
   html,

src/components/ha-icon-input.ts

@@ -1,4 +1,4 @@
-import "@polymer/paper-input/paper-input";
+import "@polymer/paper-input/paper-input.js";
 import {
   css,
   customElement,

src/components/ha-icon.ts

@@ -1,4 +1,4 @@
-import "@polymer/iron-icon/iron-icon";
+import "@polymer/iron-icon";
 import { get, set, clear, Store } from "idb-keyval";
 import {
   customElement,

src/components/ha-label-badge.ts

@@ -7,7 +7,7 @@ import {
   PropertyValues,
   TemplateResult,
 } from "lit-element";
-import { classMap } from "lit-html/directives/class-map";
+import { classMap } from "lit-html/directives/class-map.js";
 import "./ha-icon";
 
 class HaLabelBadge extends LitElement {

src/components/ha-labeled-slider.js

@@ -1,6 +1,6 @@
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import "./ha-icon";
 import "./ha-paper-slider";
 

src/components/ha-paper-dropdown-menu.ts

@@ -1,4 +1,4 @@
-import "@polymer/paper-dropdown-menu/paper-dropdown-menu";
+import "@polymer/paper-dropdown-menu/paper-dropdown-menu.js";
 import { PolymerElement } from "@polymer/polymer";
 import { Constructor } from "../types";
 

src/components/ha-paper-slider.js

@@ -1,4 +1,4 @@
-import "@polymer/paper-slider/paper-slider";
+import "@polymer/paper-slider";
 
 /**
  * @polymer

src/components/ha-push-notifications-toggle.js

@@ -1,6 +1,6 @@
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import { getAppKey } from "../data/notify_html5";
 import { EventsMixin } from "../mixins/events-mixin";
 import "./ha-switch";

src/components/ha-relative-time.js

@@ -1,6 +1,6 @@
-import { dom } from "@polymer/polymer/lib/legacy/polymer.dom";
+import { dom } from "@polymer/polymer/lib/legacy/polymer.dom.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import relativeTime from "../common/datetime/relative_time";
 import LocalizeMixin from "../mixins/localize-mixin";
 

src/components/ha-service-description.js

@@ -1,6 +1,6 @@
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 
 class HaServiceDescription extends PolymerElement {
   static get template() {

src/components/ha-service-picker.js

@@ -1,6 +1,6 @@
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import LocalizeMixin from "../mixins/localize-mixin";
 import "./ha-combo-box";
 

src/components/ha-sidebar.ts

@@ -1,10 +1,10 @@
 import { mdiBell, mdiCellphoneSettingsVariant } from "@mdi/js";
-import "@polymer/app-layout/app-toolbar/app-toolbar";
+import "@polymer/app-layout/app-toolbar/app-toolbar.js";
 import "./ha-icon-button";
-import "@polymer/paper-item/paper-icon-item";
-import type { PaperIconItemElement } from "@polymer/paper-item/paper-icon-item";
-import "@polymer/paper-item/paper-item";
-import "@polymer/paper-listbox/paper-listbox";
+import "@polymer/paper-item/paper-icon-item.js";
+import type { PaperIconItemElement } from "@polymer/paper-item/paper-icon-item.js";
+import "@polymer/paper-item/paper-item.js";
+import "@polymer/paper-listbox";
 import {
   css,
   CSSResult,
@@ -14,7 +14,7 @@ import {
   property,
   PropertyValues,
 } from "lit-element";
-import { classMap } from "lit-html/directives/class-map";
+import { classMap } from "lit-html/directives/class-map.js";
 import { fireEvent } from "../common/dom/fire_event";
 import { computeDomain } from "../common/entity/compute_domain";
 import { compare } from "../common/string/compare";

src/components/ha-switch.ts

@@ -1,7 +1,7 @@
-import { ripple } from "@material/mwc-ripple/ripple-directive";
+import { ripple } from "@material/mwc-ripple/ripple-directive.js";
 import "@material/mwc-switch";
 import type { Switch } from "@material/mwc-switch";
-import { style } from "@material/mwc-switch/mwc-switch-css";
+import { style } from "@material/mwc-switch/mwc-switch-css.js";
 import {
   css,
   CSSResult,

src/components/ha-textarea.js

@@ -9,10 +9,10 @@ paper-textarea issue: https://github.com/PolymerElements/paper-input/issues/556
 WebKit issue: https://bugs.webkit.org/show_bug.cgi?id=174629
 */
 
-import "@polymer/paper-input/paper-textarea";
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import "@polymer/paper-input/paper-textarea.js";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 
 class HaTextarea extends PolymerElement {
   static get template() {

src/components/ha-toast.ts

@@ -1,5 +1,5 @@
-import "@polymer/paper-toast/paper-toast";
-import type { PaperToastElement } from "@polymer/paper-toast/paper-toast";
+import "@polymer/paper-toast";
+import type { PaperToastElement } from "@polymer/paper-toast";
 import type { Constructor } from "../types";
 
 const PaperToast = customElements.get("paper-toast") as Constructor<

src/components/ha-vacuum-state.js

@@ -1,7 +1,7 @@
 import "@material/mwc-button";
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import LocalizeMixin from "../mixins/localize-mixin";
 
 const STATES_INTERCEPTABLE = {

src/components/ha-water_heater-control.js

@@ -1,8 +1,8 @@
-import "@polymer/iron-flex-layout/iron-flex-layout-classes";
+import "@polymer/iron-flex-layout/iron-flex-layout-classes.js";
 import "./ha-icon-button";
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import { EventsMixin } from "../mixins/events-mixin";
 
 /*

src/components/ha-water_heater-state.js

@@ -1,6 +1,6 @@
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import { computeStateDisplay } from "../common/entity/compute_state_display";
 import LocalizeMixin from "../mixins/localize-mixin";
 

src/components/paper-time-input.js

@@ -16,13 +16,13 @@ Custom property | Description | Default
 `--paper-time-input-cotnainer` | Mixin applied to the inputs | `{}`
 `--paper-time-dropdown-input-cotnainer` | Mixin applied to the dropdown input | `{}`
 */
-import "@polymer/paper-dropdown-menu/paper-dropdown-menu";
-import "@polymer/paper-input/paper-input";
-import "@polymer/paper-item/paper-item";
-import "@polymer/paper-listbox/paper-listbox";
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import "@polymer/paper-dropdown-menu/paper-dropdown-menu.js";
+import "@polymer/paper-input/paper-input.js";
+import "@polymer/paper-item/paper-item.js";
+import "@polymer/paper-listbox";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 
 export class PaperTimeInput extends PolymerElement {
   static get template() {

src/components/state-history-chart-line.js

@@ -1,7 +1,7 @@
-import "@polymer/polymer/lib/utils/debounce";
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import "@polymer/polymer/lib/utils/debounce.js";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import { formatDateTimeWithSeconds } from "../common/datetime/format_date_time";
 import LocalizeMixin from "../mixins/localize-mixin";
 import "./entity/ha-chart-base";

src/components/state-history-chart-timeline.js

@@ -1,7 +1,7 @@
-import "@polymer/polymer/lib/utils/debounce";
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import "@polymer/polymer/lib/utils/debounce.js";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import { formatDateTimeWithSeconds } from "../common/datetime/format_date_time";
 import { computeRTL } from "../common/util/compute_rtl";
 import LocalizeMixin from "../mixins/localize-mixin";

src/components/state-history-charts.js

@@ -1,7 +1,7 @@
-import "@polymer/paper-spinner/paper-spinner";
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import "@polymer/paper-spinner/paper-spinner.js";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import LocalizeMixin from "../mixins/localize-mixin";
 import "./state-history-chart-line";
 import "./state-history-chart-timeline";

src/components/user/ha-user-picker.ts

@@ -1,9 +1,9 @@
-import "@polymer/paper-dropdown-menu/paper-dropdown-menu-light";
+import "@polymer/paper-dropdown-menu/paper-dropdown-menu-light.js";
 import "../ha-icon-button";
-import "@polymer/paper-input/paper-input";
-import "@polymer/paper-item/paper-icon-item";
-import "@polymer/paper-item/paper-item-body";
-import "@polymer/paper-listbox/paper-listbox";
+import "@polymer/paper-input/paper-input.js";
+import "@polymer/paper-item/paper-icon-item.js";
+import "@polymer/paper-item/paper-item-body.js";
+import "@polymer/paper-listbox";
 import {
   css,
   CSSResult,

src/data/collection.ts

@@ -4,7 +4,7 @@ import {
   getCollection,
   UnsubscribeFunc,
 } from "home-assistant-js-websocket";
-import { Store } from "home-assistant-js-websocket/dist/store";
+import { Store } from "home-assistant-js-websocket/dist/store.js";
 
 interface OptimisticCollection<T> extends Collection<T> {
   save(data: T): Promise<unknown>;

src/data/ha-state-history-data.js

@@ -1,7 +1,7 @@
-import { timeOut } from "@polymer/polymer/lib/utils/async";
-import { Debouncer } from "@polymer/polymer/lib/utils/debounce";
+import { timeOut } from "@polymer/polymer/lib/utils/async.js";
+import { Debouncer } from "@polymer/polymer/lib/utils/debounce.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import LocalizeMixin from "../mixins/localize-mixin";
 import { getRecent, getRecentWithCache } from "./cached-history";
 import { computeHistory, fetchDate } from "./history";

src/dialogs/config-entry-system-options/dialog-config-entry-system-options.ts

@@ -1,5 +1,5 @@
-import "@polymer/paper-dialog-scrollable/paper-dialog-scrollable";
-import "@polymer/paper-input/paper-input";
+import "@polymer/paper-dialog-scrollable";
+import "@polymer/paper-input/paper-input.js";
 import {
   css,
   CSSResult,

src/dialogs/config-flow/dialog-data-entry-flow.ts

@@ -1,8 +1,8 @@
 import "@material/mwc-button";
-import "@polymer/paper-dialog-scrollable/paper-dialog-scrollable";
+import "@polymer/paper-dialog-scrollable";
 import "../../components/ha-icon-button";
-import "@polymer/paper-spinner/paper-spinner";
-import "@polymer/paper-tooltip/paper-tooltip";
+import "@polymer/paper-spinner/paper-spinner.js";
+import "@polymer/paper-tooltip";
 import type { UnsubscribeFunc } from "home-assistant-js-websocket";
 import {
   css,

src/dialogs/config-flow/step-flow-create-entry.ts

@@ -1,7 +1,7 @@
 import "@material/mwc-button";
-import "@polymer/paper-dropdown-menu/paper-dropdown-menu-light";
-import "@polymer/paper-item/paper-item";
-import "@polymer/paper-listbox/paper-listbox";
+import "@polymer/paper-dropdown-menu/paper-dropdown-menu-light.js";
+import "@polymer/paper-item/paper-item.js";
+import "@polymer/paper-listbox";
 import {
   css,
   CSSResultArray,

src/dialogs/config-flow/step-flow-form.ts

@@ -1,6 +1,6 @@
 import "@material/mwc-button";
-import "@polymer/paper-spinner/paper-spinner";
-import "@polymer/paper-tooltip/paper-tooltip";
+import "@polymer/paper-spinner/paper-spinner.js";
+import "@polymer/paper-tooltip";
 import {
   css,
   CSSResultArray,

src/dialogs/config-flow/step-flow-loading.ts

@@ -1,4 +1,4 @@
-import "@polymer/paper-spinner/paper-spinner-lite";
+import "@polymer/paper-spinner/paper-spinner-lite.js";
 import {
   css,
   CSSResult,

src/dialogs/config-flow/step-flow-pick-handler.ts

@@ -1,6 +1,6 @@
-import "@polymer/paper-item/paper-icon-item";
-import "@polymer/paper-item/paper-item-body";
-import "@polymer/paper-spinner/paper-spinner-lite";
+import "@polymer/paper-item/paper-icon-item.js";
+import "@polymer/paper-item/paper-item-body.js";
+import "@polymer/paper-spinner/paper-spinner-lite.js";
 import * as Fuse from "fuse.js";
 import {
   css,
@@ -11,8 +11,8 @@ import {
   property,
   TemplateResult,
 } from "lit-element";
-import { classMap } from "lit-html/directives/class-map";
-import { styleMap } from "lit-html/directives/style-map";
+import { classMap } from "lit-html/directives/class-map.js";
+import { styleMap } from "lit-html/directives/style-map.js";
 import memoizeOne from "memoize-one";
 import { fireEvent } from "../../common/dom/fire_event";
 import "../../common/search/search-input";

src/dialogs/device-registry-detail/dialog-device-registry-detail.ts

@@ -1,9 +1,9 @@
-import "@material/mwc-button/mwc-button";
-import "@polymer/paper-dialog-scrollable/paper-dialog-scrollable";
-import "@polymer/paper-dropdown-menu/paper-dropdown-menu";
-import "@polymer/paper-input/paper-input";
-import "@polymer/paper-item/paper-item";
-import "@polymer/paper-listbox/paper-listbox";
+import "@material/mwc-button";
+import "@polymer/paper-dialog-scrollable";
+import "@polymer/paper-dropdown-menu/paper-dropdown-menu.js";
+import "@polymer/paper-input/paper-input.js";
+import "@polymer/paper-item/paper-item.js";
+import "@polymer/paper-listbox";
 import {
   css,
   CSSResult,

src/dialogs/domain-toggler/dialog-domain-toggler.ts

@@ -1,4 +1,4 @@
-import "@material/mwc-button/mwc-button";
+import "@material/mwc-button";
 import {
   css,
   CSSResultArray,

src/dialogs/generic/dialog-box.ts

@@ -1,6 +1,6 @@
-import "@material/mwc-button/mwc-button";
-import "@polymer/paper-dialog-scrollable/paper-dialog-scrollable";
-import "@polymer/paper-input/paper-input";
+import "@material/mwc-button";
+import "@polymer/paper-dialog-scrollable";
+import "@polymer/paper-input/paper-input.js";
 import {
   css,
   CSSResult,
@@ -10,7 +10,7 @@ import {
   property,
   TemplateResult,
 } from "lit-element";
-import { classMap } from "lit-html/directives/class-map";
+import { classMap } from "lit-html/directives/class-map.js";
 import "../../components/dialog/ha-paper-dialog";
 import "../../components/ha-switch";
 import { PolymerChangedEvent } from "../../polymer-types";

src/dialogs/ha-more-info-dialog.js

@@ -1,8 +1,8 @@
-import "@polymer/paper-dialog-behavior/paper-dialog-shared-styles";
-import "@polymer/paper-dialog-scrollable/paper-dialog-scrollable";
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import "@polymer/paper-dialog-behavior/paper-dialog-shared-styles.js";
+import "@polymer/paper-dialog-scrollable";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import { computeStateDomain } from "../common/entity/compute_state_domain";
 import DialogMixin from "../mixins/dialog-mixin";
 import "../resources/ha-style";

src/dialogs/ha-store-auth-card.js

@@ -1,7 +1,7 @@
-import "@polymer/paper-card/paper-card";
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import "@polymer/paper-card";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import { enableWrite } from "../common/auth/token_storage";
 import LocalizeMixin from "../mixins/localize-mixin";
 import "../resources/ha-style";

src/dialogs/more-info/controls/more-info-alarm_control_panel.js

@@ -1,9 +1,9 @@
 import "@material/mwc-button";
-import "@polymer/iron-flex-layout/iron-flex-layout-classes";
-import "@polymer/paper-input/paper-input";
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import "@polymer/iron-flex-layout/iron-flex-layout-classes.js";
+import "@polymer/paper-input/paper-input.js";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import { fireEvent } from "../../../common/dom/fire_event";
 import LocalizeMixin from "../../../mixins/localize-mixin";
 

src/dialogs/more-info/controls/more-info-camera.ts

@@ -1,5 +1,5 @@
-import "@polymer/paper-checkbox/paper-checkbox";
-import type { PaperCheckboxElement } from "@polymer/paper-checkbox/paper-checkbox";
+import "@polymer/paper-checkbox";
+import type { PaperCheckboxElement } from "@polymer/paper-checkbox";
 import {
   css,
   CSSResult,

src/dialogs/more-info/controls/more-info-climate.ts

@@ -1,6 +1,6 @@
-import "@polymer/iron-flex-layout/iron-flex-layout-classes";
-import "@polymer/paper-item/paper-item";
-import "@polymer/paper-listbox/paper-listbox";
+import "@polymer/iron-flex-layout/iron-flex-layout-classes.js";
+import "@polymer/paper-item/paper-item.js";
+import "@polymer/paper-listbox";
 import {
   css,
   CSSResult,
@@ -10,7 +10,7 @@ import {
   PropertyValues,
   TemplateResult,
 } from "lit-element";
-import { classMap } from "lit-html/directives/class-map";
+import { classMap } from "lit-html/directives/class-map.js";
 import { fireEvent } from "../../../common/dom/fire_event";
 import { supportsFeature } from "../../../common/entity/supports-feature";
 import { computeRTLDirection } from "../../../common/util/compute_rtl";

src/dialogs/more-info/controls/more-info-configurator.js

@@ -1,11 +1,11 @@
 import "@material/mwc-button";
-import "@polymer/iron-flex-layout/iron-flex-layout-classes";
-import "@polymer/iron-input/iron-input";
-import "@polymer/paper-input/paper-input";
-import "@polymer/paper-spinner/paper-spinner";
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import "@polymer/iron-flex-layout/iron-flex-layout-classes.js";
+import "@polymer/iron-input";
+import "@polymer/paper-input/paper-input.js";
+import "@polymer/paper-spinner/paper-spinner.js";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import "../../../components/ha-markdown";
 
 class MoreInfoConfigurator extends PolymerElement {

src/dialogs/more-info/controls/more-info-cover.js

@@ -1,7 +1,7 @@
-import "@polymer/iron-flex-layout/iron-flex-layout-classes";
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import "@polymer/iron-flex-layout/iron-flex-layout-classes.js";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import { attributeClassNames } from "../../../common/entity/attribute_class_names";
 import { featureClassNames } from "../../../common/entity/feature_class_names";
 import "../../../components/ha-cover-tilt-controls";

src/dialogs/more-info/controls/more-info-fan.js

@@ -1,10 +1,10 @@
-import "@polymer/iron-flex-layout/iron-flex-layout-classes";
+import "@polymer/iron-flex-layout/iron-flex-layout-classes.js";
 import "../../../components/ha-icon-button";
-import "@polymer/paper-item/paper-item";
-import "@polymer/paper-listbox/paper-listbox";
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import "@polymer/paper-item/paper-item.js";
+import "@polymer/paper-listbox";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import { attributeClassNames } from "../../../common/entity/attribute_class_names";
 import "../../../components/ha-attributes";
 import "../../../components/ha-paper-dropdown-menu";

src/dialogs/more-info/controls/more-info-group.js

@@ -1,7 +1,7 @@
-import { dom } from "@polymer/polymer/lib/legacy/polymer.dom";
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import { dom } from "@polymer/polymer/lib/legacy/polymer.dom.js";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import dynamicContentUpdater from "../../../common/dom/dynamic_content_updater";
 import { computeStateDomain } from "../../../common/entity/compute_state_domain";
 import "../../../state-summary/state-card-content";

src/dialogs/more-info/controls/more-info-history_graph.js

@@ -1,6 +1,6 @@
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import "../../../cards/ha-history_graph-card";
 import "../../../components/ha-attributes";
 

src/dialogs/more-info/controls/more-info-input_datetime.js

@@ -1,9 +1,9 @@
-import "@polymer/iron-flex-layout/iron-flex-layout-classes";
-import "@polymer/paper-input/paper-input";
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import "@polymer/iron-flex-layout/iron-flex-layout-classes.js";
+import "@polymer/paper-input/paper-input.js";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
-import "@vaadin/vaadin-date-picker/theme/material/vaadin-date-picker";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
+import "@vaadin/vaadin-date-picker/theme/material/vaadin-date-picker.js";
 import { attributeClassNames } from "../../../common/entity/attribute_class_names";
 import "../../../components/ha-relative-time";
 import "../../../components/paper-time-input";

src/dialogs/more-info/controls/more-info-light.js

@@ -1,9 +1,9 @@
-import "@polymer/iron-flex-layout/iron-flex-layout-classes";
-import "@polymer/paper-item/paper-item";
-import "@polymer/paper-listbox/paper-listbox";
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import "@polymer/iron-flex-layout/iron-flex-layout-classes.js";
+import "@polymer/paper-item/paper-item.js";
+import "@polymer/paper-listbox";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import { featureClassNames } from "../../../common/entity/feature_class_names";
 import "../../../components/ha-attributes";
 import "../../../components/ha-color-picker";

src/dialogs/more-info/controls/more-info-lock.js

@@ -1,8 +1,8 @@
 import "@material/mwc-button";
-import "@polymer/paper-input/paper-input";
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import "@polymer/paper-input/paper-input.js";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import "../../../components/ha-attributes";
 import LocalizeMixin from "../../../mixins/localize-mixin";
 

src/dialogs/more-info/controls/more-info-media_player.js

@@ -1,10 +1,10 @@
-import "@polymer/iron-flex-layout/iron-flex-layout-classes";
+import "@polymer/iron-flex-layout/iron-flex-layout-classes.js";
 import "../../../components/ha-icon-button";
-import "@polymer/paper-item/paper-item";
-import "@polymer/paper-listbox/paper-listbox";
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import "@polymer/paper-item/paper-item.js";
+import "@polymer/paper-listbox";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import { isComponentLoaded } from "../../../common/config/is_component_loaded";
 import { attributeClassNames } from "../../../common/entity/attribute_class_names";
 import { computeRTLDirection } from "../../../common/util/compute_rtl";

src/dialogs/more-info/controls/more-info-vacuum.ts

@@ -1,7 +1,7 @@
 import "../../../components/ha-icon-button";
 import "../../../components/ha-icon";
-import "@polymer/paper-item/paper-item";
-import "@polymer/paper-listbox/paper-listbox";
+import "@polymer/paper-item/paper-item.js";
+import "@polymer/paper-listbox";
 import {
   css,
   CSSResult,

src/dialogs/more-info/controls/more-info-water_heater.js

@@ -1,11 +1,11 @@
-import "@polymer/iron-flex-layout/iron-flex-layout-classes";
-import "@polymer/paper-item/paper-item";
-import "@polymer/paper-listbox/paper-listbox";
-import { timeOut } from "@polymer/polymer/lib/utils/async";
-import { Debouncer } from "@polymer/polymer/lib/utils/debounce";
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import "@polymer/iron-flex-layout/iron-flex-layout-classes.js";
+import "@polymer/paper-item/paper-item.js";
+import "@polymer/paper-listbox";
+import { timeOut } from "@polymer/polymer/lib/utils/async.js";
+import { Debouncer } from "@polymer/polymer/lib/utils/debounce.js";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import { featureClassNames } from "../../../common/entity/feature_class_names";
 import { supportsFeature } from "../../../common/entity/supports-feature";
 import "../../../components/ha-paper-dropdown-menu";

src/dialogs/more-info/more-info-controls.js

@@ -1,10 +1,10 @@
 import "@material/mwc-button";
-import "@polymer/app-layout/app-toolbar/app-toolbar";
-import "@polymer/paper-dialog-scrollable/paper-dialog-scrollable";
+import "@polymer/app-layout/app-toolbar/app-toolbar.js";
+import "@polymer/paper-dialog-scrollable";
 import "../../components/ha-icon-button";
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import { isComponentLoaded } from "../../common/config/is_component_loaded";
 import { DOMAINS_MORE_INFO_NO_HISTORY } from "../../common/const";
 import { computeStateDomain } from "../../common/entity/compute_state_domain";

src/dialogs/mqtt-device-debug-info-dialog/dialog-mqtt-device-debug-info.ts

@@ -1,4 +1,4 @@
-import "@material/mwc-button/mwc-button";
+import "@material/mwc-button";
 import {
   css,
   CSSResult,

src/dialogs/mqtt-device-debug-info-dialog/mqtt-discovery-payload.ts

@@ -8,7 +8,7 @@ import {
   property,
   TemplateResult,
 } from "lit-element";
-import { classMap } from "lit-html/directives/class-map";
+import { classMap } from "lit-html/directives/class-map.js";
 
 @customElement("mqtt-discovery-payload")
 class MQTTDiscoveryPayload extends LitElement {

src/dialogs/mqtt-device-debug-info-dialog/mqtt-messages.ts

@@ -8,7 +8,7 @@ import {
   property,
   TemplateResult,
 } from "lit-element";
-import { classMap } from "lit-html/directives/class-map";
+import { classMap } from "lit-html/directives/class-map.js";
 import { formatTimeWithSeconds } from "../../common/datetime/format_time";
 import { HomeAssistant } from "../../types";
 import { MQTTMessage } from "../../data/mqtt";

src/dialogs/notifications/notification-drawer.js

@@ -1,9 +1,9 @@
 import "@material/mwc-button";
-import "@polymer/app-layout/app-drawer/app-drawer";
-import "@polymer/app-layout/app-toolbar/app-toolbar";
-import { html } from "@polymer/polymer/lib/utils/html-tag";
+import "@polymer/app-layout/app-drawer/app-drawer.js";
+import "@polymer/app-layout/app-toolbar/app-toolbar.js";
+import { html } from "@polymer/polymer/lib/utils/html-tag.js";
 /* eslint-plugin-disable lit */
-import { PolymerElement } from "@polymer/polymer/polymer-element";
+import { PolymerElement } from "@polymer/polymer/polymer-element.js";
 import { computeDomain } from "../../common/entity/compute_domain";
 import "../../components/ha-icon-button-prev";
 import { subscribeNotifications } from "../../data/persistent_notification";

src/dialogs/notifications/persistent-notification-item.ts

@@ -1,5 +1,5 @@
 import "@material/mwc-button";
-import "@polymer/paper-tooltip/paper-tooltip";
+import "@polymer/paper-tooltip";
 import {
   css,
   CSSResult,

src/dialogs/voice-command-dialog/ha-voice-command-dialog.ts

@@ -1,8 +1,8 @@
-import "@polymer/paper-dialog-scrollable/paper-dialog-scrollable";
-import type { PaperDialogScrollableElement } from "@polymer/paper-dialog-scrollable/paper-dialog-scrollable";
+import "@polymer/paper-dialog-scrollable";
+import type { PaperDialogScrollableElement } from "@polymer/paper-dialog-scrollable";
 import "../../components/ha-icon-button";
-import "@polymer/paper-input/paper-input";
-import type { PaperInputElement } from "@polymer/paper-input/paper-input";
+import "@polymer/paper-input/paper-input.js";
+import type { PaperInputElement } from "@polymer/paper-input/paper-input.js";
 import {
   css,
   CSSResult,
@@ -14,7 +14,7 @@ import {
   query,
   TemplateResult,
 } from "lit-element";
-import { classMap } from "lit-html/directives/class-map";
+import { classMap } from "lit-html/directives/class-map.js";
 import { fireEvent } from "../../common/dom/fire_event";
 import { SpeechRecognition } from "../../common/dom/speech-recognition";
 import { uid } from "../../common/util/uid";

src/dialogs/zha-device-info-dialog/dialog-zha-device-info.ts

@@ -1,4 +1,4 @@
-import "@polymer/paper-dialog-scrollable/paper-dialog-scrollable";
+import "@polymer/paper-dialog-scrollable";
 import {
   css,
   CSSResult,

src/entrypoints/app.ts

@@ -1,7 +1,7 @@
 // Load polyfill first so HTML imports start resolving
 /* eslint-disable import/first */
-import "@polymer/paper-styles/typography";
-import { setPassiveTouchGestures } from "@polymer/polymer/lib/utils/settings";
+import "@polymer/paper-styles/typography.js";
+import { setPassiveTouchGestures } from "@polymer/polymer/lib/utils/settings.js";
 import "../layouts/home-assistant";
 import "../resources/html-import/polyfill";
 import "../resources/roboto";

src/entrypoints/authorize.ts

@@ -1,5 +1,5 @@
-import "@polymer/polymer/lib/elements/dom-if";
-import "@polymer/polymer/lib/elements/dom-repeat";
+import "@polymer/polymer/lib/elements/dom-if.js";
+import "@polymer/polymer/lib/elements/dom-repeat.js";
 import "../auth/ha-authorize";
 import "../resources/ha-style";
 import "../resources/roboto";

src/entrypoints/compatibility.ts

@@ -1,6 +1,6 @@
 import objAssign from "es6-object-assign";
 import "mdn-polyfills/Array.prototype.includes";
-import "regenerator-runtime/runtime";
+import "regenerator-runtime";
 import "unfetch/polyfill";
 
 objAssign.polyfill();