Merge branch 'dev'

2025-07-28 11:46:42 +00:00 · 2019-09-08 20:48:25 +02:00 · 2019-09-08 20:48:25 +02:00 · 4c37c76a8f
commit 4c37c76a8f
parent abb9190c98 44ca37c1dc
42 changed files with 1385 additions and 292 deletions
--- a/build-scripts/gulp/translations.js
+++ b/build-scripts/gulp/translations.js
@ -214,9 +214,7 @@ gulp.task(
            const lang = subtags.slice(0, i).join("-");
            if (lang === "test") {
              src.push(workDir + "/test.json");
-            } else if (lang === "en") {
-              src.push("src/translations/en.json");
-            } else {
+            } else if (lang !== "en") {
              src.push(inDir + "/" + lang + ".json");
            }
          }
--- a/package.json
+++ b/package.json
@ -20,7 +20,7 @@
    "@material/mwc-base": "^0.6.0",
    "@material/mwc-button": "^0.6.0",
    "@material/mwc-ripple": "^0.6.0",
-    "@mdi/svg": "4.2.95",
+    "@mdi/svg": "4.3.95",
    "@polymer/app-layout": "^3.0.2",
    "@polymer/app-localize-behavior": "^3.0.1",
    "@polymer/app-route": "^3.0.2",
@ -81,7 +81,7 @@
    "home-assistant-js-websocket": "4.3.1",
    "intl-messageformat": "^2.2.0",
    "jquery": "^3.3.1",
-    "js-yaml": "^3.13.0",
+    "js-yaml": "^3.13.1",
    "leaflet": "^1.4.0",
    "lit-element": "^2.2.0",
    "lit-html": "^1.1.0",
--- a/setup.py
+++ b/setup.py
@ -2,7 +2,7 @@ from setuptools import setup, find_packages

 setup(
    name="home-assistant-frontend",
-    version="20190904.0",
+    version="20190908.0",
    description="The Home Assistant frontend",
    url="https://github.com/home-assistant/home-assistant-polymer",
    author="The Home Assistant Authors",
--- a/src/auth/ha-auth-flow.ts
+++ b/src/auth/ha-auth-flow.ts
@ -96,6 +96,7 @@ class HaAuthFlow extends litLocalizeLiteMixin(LitElement) {
        return html`
          ${this.localize("ui.panel.page-authorize.abort_intro")}:
          <ha-markdown
+            allowsvg
            .content=${this.localize(
              `ui.panel.page-authorize.form.providers.${
                step.handler[0]
--- a/src/common/const.ts
+++ b/src/common/const.ts
@ -45,6 +45,7 @@ export const DOMAINS_WITH_MORE_INFO = [
  "media_player",
  "script",
  "sun",
+  "timer",
  "updater",
  "vacuum",
  "water_heater",
--- a/src/components/device/ha-device-automation-picker.ts
+++ b/src/components/device/ha-device-automation-picker.ts
@ -0,0 +1,195 @@
+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 {
+  LitElement,
+  TemplateResult,
+  html,
+  css,
+  CSSResult,
+  property,
+} from "lit-element";
+import { HomeAssistant } from "../../types";
+import { fireEvent } from "../../common/dom/fire_event";
+import {
+  DeviceAutomation,
+  deviceAutomationsEqual,
+} from "../../data/device_automation";
+import "../../components/ha-paper-dropdown-menu";
+
+const NO_AUTOMATION_KEY = "NO_AUTOMATION";
+const UNKNOWN_AUTOMATION_KEY = "UNKNOWN_AUTOMATION";
+
+export abstract class HaDeviceAutomationPicker<
+  T extends DeviceAutomation
+> extends LitElement {
+  public hass!: HomeAssistant;
+  @property() public label?: string;
+  @property() public deviceId?: string;
+  @property() public value?: T;
+  protected NO_AUTOMATION_TEXT = "No automations";
+  protected UNKNOWN_AUTOMATION_TEXT = "Unknown automation";
+  @property() private _automations: T[] = [];
+
+  // Trigger an empty render so we start with a clean DOM.
+  // paper-listbox does not like changing things around.
+  @property() private _renderEmpty = false;
+
+  private _localizeDeviceAutomation: (
+    hass: HomeAssistant,
+    automation: T
+  ) => string;
+  private _fetchDeviceAutomations: (
+    hass: HomeAssistant,
+    deviceId: string
+  ) => Promise<T[]>;
+  private _createNoAutomation: (deviceId?: string) => T;
+
+  constructor(
+    localizeDeviceAutomation: HaDeviceAutomationPicker<
+      T
+    >["_localizeDeviceAutomation"],
+    fetchDeviceAutomations: HaDeviceAutomationPicker<
+      T
+    >["_fetchDeviceAutomations"],
+    createNoAutomation: HaDeviceAutomationPicker<T>["_createNoAutomation"]
+  ) {
+    super();
+    this._localizeDeviceAutomation = localizeDeviceAutomation;
+    this._fetchDeviceAutomations = fetchDeviceAutomations;
+    this._createNoAutomation = createNoAutomation;
+  }
+
+  private get _key() {
+    if (
+      !this.value ||
+      deviceAutomationsEqual(
+        this._createNoAutomation(this.deviceId),
+        this.value
+      )
+    ) {
+      return NO_AUTOMATION_KEY;
+    }
+
+    const idx = this._automations.findIndex((automation) =>
+      deviceAutomationsEqual(automation, this.value!)
+    );
+
+    if (idx === -1) {
+      return UNKNOWN_AUTOMATION_KEY;
+    }
+
+    return `${this._automations[idx].device_id}_${idx}`;
+  }
+
+  protected render(): TemplateResult | void {
+    if (this._renderEmpty) {
+      return html``;
+    }
+    return html`
+      <ha-paper-dropdown-menu
+        .label=${this.label}
+        .value=${this.value
+          ? this._localizeDeviceAutomation(this.hass, this.value)
+          : ""}
+        ?disabled=${this._automations.length === 0}
+      >
+        <paper-listbox
+          slot="dropdown-content"
+          .selected=${this._key}
+          attr-for-selected="key"
+          @iron-select=${this._automationChanged}
+        >
+          <paper-item
+            key=${NO_AUTOMATION_KEY}
+            .automation=${this._createNoAutomation(this.deviceId)}
+            hidden
+          >
+            ${this.NO_AUTOMATION_TEXT}
+          </paper-item>
+          <paper-item
+            key=${UNKNOWN_AUTOMATION_KEY}
+            .automation=${this.value}
+            hidden
+          >
+            ${this.UNKNOWN_AUTOMATION_TEXT}
+          </paper-item>
+          ${this._automations.map(
+            (automation, idx) => html`
+              <paper-item
+                key=${`${this.deviceId}_${idx}`}
+                .automation=${automation}
+              >
+                ${this._localizeDeviceAutomation(this.hass, automation)}
+              </paper-item>
+            `
+          )}
+        </paper-listbox>
+      </ha-paper-dropdown-menu>
+    `;
+  }
+
+  protected updated(changedProps) {
+    super.updated(changedProps);
+
+    if (changedProps.has("deviceId")) {
+      this._updateDeviceInfo();
+    }
+
+    // The value has changed, force the listbox to update
+    if (changedProps.has("value") || changedProps.has("_renderEmpty")) {
+      const listbox = this.shadowRoot!.querySelector("paper-listbox")!;
+      if (listbox) {
+        listbox._selectSelected(this._key);
+      }
+    }
+  }
+
+  private async _updateDeviceInfo() {
+    this._automations = this.deviceId
+      ? await this._fetchDeviceAutomations(this.hass, this.deviceId)
+      : // No device, clear the list of automations
+        [];
+
+    // If there is no value, or if we have changed the device ID, reset the value.
+    if (!this.value || this.value.device_id !== this.deviceId) {
+      this._setValue(
+        this._automations.length
+          ? this._automations[0]
+          : this._createNoAutomation(this.deviceId)
+      );
+    }
+    this._renderEmpty = true;
+    await this.updateComplete;
+    this._renderEmpty = false;
+  }
+
+  private _automationChanged(ev) {
+    this._setValue(ev.detail.item.automation);
+  }
+
+  private _setValue(automation: T) {
+    if (this.value && deviceAutomationsEqual(automation, this.value)) {
+      return;
+    }
+    this.value = automation;
+    setTimeout(() => {
+      fireEvent(this, "change");
+    }, 0);
+  }
+
+  static get styles(): CSSResult {
+    return css`
+      ha-paper-dropdown-menu {
+        width: 100%;
+      }
+      paper-listbox {
+        min-width: 200px;
+      }
+      paper-item {
+        cursor: pointer;
+      }
+    `;
+  }
+}
--- a/src/components/device/ha-device-condition-picker.ts
+++ b/src/components/device/ha-device-condition-picker.ts
@ -0,0 +1,35 @@
+import { customElement } from "lit-element";
+import {
+  DeviceCondition,
+  fetchDeviceConditions,
+  localizeDeviceAutomationCondition,
+} from "../../data/device_automation";
+import "../../components/ha-paper-dropdown-menu";
+import { HaDeviceAutomationPicker } from "./ha-device-automation-picker";
+
+@customElement("ha-device-condition-picker")
+class HaDeviceConditionPicker extends HaDeviceAutomationPicker<
+  DeviceCondition
+> {
+  protected NO_AUTOMATION_TEXT = "No conditions";
+  protected UNKNOWN_AUTOMATION_TEXT = "Unknown condition";
+
+  constructor() {
+    super(
+      localizeDeviceAutomationCondition,
+      fetchDeviceConditions,
+      (deviceId?: string) => ({
+        device_id: deviceId || "",
+        condition: "device",
+        domain: "",
+        entity_id: "",
+      })
+    );
+  }
+}
+
+declare global {
+  interface HTMLElementTagNameMap {
+    "ha-device-condition-picker": HaDeviceConditionPicker;
+  }
+}
--- a/src/components/device/ha-device-trigger-picker.ts
+++ b/src/components/device/ha-device-trigger-picker.ts
@ -1,164 +1,28 @@
-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 {
-  LitElement,
-  TemplateResult,
-  html,
-  css,
-  CSSResult,
-  customElement,
-  property,
-} from "lit-element";
-import { HomeAssistant } from "../../types";
-import { fireEvent } from "../../common/dom/fire_event";
+import { customElement } from "lit-element";
 import {
  DeviceTrigger,
  fetchDeviceTriggers,
-  deviceAutomationTriggersEqual,
  localizeDeviceAutomationTrigger,
 } from "../../data/device_automation";
 import "../../components/ha-paper-dropdown-menu";
-
-const NO_TRIGGER_KEY = "NO_TRIGGER";
-const UNKNOWN_TRIGGER_KEY = "UNKNOWN_TRIGGER";
+import { HaDeviceAutomationPicker } from "./ha-device-automation-picker";

@customElement("ha-device-trigger-picker")
-class HaDeviceTriggerPicker extends LitElement {
-  public hass!: HomeAssistant;
-  @property() public label?: string;
-  @property() public deviceId?: string;
-  @property() public value?: DeviceTrigger;
-  @property() private _triggers: DeviceTrigger[] = [];
+class HaDeviceTriggerPicker extends HaDeviceAutomationPicker<DeviceTrigger> {
+  protected NO_AUTOMATION_TEXT = "No triggers";
+  protected UNKNOWN_AUTOMATION_TEXT = "Unknown trigger";

-  // Trigger an empty render so we start with a clean DOM.
-  // paper-listbox does not like changing things around.
-  @property() private _renderEmpty = false;
-
-  private get _key() {
-    if (
-      !this.value ||
-      deviceAutomationTriggersEqual(this._noTrigger, this.value)
-    ) {
-      return NO_TRIGGER_KEY;
-    }
-
-    const idx = this._triggers.findIndex((trigger) =>
-      deviceAutomationTriggersEqual(trigger, this.value!)
+  constructor() {
+    super(
+      localizeDeviceAutomationTrigger,
+      fetchDeviceTriggers,
+      (deviceId?: string) => ({
+        device_id: deviceId || "",
+        platform: "device",
+        domain: "",
+        entity_id: "",
+      })
    );
-
-    if (idx === -1) {
-      return UNKNOWN_TRIGGER_KEY;
-    }
-
-    return `${this._triggers[idx].device_id}_${idx}`;
-  }
-
-  protected render(): TemplateResult | void {
-    if (this._renderEmpty) {
-      return html``;
-    }
-    return html`
-      <ha-paper-dropdown-menu
-        .label=${this.label}
-        .value=${this.value
-          ? localizeDeviceAutomationTrigger(this.hass, this.value)
-          : ""}
-        ?disabled=${this._triggers.length === 0}
-      >
-        <paper-listbox
-          slot="dropdown-content"
-          .selected=${this._key}
-          attr-for-selected="key"
-          @iron-select=${this._triggerChanged}
-        >
-          <paper-item key=${NO_TRIGGER_KEY} .trigger=${this._noTrigger} hidden>
-            No triggers
-          </paper-item>
-          <paper-item key=${UNKNOWN_TRIGGER_KEY} .trigger=${this.value} hidden>
-            Unknown trigger
-          </paper-item>
-          ${this._triggers.map(
-            (trigger, idx) => html`
-              <paper-item key=${`${this.deviceId}_${idx}`} .trigger=${trigger}>
-                ${localizeDeviceAutomationTrigger(this.hass, trigger)}
-              </paper-item>
-            `
-          )}
-        </paper-listbox>
-      </ha-paper-dropdown-menu>
-    `;
-  }
-
-  protected updated(changedProps) {
-    super.updated(changedProps);
-
-    if (changedProps.has("deviceId")) {
-      this._updateDeviceInfo();
-    }
-
-    // The value has changed, force the listbox to update
-    if (changedProps.has("value") || changedProps.has("_renderEmpty")) {
-      const listbox = this.shadowRoot!.querySelector("paper-listbox")!;
-      if (listbox) {
-        listbox._selectSelected(this._key);
-      }
-    }
-  }
-
-  private async _updateDeviceInfo() {
-    this._triggers = this.deviceId
-      ? await fetchDeviceTriggers(this.hass!, this.deviceId!)
-      : // No device, clear the list of triggers
-        [];
-
-    // If there is no value, or if we have changed the device ID, reset the value.
-    if (!this.value || this.value.device_id !== this.deviceId) {
-      this._setValue(
-        this._triggers.length ? this._triggers[0] : this._noTrigger
-      );
-    }
-    this._renderEmpty = true;
-    await this.updateComplete;
-    this._renderEmpty = false;
-  }
-
-  private get _noTrigger() {
-    return {
-      device_id: this.deviceId || "",
-      platform: "device",
-      domain: "",
-      entity_id: "",
-    };
-  }
-
-  private _triggerChanged(ev) {
-    this._setValue(ev.detail.item.trigger);
-  }
-
-  private _setValue(trigger: DeviceTrigger) {
-    if (this.value && deviceAutomationTriggersEqual(trigger, this.value)) {
-      return;
-    }
-    this.value = trigger;
-    setTimeout(() => {
-      fireEvent(this, "change");
-    }, 0);
-  }
-
-  static get styles(): CSSResult {
-    return css`
-      ha-paper-dropdown-menu {
-        width: 100%;
-      }
-      paper-listbox {
-        min-width: 200px;
-      }
-      paper-item {
-        cursor: pointer;
-      }
-    `;
  }
 }

--- a/src/components/ha-markdown.ts
+++ b/src/components/ha-markdown.ts
@ -10,6 +10,7 @@ let worker: any | undefined;
@customElement("ha-markdown")
 class HaMarkdown extends UpdatingElement {
  @property() public content = "";
+  @property({ type: Boolean }) public allowSvg = false;

  protected update(changedProps) {
    super.update(changedProps);
@ -22,11 +23,17 @@ class HaMarkdown extends UpdatingElement {
  }

  private async _render() {
-    this.innerHTML = await worker.renderMarkdown(this.content, {
-      breaks: true,
-      gfm: true,
-      tables: true,
-    });
+    this.innerHTML = await worker.renderMarkdown(
+      this.content,
+      {
+        breaks: true,
+        gfm: true,
+        tables: true,
+      },
+      {
+        allowSvg: this.allowSvg,
+      }
+    );

    this._resize();

--- a/src/data/device_automation.ts
+++ b/src/data/device_automation.ts
@ -1,30 +1,38 @@
 import { HomeAssistant } from "../types";
 import compute_state_name from "../common/entity/compute_state_name";

-export interface DeviceTrigger {
-  platform: string;
+export interface DeviceAutomation {
  device_id: string;
  domain: string;
  entity_id: string;
  type?: string;
+  subtype?: string;
  event?: string;
 }

-export interface DeviceTriggerList {
-  triggers: DeviceTrigger[];
+export interface DeviceCondition extends DeviceAutomation {
+  condition: string;
 }

-export const fetchDeviceTriggers = (hass: HomeAssistant, deviceId: string) =>
-  hass
-    .callWS<DeviceTriggerList>({
-      type: "device_automation/trigger/list",
-      device_id: deviceId,
-    })
-    .then((response) => response.triggers);
+export interface DeviceTrigger extends DeviceAutomation {
+  platform: string;
+}

-export const deviceAutomationTriggersEqual = (
-  a: DeviceTrigger,
-  b: DeviceTrigger
+export const fetchDeviceConditions = (hass: HomeAssistant, deviceId: string) =>
+  hass.callWS<DeviceCondition[]>({
+    type: "device_automation/condition/list",
+    device_id: deviceId,
+  });
+
+export const fetchDeviceTriggers = (hass: HomeAssistant, deviceId: string) =>
+  hass.callWS<DeviceTrigger[]>({
+    type: "device_automation/trigger/list",
+    device_id: deviceId,
+  });
+
+export const deviceAutomationsEqual = (
+  a: DeviceAutomation,
+  b: DeviceAutomation
 ) => {
  if (typeof a !== typeof b) {
    return false;
@ -44,14 +52,44 @@ export const deviceAutomationTriggersEqual = (
  return true;
 };

+export const localizeDeviceAutomationCondition = (
+  hass: HomeAssistant,
+  condition: DeviceCondition
+) => {
+  const state = condition.entity_id
+    ? hass.states[condition.entity_id]
+    : undefined;
+  return hass.localize(
+    `component.${condition.domain}.device_automation.condition_type.${
+      condition.type
+    }`,
+    "entity_name",
+    state ? compute_state_name(state) : "<unknown>",
+    "subtype",
+    hass.localize(
+      `component.${condition.domain}.device_automation.condition_subtype.${
+        condition.subtype
+      }`
+    )
+  );
+};
+
 export const localizeDeviceAutomationTrigger = (
  hass: HomeAssistant,
  trigger: DeviceTrigger
-) =>
-  hass.localize(
+) => {
+  const state = trigger.entity_id ? hass.states[trigger.entity_id] : undefined;
+  return hass.localize(
    `component.${trigger.domain}.device_automation.trigger_type.${
      trigger.type
    }`,
-    "name",
-    trigger.entity_id ? compute_state_name(hass!.states[trigger.entity_id]) : ""
+    "entity_name",
+    state ? compute_state_name(state) : "<unknown>",
+    "subtype",
+    hass.localize(
+      `component.${trigger.domain}.device_automation.trigger_subtype.${
+        trigger.subtype
+      }`
+    )
  );
+};
--- a/src/data/timer.ts
+++ b/src/data/timer.ts
@ -0,0 +1,11 @@
+import {
+  HassEntityBase,
+  HassEntityAttributeBase,
+} from "home-assistant-js-websocket";
+
+export type TimerEntity = HassEntityBase & {
+  attributes: HassEntityAttributeBase & {
+    duration: string;
+    remaining: string;
+  };
+};
--- a/src/data/zha.ts
+++ b/src/data/zha.ts
@ -80,6 +80,15 @@ export const fetchDevices = (hass: HomeAssistant): Promise<ZHADevice[]> =>
    type: "zha/devices",
  });

+export const fetchZHADevice = (
+  hass: HomeAssistant,
+  ieeeAddress: string
+): Promise<ZHADevice> =>
+  hass.callWS({
+    type: "zha/device",
+    ieee: ieeeAddress,
+  });
+
 export const fetchBindableDevices = (
  hass: HomeAssistant,
  ieeeAddress: string
--- a/src/dialogs/config-flow/show-dialog-config-flow.ts
+++ b/src/dialogs/config-flow/show-dialog-config-flow.ts
@ -45,7 +45,7 @@ export const showConfigFlowDialog = (

      return description
        ? html`
-            <ha-markdown .content=${description}></ha-markdown>
+            <ha-markdown allowsvg .content=${description}></ha-markdown>
          `
        : "";
    },
@ -64,7 +64,7 @@ export const showConfigFlowDialog = (
      );
      return description
        ? html`
-            <ha-markdown .content=${description}></ha-markdown>
+            <ha-markdown allowsvg .content=${description}></ha-markdown>
          `
        : "";
    },
@ -102,7 +102,7 @@ export const showConfigFlowDialog = (
        </p>
        ${description
          ? html`
-              <ha-markdown .content=${description}></ha-markdown>
+              <ha-markdown allowsvg .content=${description}></ha-markdown>
            `
          : ""}
      `;
@ -119,7 +119,7 @@ export const showConfigFlowDialog = (
      return html`
        ${description
          ? html`
-              <ha-markdown .content=${description}></ha-markdown>
+              <ha-markdown allowsvg .content=${description}></ha-markdown>
            `
          : ""}
        <p>Created config for ${step.title}.</p>
--- a/src/dialogs/config-flow/show-dialog-options-flow.ts
+++ b/src/dialogs/config-flow/show-dialog-options-flow.ts
@ -39,7 +39,7 @@ export const showOptionsFlowDialog = (

        return description
          ? html`
-              <ha-markdown .content=${description}></ha-markdown>
+              <ha-markdown allowsvg .content=${description}></ha-markdown>
            `
          : "";
      },
--- a/src/dialogs/more-info/controls/more-info-content.ts
+++ b/src/dialogs/more-info/controls/more-info-content.ts
@ -21,6 +21,7 @@ import "./more-info-lock";
 import "./more-info-media_player";
 import "./more-info-script";
 import "./more-info-sun";
+import "./more-info-timer";
 import "./more-info-updater";
 import "./more-info-vacuum";
 import "./more-info-water_heater";
--- a/src/dialogs/more-info/controls/more-info-timer.ts
+++ b/src/dialogs/more-info/controls/more-info-timer.ts
@ -0,0 +1,104 @@
+import {
+  LitElement,
+  html,
+  TemplateResult,
+  CSSResult,
+  css,
+  property,
+  PropertyValues,
+  customElement,
+} from "lit-element";
+import "@material/mwc-button";
+
+import { HomeAssistant } from "../../../types";
+import { TimerEntity } from "../../../data/timer";
+
+@customElement("more-info-timer")
+class MoreInfoTimer extends LitElement {
+  @property() public hass!: HomeAssistant;
+
+  @property() public stateObj?: TimerEntity;
+
+  protected render(): TemplateResult | void {
+    if (!this.hass || !this.stateObj) {
+      return html``;
+    }
+
+    return html`
+      <ha-attributes
+        .stateObj=${this.stateObj}
+        .extraFilters=${"remaining"}
+      ></ha-attributes>
+      <div class="actions">
+        ${this.stateObj.state === "idle" || this.stateObj.state === "paused"
+          ? html`
+              <mwc-button
+                .action="${"start"}"
+                @click="${this._handleActionClick}"
+              >
+                ${this.hass!.localize("ui.card.timer.actions.start")}
+              </mwc-button>
+            `
+          : ""}
+        ${this.stateObj.state === "active"
+          ? html`
+              <mwc-button
+                .action="${"pause"}"
+                @click="${this._handleActionClick}"
+              >
+                ${this.hass!.localize("ui.card.timer.actions.pause")}
+              </mwc-button>
+            `
+          : ""}
+        ${this.stateObj.state === "active" || this.stateObj.state === "paused"
+          ? html`
+              <mwc-button
+                .action="${"cancel"}"
+                @click="${this._handleActionClick}"
+              >
+                ${this.hass!.localize("ui.card.timer.actions.cancel")}
+              </mwc-button>
+              <mwc-button
+                .action="${"finish"}"
+                @click="${this._handleActionClick}"
+              >
+                ${this.hass!.localize("ui.card.timer.actions.finish")}
+              </mwc-button>
+            `
+          : ""}
+      </div>
+    `;
+  }
+
+  protected updated(changedProps: PropertyValues) {
+    super.updated(changedProps);
+    if (!changedProps.has("stateObj") || !this.stateObj) {
+      return;
+    }
+  }
+
+  private _handleActionClick(e: MouseEvent): void {
+    const action = (e.currentTarget as any).action;
+    this.hass.callService("timer", action, {
+      entity_id: this.stateObj!.entity_id,
+    });
+  }
+
+  static get styles(): CSSResult {
+    return css`
+      .actions {
+        margin: 0 8px;
+        padding-top: 20px;
+        display: flex;
+        flex-wrap: wrap;
+        justify-content: center;
+      }
+    `;
+  }
+}
+
+declare global {
+  interface HTMLElementTagNameMap {
+    "more-info-timer": MoreInfoTimer;
+  }
+}
--- a/src/dialogs/zha-device-info-dialog/dialog-zha-device-info.ts
+++ b/src/dialogs/zha-device-info-dialog/dialog-zha-device-info.ts
@ -0,0 +1,115 @@
+import {
+  LitElement,
+  html,
+  css,
+  CSSResult,
+  TemplateResult,
+  customElement,
+  property,
+} from "lit-element";
+import "@polymer/paper-dialog-scrollable/paper-dialog-scrollable";
+import "../../components/dialog/ha-paper-dialog";
+// Not duplicate, is for typing
+// tslint:disable-next-line
+import { HaPaperDialog } from "../../components/dialog/ha-paper-dialog";
+import "../../panels/config/zha/zha-device-card";
+
+import { PolymerChangedEvent } from "../../polymer-types";
+import { haStyleDialog } from "../../resources/styles";
+import { HomeAssistant } from "../../types";
+import { ZHADeviceInfoDialogParams } from "./show-dialog-zha-device-info";
+import { ZHADevice, fetchZHADevice } from "../../data/zha";
+
+@customElement("dialog-zha-device-info")
+class DialogZHADeviceInfo extends LitElement {
+  @property() public hass!: HomeAssistant;
+  @property() private _params?: ZHADeviceInfoDialogParams;
+  @property() private _error?: string;
+  @property() private _device?: ZHADevice;
+
+  public async showDialog(params: ZHADeviceInfoDialogParams): Promise<void> {
+    this._params = params;
+    this._device = await fetchZHADevice(this.hass, params.ieee);
+    await this.updateComplete;
+    this._dialog.open();
+  }
+
+  protected render(): TemplateResult | void {
+    if (!this._params || !this._device) {
+      return html``;
+    }
+
+    return html`
+      <ha-paper-dialog
+        with-backdrop
+        opened
+        @opened-changed=${this._openedChanged}
+      >
+        ${this._error
+          ? html`
+              <div class="error">${this._error}</div>
+            `
+          : html`
+              <zha-device-card
+                class="card"
+                .hass=${this.hass}
+                .device=${this._device}
+                showActions
+                isJoinPage
+                @zha-device-removed=${this._onDeviceRemoved}
+              ></zha-device-card>
+            `}
+      </ha-paper-dialog>
+    `;
+  }
+
+  private _openedChanged(ev: PolymerChangedEvent<boolean>): void {
+    if (!ev.detail.value) {
+      this._params = undefined;
+      this._error = undefined;
+      this._device = undefined;
+    }
+  }
+
+  private _onDeviceRemoved(): void {
+    this._closeDialog();
+  }
+
+  private get _dialog(): HaPaperDialog {
+    return this.shadowRoot!.querySelector("ha-paper-dialog")!;
+  }
+
+  private _closeDialog() {
+    this._dialog.close();
+  }
+
+  static get styles(): CSSResult[] {
+    return [
+      haStyleDialog,
+      css`
+        ha-paper-dialog > * {
+          margin: 0;
+          display: block;
+          padding: 0;
+        }
+        .card {
+          box-sizing: border-box;
+          display: flex;
+          flex: 1 0 300px;
+          min-width: 0;
+          max-width: 600px;
+          word-wrap: break-word;
+        }
+        .error {
+          color: var(--google-red-500);
+        }
+      `,
+    ];
+  }
+}
+
+declare global {
+  interface HTMLElementTagNameMap {
+    "dialog-zha-device-info": DialogZHADeviceInfo;
+  }
+}
--- a/src/dialogs/zha-device-info-dialog/show-dialog-zha-device-info.ts
+++ b/src/dialogs/zha-device-info-dialog/show-dialog-zha-device-info.ts
@ -0,0 +1,19 @@
+import { fireEvent } from "../../common/dom/fire_event";
+
+export interface ZHADeviceInfoDialogParams {
+  ieee: string;
+}
+
+export const loadZHADeviceInfoDialog = () =>
+  import(/* webpackChunkName: "dialog-zha-device-info" */ "./dialog-zha-device-info");
+
+export const showZHADeviceInfoDialog = (
+  element: HTMLElement,
+  zhaDeviceInfoParams: ZHADeviceInfoDialogParams
+): void => {
+  fireEvent(element, "show-dialog", {
+    dialogTag: "dialog-zha-device-info",
+    dialogImport: loadZHADeviceInfoDialog,
+    dialogParams: zhaDeviceInfoParams,
+  });
+};
--- a/src/panels/config/cloud/account/cloud-google-pref.ts
+++ b/src/panels/config/cloud/account/cloud-google-pref.ts
@ -18,6 +18,7 @@ import { fireEvent } from "../../../../common/dom/fire_event";
 import { HomeAssistant } from "../../../../types";
 import { CloudStatusLoggedIn, updateCloudPref } from "../../../../data/cloud";
 import { PaperInputElement } from "@polymer/paper-input/paper-input";
+import { showSaveSuccessToast } from "../../../../util/toast-saved-success";

 export class CloudGooglePref extends LitElement {
  public hass?: HomeAssistant;
@ -83,7 +84,7 @@ export class CloudGooglePref extends LitElement {
                  <paper-input
                    label="Secure Devices Pin"
                    id="google_secure_devices_pin"
-                    placeholder="Secure devices disabled"
+                    placeholder="Enter a PIN to use secure devices"
                    .value=${google_secure_devices_pin || ""}
                    @change="${this._pinChanged}"
                  ></paper-input>
@ -124,6 +125,7 @@ export class CloudGooglePref extends LitElement {
      await updateCloudPref(this.hass!, {
        [input.id]: input.value || null,
      });
+      showSaveSuccessToast(this, this.hass!);
      fireEvent(this, "ha-refresh-cloud-status");
    } catch (err) {
      alert(`Unable to store pin: ${err.message}`);
@ -150,7 +152,7 @@ export class CloudGooglePref extends LitElement {
        padding-top: 16px;
      }
      paper-input {
-        width: 200px;
+        width: 250px;
      }
      .card-actions {
        display: flex;
--- a/src/panels/config/js/condition/condition_edit.js
+++ b/src/panels/config/js/condition/condition_edit.js
@ -3,6 +3,7 @@ import "@polymer/paper-dropdown-menu/paper-dropdown-menu-light";
 import "@polymer/paper-listbox/paper-listbox";
 import "@polymer/paper-item/paper-item";

+import DeviceCondition from "./device";
 import NumericStateCondition from "./numeric_state";
 import StateCondition from "./state";
 import SunCondition from "./sun";
@ -11,6 +12,7 @@ import TimeCondition from "./time";
 import ZoneCondition from "./zone";

 const TYPES = {
+  device: DeviceCondition,
  state: StateCondition,
  numeric_state: NumericStateCondition,
  sun: SunCondition,
--- a/src/panels/config/js/condition/device.js
+++ b/src/panels/config/js/condition/device.js
@ -0,0 +1,57 @@
+import { h, Component } from "preact";
+
+import "../../../../components/device/ha-device-picker";
+import "../../../../components/device/ha-device-condition-picker";
+
+import { onChangeEvent } from "../../../../common/preact/event";
+
+export default class DeviceCondition extends Component {
+  constructor() {
+    super();
+    this.onChange = onChangeEvent.bind(this, "condition");
+    this.devicePicked = this.devicePicked.bind(this);
+    this.deviceConditionPicked = this.deviceConditionPicked.bind(this);
+    this.state.device_id = undefined;
+  }
+
+  devicePicked(ev) {
+    this.setState({ device_id: ev.target.value });
+  }
+
+  deviceConditionPicked(ev) {
+    const deviceCondition = ev.target.value;
+    this.props.onChange(
+      this.props.index,
+      (this.props.condition = deviceCondition)
+    );
+  }
+
+  /* eslint-disable camelcase */
+  render({ condition, hass }, { device_id }) {
+    if (device_id === undefined) device_id = condition.device_id;
+
+    return (
+      <div>
+        <ha-device-picker
+          value={device_id}
+          onChange={this.devicePicked}
+          hass={hass}
+          label="Device"
+        />
+        <ha-device-condition-picker
+          value={condition}
+          deviceId={device_id}
+          onChange={this.deviceConditionPicked}
+          hass={hass}
+          label="Condition"
+        />
+      </div>
+    );
+  }
+}
+
+DeviceCondition.defaultConfig = {
+  device_id: "",
+  domain: "",
+  entity_id: "",
+};
--- a/src/panels/config/js/trigger/device.js
+++ b/src/panels/config/js/trigger/device.js
@ -2,6 +2,7 @@ import { h, Component } from "preact";

 import "../../../../components/device/ha-device-picker";
 import "../../../../components/device/ha-device-trigger-picker";
+import "../../../../components/device/ha-device-automation-picker";

 import { onChangeEvent } from "../../../../common/preact/event";

--- a/src/panels/config/zha/zha-add-devices-page.ts
+++ b/src/panels/config/zha/zha-add-devices-page.ts
@ -113,12 +113,12 @@ class ZHAAddDevicesPage extends LitElement {
                  (device) => html`
                    <zha-device-card
                      class="card"
-                      .hass="${this.hass}"
-                      .device="${device}"
-                      .narrow="${!this.isWide}"
-                      .showHelp="${this._showHelp}"
-                      .showActions="${!this._active}"
-                      .isJoinPage="${true}"
+                      .hass=${this.hass}
+                      .device=${device}
+                      .narrow=${!this.isWide}
+                      .showHelp=${this._showHelp}
+                      .showActions=${!this._active}
+                      isJoinPage
                    ></zha-device-card>
                  `
                )}
--- a/src/panels/config/zha/zha-device-card.ts
+++ b/src/panels/config/zha/zha-device-card.ts
@ -55,11 +55,11 @@ declare global {
@customElement("zha-device-card")
 class ZHADeviceCard extends LitElement {
  @property() public hass!: HomeAssistant;
-  @property() public narrow?: boolean;
  @property() public device?: ZHADevice;
-  @property() public showHelp: boolean = false;
-  @property() public showActions?: boolean;
-  @property() public isJoinPage?: boolean;
+  @property({ type: Boolean }) public narrow?: boolean;
+  @property({ type: Boolean }) public showHelp?: boolean = false;
+  @property({ type: Boolean }) public showActions?: boolean;
+  @property({ type: Boolean }) public isJoinPage?: boolean;
  @property() private _serviceData?: NodeServiceData;
  @property() private _areas: AreaRegistryEntry[] = [];
  @property() private _selectedAreaIndex: number = -1;
@ -139,7 +139,7 @@ class ZHADeviceCard extends LitElement {
                  <div class="model">${this.device!.model}</div>
                  <div class="manuf">
                    ${this.hass!.localize(
-                      "ui.panel.config.integrations.config_entry.manuf",
+                      "ui.dialogs.zha_device_info.manuf",
                      "manufacturer",
                      this.device!.manufacturer
                    )}
@ -206,14 +206,14 @@ class ZHADeviceCard extends LitElement {
            @change="${this._saveCustomName}"
            .value="${this._userGivenName}"
            placeholder="${this.hass!.localize(
-              "ui.panel.config.zha.device_card.device_name_placeholder"
+              "ui.dialogs.zha_device_info.zha_device_card.device_name_placeholder"
            )}"
          ></paper-input>
        </div>
        <div class="node-picker">
          <paper-dropdown-menu
            label="${this.hass!.localize(
-              "ui.panel.config.zha.device_card.area_picker_label"
+              "ui.dialogs.zha_device_info.zha_device_card.area_picker_label"
            )}"
            class="flex"
          >
@ -223,9 +223,7 @@ class ZHADeviceCard extends LitElement {
              @iron-select="${this._selectedAreaChanged}"
            >
              <paper-item>
-                ${this.hass!.localize(
-                  "ui.panel.config.integrations.config_entry.no_area"
-                )}
+                ${this.hass!.localize("ui.dialogs.zha_device_info.no_area")}
              </paper-item>

              ${this._areas.map(
@ -247,7 +245,7 @@ class ZHADeviceCard extends LitElement {
                    ? html`
                        <div class="help-text">
                          ${this.hass!.localize(
-                            "ui.panel.config.zha.services.reconfigure"
+                            "ui.dialogs.zha_device_info.services.reconfigure"
                          )}
                        </div>
                      `
@ -264,7 +262,7 @@ class ZHADeviceCard extends LitElement {
                    ? html`
                        <div class="help-text">
                          ${this.hass!.localize(
-                            "ui.panel.config.zha.services.remove"
+                            "ui.dialogs.zha_device_info.services.remove"
                          )}
                        </div>
                      `
@ -381,6 +379,7 @@ class ZHADeviceCard extends LitElement {
        }
        .device .manuf {
          color: var(--secondary-text-color);
+          margin-bottom: 20px;
        }
        .extra-info {
          margin-top: 8px;
@ -393,14 +392,17 @@ class ZHADeviceCard extends LitElement {
        .info {
          margin-left: 16px;
        }
+        dl {
+          display: grid;
+          grid-template-columns: 125px 1fr;
+        }
        dl dt {
          padding-left: 12px;
          float: left;
-          width: 100px;
          text-align: left;
        }
-        dt dd {
-          text-align: left;
+        dl dd {
+          max-width: 200px;
        }
        paper-icon-item {
          cursor: pointer;
--- a/src/panels/config/zha/zha-node.ts
+++ b/src/panels/config/zha/zha-node.ts
@ -105,13 +105,12 @@ export class ZHANode extends LitElement {
            ? html`
                <zha-device-card
                  class="card"
-                  .hass="${this.hass}"
-                  .device="${this._selectedDevice}"
-                  .narrow="${!this.isWide}"
-                  .showHelp="${this._showHelp}"
-                  .showActions="${true}"
-                  @zha-device-removed="${this._onDeviceRemoved}"
-                  .isJoinPage="${false}"
+                  .hass=${this.hass}
+                  .device=${this._selectedDevice}
+                  .narrow=${!this.isWide}
+                  .showHelp=${this._showHelp}
+                  showActions
+                  @zha-device-removed=${this._onDeviceRemoved}
                ></zha-device-card>
              `
            : ""}
--- a/src/panels/developer-tools/service/developer-tools-service.js
+++ b/src/panels/developer-tools/service/developer-tools-service.js
@ -115,9 +115,9 @@ class HaPanelDevService extends PolymerElement {
            autocomplete="off"
            spellcheck="false"
          ></paper-textarea>
-          <mwc-button on-click="_callService" raised disabled="[[!validJSON]]"
-            >Call Service</mwc-button
-          >
+          <mwc-button on-click="_callService" raised disabled="[[!validJSON]]">
+            Call Service
+          </mwc-button>
          <template is="dom-if" if="[[!validJSON]]">
            <span class="error">Invalid JSON</span>
          </template>
@ -153,6 +153,12 @@ class HaPanelDevService extends PolymerElement {
                </tr>
              </template>
            </table>
+
+            <template is="dom-if" if="[[_attributes.length]]">
+              <mwc-button on-click="_fillExampleData">
+                Fill Example Data
+              </mwc-button>
+            </template>
          </template>
        </template>
      </div>
@ -274,11 +280,17 @@ class HaPanelDevService extends PolymerElement {
    this.hass.callService(this._domain, this._service, this.parsedJSON);
  }

+  _fillExampleData() {
+    const example = {};
+    for (const attribute of this._attributes) {
+      example[attribute.key] = attribute.example;
+    }
+    this.serviceData = JSON.stringify(example, null, 2);
+  }
+
  _entityPicked(ev) {
    this.serviceData = JSON.stringify(
-      Object.assign({}, this.parsedJSON, {
-        entity_id: ev.target.value,
-      }),
+      { ...this.parsedJSON, entity_id: ev.target.value },
      null,
      2
    );
--- a/src/panels/developer-tools/state/developer-tools-state.js
+++ b/src/panels/developer-tools/state/developer-tools-state.js
@ -74,6 +74,7 @@ class HaPanelDevState extends EventsMixin(PolymerElement) {
          autofocus
          hass="[[hass]]"
          value="{{_entityId}}"
+          on-change="entityIdChanged"
          allow-custom-entity
        ></ha-entity-picker>
        <paper-input
@ -214,6 +215,12 @@ class HaPanelDevState extends EventsMixin(PolymerElement) {
    ev.preventDefault();
  }

+  entityIdChanged() {
+    var state = this.hass.states[this._entityId];
+    this._state = state.state;
+    this._stateAttributes = JSON.stringify(state.attributes, null, "  ");
+  }
+
  entityMoreInfo(ev) {
    ev.preventDefault();
    this.fire("hass-more-info", { entityId: ev.model.entity.entity_id });
--- a/src/panels/lovelace/cards/hui-entity-filter-card.ts
+++ b/src/panels/lovelace/cards/hui-entity-filter-card.ts
@ -12,6 +12,8 @@ class EntityFilterCard extends HTMLElement implements LovelaceCard {
  private _config?: EntityFilterCardConfig;
  private _configEntities?: EntityConfig[];
  private _baseCardConfig?: LovelaceCardConfig;
+  private _hass?: HomeAssistant;
+  private _oldEntities?: EntityConfig[];

  public getCardSize(): number {
    return this._element ? this._element.getCardSize() : 1;
@ -41,6 +43,13 @@ class EntityFilterCard extends HTMLElement implements LovelaceCard {
      return;
    }

+    if (!this.haveEntitiesChanged(hass)) {
+      this._hass = hass;
+      return;
+    }
+
+    this._hass = hass;
+
    if (!this._configEntities) {
      this._configEntities = processConfigEntities(this._config.entities);
    }
@ -62,7 +71,16 @@ class EntityFilterCard extends HTMLElement implements LovelaceCard {
    }

    if (element.tagName !== "HUI-ERROR-CARD") {
-      element.setConfig({ ...this._baseCardConfig!, entities: entitiesList });
+      const isSame =
+        this._oldEntities &&
+        entitiesList.length === this._oldEntities.length &&
+        entitiesList.every((entity, idx) => entity === this._oldEntities![idx]);
+
+      if (!isSame) {
+        this._oldEntities = entitiesList;
+        element.setConfig({ ...this._baseCardConfig!, entities: entitiesList });
+      }
+
      element.isPanel = this.isPanel;
      element.hass = hass;
    }
@ -75,6 +93,27 @@ class EntityFilterCard extends HTMLElement implements LovelaceCard {
    this.style.display = "block";
  }

+  private haveEntitiesChanged(hass: HomeAssistant): boolean {
+    if (!this._hass) {
+      return true;
+    }
+
+    if (!this._configEntities) {
+      return true;
+    }
+
+    for (const config of this._configEntities) {
+      if (
+        this._hass.states[config.entity] !== hass.states[config.entity] ||
+        this._hass.localize !== hass.localize
+      ) {
+        return true;
+      }
+    }
+
+    return false;
+  }
+
  private _cardElement(): LovelaceCard | undefined {
    if (!this._element && this._config) {
      const element = createCardElement(this._baseCardConfig!);
--- a/src/panels/lovelace/cards/hui-light-card.ts
+++ b/src/panels/lovelace/cards/hui-light-card.ts
@ -195,9 +195,6 @@ export class HuiLightCard extends LitElement implements LovelaceCard {
        ha-card {
          position: relative;
          overflow: hidden;
-          --brightness-font-color: white;
-          --brightness-font-text-shadow: -1px -1px 0 #000, 1px -1px 0 #000,
-            -1px 1px 0 #000, 1px 1px 0 #000;
          --name-font-size: 1.2rem;
          --brightness-font-size: 1.2rem;
          --rail-border-color: transparent;
@ -290,15 +287,13 @@ export class HuiLightCard extends LitElement implements LovelaceCard {
          position: absolute;
          margin: 0 auto;
          left: 50%;
-          top: 10%;
+          top: 50%;
          transform: translate(-50%);
          opacity: 0;
          transition: opacity 0.5s ease-in-out;
          -moz-transition: opacity 0.5s ease-in-out;
          -webkit-transition: opacity 0.5s ease-in-out;
          cursor: pointer;
-          color: var(--brightness-font-color);
-          text-shadow: var(--brightness-font-text-shadow);
          pointer-events: none;
        }

--- a/src/panels/lovelace/cards/hui-weather-forecast-card.js
+++ b/src/panels/lovelace/cards/hui-weather-forecast-card.js
@ -1,24 +0,0 @@
-import "../../../cards/ha-weather-card";
-
-import LegacyWrapperCard from "./hui-legacy-wrapper-card";
-
-class HuiWeatherForecastCard extends LegacyWrapperCard {
-  static async getConfigElement() {
-    await import(/* webpackChunkName: "hui-weather-forecast-card-editor" */ "../editor/config-elements/hui-weather-forecast-card-editor");
-    return document.createElement("hui-weather-forecast-card-editor");
-  }
-
-  static getStubConfig() {
-    return {};
-  }
-
-  constructor() {
-    super("ha-weather-card", "weather");
-  }
-
-  getCardSize() {
-    return 4;
-  }
-}
-
-customElements.define("hui-weather-forecast-card", HuiWeatherForecastCard);
--- a/src/panels/lovelace/cards/hui-weather-forecast-card.ts
+++ b/src/panels/lovelace/cards/hui-weather-forecast-card.ts
@ -0,0 +1,433 @@
+import {
+  html,
+  LitElement,
+  PropertyValues,
+  TemplateResult,
+  css,
+  CSSResult,
+  property,
+  customElement,
+} from "lit-element";
+
+import "../../../components/ha-card";
+import "../components/hui-warning";
+
+import isValidEntityId from "../../../common/entity/valid_entity_id";
+import computeStateName from "../../../common/entity/compute_state_name";
+
+import { HomeAssistant } from "../../../types";
+import { hasConfigOrEntityChanged } from "../common/has-changed";
+import { LovelaceCard, LovelaceCardEditor } from "../types";
+import { WeatherForecastCardConfig } from "./types";
+import { computeRTL } from "../../../common/util/compute_rtl";
+import { fireEvent } from "../../../common/dom/fire_event";
+import { toggleAttribute } from "../../../common/dom/toggle_attribute";
+
+const cardinalDirections = [
+  "N",
+  "NNE",
+  "NE",
+  "ENE",
+  "E",
+  "ESE",
+  "SE",
+  "SSE",
+  "S",
+  "SSW",
+  "SW",
+  "WSW",
+  "W",
+  "WNW",
+  "NW",
+  "NNW",
+  "N",
+];
+
+const weatherIcons = {
+  "clear-night": "hass:weather-night",
+  cloudy: "hass:weather-cloudy",
+  exceptional: "hass:alert-circle-outline",
+  fog: "hass:weather-fog",
+  hail: "hass:weather-hail",
+  lightning: "hass:weather-lightning",
+  "lightning-rainy": "hass:weather-lightning-rainy",
+  partlycloudy: "hass:weather-partly-cloudy",
+  pouring: "hass:weather-pouring",
+  rainy: "hass:weather-rainy",
+  snowy: "hass:weather-snowy",
+  "snowy-rainy": "hass:weather-snowy-rainy",
+  sunny: "hass:weather-sunny",
+  windy: "hass:weather-windy",
+  "windy-variant": "hass:weather-windy-variant",
+};
+
+@customElement("hui-weather-forecast-card")
+class HuiWeatherForecastCard extends LitElement implements LovelaceCard {
+  public static async getConfigElement(): Promise<LovelaceCardEditor> {
+    await import(/* webpackChunkName: "hui-weather-forecast-card-editor" */ "../editor/config-elements/hui-weather-forecast-card-editor");
+    return document.createElement("hui-weather-forecast-card-editor");
+  }
+  public static getStubConfig(): object {
+    return { entity: "" };
+  }
+
+  @property() public hass?: HomeAssistant;
+
+  @property() private _config?: WeatherForecastCardConfig;
+
+  public getCardSize(): number {
+    return 4;
+  }
+
+  public setConfig(config: WeatherForecastCardConfig): void {
+    if (!config || !config.entity) {
+      throw new Error("Invalid card configuration");
+    }
+    if (!isValidEntityId(config.entity)) {
+      throw new Error("Invalid Entity");
+    }
+
+    this._config = config;
+  }
+
+  protected updated(changedProps: PropertyValues): void {
+    super.updated(changedProps);
+    if (changedProps.has("hass")) {
+      toggleAttribute(this, "rtl", computeRTL(this.hass!));
+    }
+  }
+
+  protected render(): TemplateResult | void {
+    if (!this._config || !this.hass) {
+      return html``;
+    }
+
+    const stateObj = this.hass.states[this._config.entity];
+
+    if (!stateObj) {
+      return html`
+        <hui-warning
+          >${this.hass.localize(
+            "ui.panel.lovelace.warning.entity_not_found",
+            "entity",
+            this._config.entity
+          )}</hui-warning
+        >
+      `;
+    }
+
+    const forecast = stateObj.attributes.forecast
+      ? stateObj.attributes.forecast.slice(0, 5)
+      : undefined;
+
+    return html`
+      <ha-card @click="${this.handleClick}">
+        <div class="header">
+          ${this.hass.localize(`state.weather.${stateObj.state}`) ||
+            stateObj.state}
+          <div class="name">
+            ${(this._config && this._config.name) || computeStateName(stateObj)}
+          </div>
+        </div>
+        <div class="content">
+          <div class="now">
+            <div class="main">
+              ${stateObj.state in weatherIcons
+                ? html`
+                    <ha-icon icon="${weatherIcons[stateObj.state]}"></ha-icon>
+                  `
+                : ""}
+              <div class="temp">
+                ${stateObj.attributes.temperature}<span
+                  >${this.getUnit("temperature")}</span
+                >
+              </div>
+            </div>
+            <div class="attributes">
+              ${this._showValue(stateObj.attributes.pressure)
+                ? html`
+                    <div>
+                      ${this.hass.localize(
+                        "ui.card.weather.attributes.air_pressure"
+                      )}:
+                      <span class="measurand">
+                        ${stateObj.attributes.pressure}
+                        ${this.getUnit("air_pressure")}
+                      </span>
+                    </div>
+                  `
+                : ""}
+              ${this._showValue(stateObj.attributes.humidity)
+                ? html`
+                    <div>
+                      ${this.hass.localize(
+                        "ui.card.weather.attributes.humidity"
+                      )}:
+                      <span class="measurand"
+                        >${stateObj.attributes.humidity} %</span
+                      >
+                    </div>
+                  `
+                : ""}
+              ${this._showValue(stateObj.attributes.wind_speed)
+                ? html`
+                    <div>
+                      ${this.hass.localize(
+                        "ui.card.weather.attributes.wind_speed"
+                      )}:
+                      <span class="measurand">
+                        ${stateObj.attributes.wind_speed}
+                        ${this.getUnit("length")}/h
+                      </span>
+                      ${this.getWindBearing(stateObj.attributes.wind_bearing)}
+                    </div>
+                  `
+                : ""}
+            </div>
+          </div>
+          ${forecast
+            ? html`
+                <div class="forecast">
+                  ${forecast.map(
+                    (item) => html`
+                      <div>
+                        <div class="weekday">
+                          ${new Date(item.datetime).toLocaleDateString(
+                            this.hass!.language,
+                            { weekday: "short" }
+                          )}<br />
+                          ${!this._showValue(item.templow)
+                            ? html`
+                                ${new Date(item.datetime).toLocaleTimeString(
+                                  this.hass!.language,
+                                  { hour: "numeric" }
+                                )}
+                              `
+                            : ""}
+                        </div>
+                        ${this._showValue(item.condition)
+                          ? html`
+                              <div class="icon">
+                                <ha-icon
+                                  .icon="${weatherIcons[item.condition]}"
+                                ></ha-icon>
+                              </div>
+                            `
+                          : ""}
+                        ${this._showValue(item.temperature)
+                          ? html`
+                              <div class="temp">
+                                ${item.temperature}
+                                ${this.getUnit("temperature")}
+                              </div>
+                            `
+                          : ""}
+                        ${this._showValue(item.templow)
+                          ? html`
+                              <div class="templow">
+                                ${item.templow} ${this.getUnit("temperature")}
+                              </div>
+                            `
+                          : ""}
+                        ${this._showValue(item.precipitation)
+                          ? html`
+                              <div class="precipitation">
+                                ${item.precipitation}
+                                ${this.getUnit("precipitation")}
+                              </div>
+                            `
+                          : ""}
+                      </div>
+                    `
+                  )}
+                </div>
+              `
+            : ""}
+        </div>
+      </ha-card>
+    `;
+  }
+
+  protected shouldUpdate(changedProps: PropertyValues): boolean {
+    return hasConfigOrEntityChanged(this, changedProps);
+  }
+
+  private handleClick(): void {
+    fireEvent(this, "hass-more-info", { entityId: this._config!.entity });
+  }
+
+  private getUnit(measure: string): string {
+    const lengthUnit = this.hass!.config.unit_system.length || "";
+    switch (measure) {
+      case "air_pressure":
+        return lengthUnit === "km" ? "hPa" : "inHg";
+      case "length":
+        return lengthUnit;
+      case "precipitation":
+        return lengthUnit === "km" ? "mm" : "in";
+      default:
+        return this.hass!.config.unit_system[measure] || "";
+    }
+  }
+
+  private windBearingToText(degree: string): string {
+    const degreenum = parseInt(degree, 10);
+    if (isFinite(degreenum)) {
+      // tslint:disable-next-line: no-bitwise
+      return cardinalDirections[(((degreenum + 11.25) / 22.5) | 0) % 16];
+    }
+    return degree;
+  }
+
+  private getWindBearing(bearing: string): string {
+    if (bearing != null) {
+      const cardinalDirection = this.windBearingToText(bearing);
+      return `(${this.hass!.localize(
+        `ui.card.weather.cardinal_direction.${cardinalDirection.toLowerCase()}`
+      ) || cardinalDirection})`;
+    }
+    return ``;
+  }
+
+  private _showValue(item: string): boolean {
+    return typeof item !== "undefined" && item !== null;
+  }
+
+  static get styles(): CSSResult {
+    return css`
+      :host {
+        cursor: pointer;
+      }
+
+      .content {
+        padding: 0 20px 20px;
+      }
+
+      ha-icon {
+        color: var(--paper-item-icon-color);
+      }
+
+      .header {
+        font-family: var(--paper-font-headline_-_font-family);
+        -webkit-font-smoothing: var(
+          --paper-font-headline_-_-webkit-font-smoothing
+        );
+        font-size: var(--paper-font-headline_-_font-size);
+        font-weight: var(--paper-font-headline_-_font-weight);
+        letter-spacing: var(--paper-font-headline_-_letter-spacing);
+        line-height: var(--paper-font-headline_-_line-height);
+        text-rendering: var(
+          --paper-font-common-expensive-kerning_-_text-rendering
+        );
+        opacity: var(--dark-primary-opacity);
+        padding: 24px 16px 16px;
+        display: flex;
+        align-items: baseline;
+      }
+
+      .name {
+        margin-left: 16px;
+        font-size: 16px;
+        color: var(--secondary-text-color);
+      }
+
+      :host([rtl]) .name {
+        margin-left: 0px;
+        margin-right: 16px;
+      }
+
+      .now {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        flex-wrap: wrap;
+      }
+
+      .main {
+        display: flex;
+        align-items: center;
+        margin-right: 32px;
+      }
+
+      :host([rtl]) .main {
+        margin-right: 0px;
+      }
+
+      .main ha-icon {
+        --iron-icon-height: 72px;
+        --iron-icon-width: 72px;
+        margin-right: 8px;
+      }
+
+      :host([rtl]) .main ha-icon {
+        margin-right: 0px;
+      }
+
+      .main .temp {
+        font-size: 52px;
+        line-height: 1em;
+        position: relative;
+      }
+
+      :host([rtl]) .main .temp {
+        direction: ltr;
+        margin-right: 28px;
+      }
+
+      .main .temp span {
+        font-size: 24px;
+        line-height: 1em;
+        position: absolute;
+        top: 4px;
+      }
+
+      .measurand {
+        display: inline-block;
+      }
+
+      :host([rtl]) .measurand {
+        direction: ltr;
+      }
+
+      .forecast {
+        margin-top: 16px;
+        display: flex;
+        justify-content: space-between;
+      }
+
+      .forecast div {
+        flex: 0 0 auto;
+        text-align: center;
+      }
+
+      .forecast .icon {
+        margin: 4px 0;
+        text-align: center;
+      }
+
+      :host([rtl]) .forecast .temp {
+        direction: ltr;
+      }
+
+      .weekday {
+        font-weight: bold;
+      }
+
+      .attributes,
+      .templow,
+      .precipitation {
+        color: var(--secondary-text-color);
+      }
+
+      :host([rtl]) .precipitation {
+        direction: ltr;
+      }
+    `;
+  }
+}
+
+declare global {
+  interface HTMLElementTagNameMap {
+    "hui-weather-forecast-card": HuiWeatherForecastCard;
+  }
+}
--- a/src/panels/lovelace/components/hui-views-list.ts
+++ b/src/panels/lovelace/components/hui-views-list.ts
@ -0,0 +1,99 @@
+import {
+  customElement,
+  LitElement,
+  property,
+  TemplateResult,
+  html,
+  CSSResult,
+  css,
+} from "lit-element";
+import "@polymer/paper-listbox/paper-listbox";
+import "@polymer/paper-item/paper-icon-item";
+import "../../../../src/components/ha-icon";
+import { toggleAttribute } from "../../../../src/common/dom/toggle_attribute";
+import { fireEvent } from "../../../common/dom/fire_event";
+import { LovelaceConfig } from "../../../data/lovelace";
+
+declare global {
+  interface HASSDomEvents {
+    "view-selected": {
+      view: number;
+    };
+  }
+}
+
+@customElement("hui-views-list")
+class HuiViewsList extends LitElement {
+  @property() private lovelaceConfig?: LovelaceConfig | undefined;
+  @property() private selected?: number | undefined;
+
+  protected render(): TemplateResult | void {
+    if (!this.lovelaceConfig) {
+      return html``;
+    }
+
+    return html`
+      <paper-listbox attr-for-selected="data-index" .selected=${this.selected}>
+        ${this.lovelaceConfig.views.map(
+          (view, index) => html`
+            <paper-icon-item @click=${this._handlePickView} data-index=${index}>
+              ${view.icon
+                ? html`
+                    <ha-icon .icon=${view.icon} slot="item-icon"></ha-icon>
+                  `
+                : ""}
+              ${view.title || view.path}
+            </paper-icon-item>
+          `
+        )}
+      </paper-listbox>
+    `;
+  }
+
+  protected updated(changedProps) {
+    super.updated(changedProps);
+    toggleAttribute(
+      this,
+      "hide-icons",
+      this.lovelaceConfig
+        ? !this.lovelaceConfig.views.some((view) => view.icon)
+        : true
+    );
+  }
+
+  private async _handlePickView(ev: Event) {
+    const view = Number((ev.currentTarget as any).getAttribute("data-index"));
+    fireEvent(this, "view-selected", { view });
+  }
+
+  static get styles(): CSSResult {
+    return css`
+      paper-listbox {
+        padding-top: 0;
+      }
+
+      paper-listbox ha-icon {
+        padding: 12px;
+        color: var(--secondary-text-color);
+      }
+
+      paper-icon-item {
+        cursor: pointer;
+      }
+
+      paper-icon-item[disabled] {
+        cursor: initial;
+      }
+
+      :host([hide-icons]) paper-icon-item {
+        --paper-item-icon-width: 0px;
+      }
+    `;
+  }
+}
+
+declare global {
+  interface HTMLElementTagNameMap {
+    "hui-views-list": HuiViewsList;
+  }
+}
--- a/src/panels/lovelace/editor/card-editor/hui-dialog-move-card-view.ts
+++ b/src/panels/lovelace/editor/card-editor/hui-dialog-move-card-view.ts
@ -12,6 +12,8 @@ import "../../../../components/dialog/ha-paper-dialog";
 // tslint:disable-next-line:no-duplicate-imports
 import { HaPaperDialog } from "../../../../components/dialog/ha-paper-dialog";

+import "../../components/hui-views-list";
+
 import { moveCard } from "../config-util";
 import { MoveCardViewDialogParams } from "./show-move-card-view-dialog";
 import { PolymerChangedEvent } from "../../../../polymer-types";
@ -36,16 +38,11 @@ export class HuiDialogMoveCardView extends LitElement {
        @opened-changed="${this._openedChanged}"
      >
        <h2>Choose view to move card</h2>
-        ${this._params!.lovelace!.config.views.map((view, index) => {
-          return html`
-            <paper-item
-              ?active="${this._params!.path![0] === index}"
-              @click="${this._moveCard}"
-              .index="${index}"
-              >${view.title}</paper-item
-            >
-          `;
-        })}
+        <hui-views-list 
+        .lovelaceConfig=${this._params!.lovelace.config} 
+        .selected=${this._params!.path![0]} 
+        @view-selected=${this._moveCard}>
+        </hui-view-list>
      </ha-paper-dialog>
    `;
  }
@ -80,15 +77,14 @@ export class HuiDialogMoveCardView extends LitElement {
    return this.shadowRoot!.querySelector("ha-paper-dialog")!;
  }

-  private _moveCard(e: Event): void {
-    const newView = (e.currentTarget! as any).index;
+  private _moveCard(e: CustomEvent): void {
+    const newView = e.detail.view;
    const path = this._params!.path!;
    if (newView === path[0]) {
      return;
    }

    const lovelace = this._params!.lovelace!;
-
    lovelace.saveConfig(moveCard(lovelace.config, path, [newView!]));
    this._dialog.close();
  }
--- a/src/panels/lovelace/editor/lovelace-editor/hui-dialog-edit-lovelace.ts
+++ b/src/panels/lovelace/editor/lovelace-editor/hui-dialog-edit-lovelace.ts
@ -55,8 +55,15 @@ export class HuiDialogEditLovelace extends LitElement {
  protected render(): TemplateResult | void {
    return html`
      <ha-paper-dialog with-backdrop>
-        <h2>Edit Lovelace</h2>
+        <h2>
+          ${this.hass!.localize(
+            "ui.panel.lovelace.editor.edit_lovelace.header"
+          )}
+        </h2>
        <paper-dialog-scrollable>
+          ${this.hass!.localize(
+            "ui.panel.lovelace.editor.edit_lovelace.explanation"
+          )}
          <hui-lovelace-editor
            .hass="${this.hass}"
            .config="${this._config}"
--- a/src/panels/lovelace/entity-rows/hui-sensor-entity-row.ts
+++ b/src/panels/lovelace/entity-rows/hui-sensor-entity-row.ts
@ -62,7 +62,8 @@ class HuiSensorEntityRow extends LitElement implements EntityRow {
    return html`
      <hui-generic-entity-row .hass="${this.hass}" .config="${this._config}">
        <div>
-          ${stateObj.attributes.device_class === "timestamp"
+          ${stateObj.attributes.device_class === "timestamp" &&
+          stateObj.state !== "unavailable"
            ? html`
                <hui-timestamp-display
                  .hass="${this.hass}"
--- a/src/panels/profile/ha-mfa-module-setup-flow.js
+++ b/src/panels/profile/ha-mfa-module-setup-flow.js
@ -73,6 +73,7 @@ class HaMfaModuleSetupFlow extends LocalizeMixin(EventsMixin(PolymerElement)) {
          <template is="dom-if" if="[[_step]]">
            <template is="dom-if" if="[[_equals(_step.type, 'abort')]]">
              <ha-markdown
+                allowsvg
                content="[[_computeStepAbortedReason(localize, _step)]]"
              ></ha-markdown>
            </template>
@ -90,6 +91,7 @@ class HaMfaModuleSetupFlow extends LocalizeMixin(EventsMixin(PolymerElement)) {
                if="[[_computeStepDescription(localize, _step)]]"
              >
                <ha-markdown
+                  allowsvg
                  content="[[_computeStepDescription(localize, _step)]]"
                ></ha-markdown>
              </template>
--- a/src/resources/markdown_worker.ts
+++ b/src/resources/markdown_worker.ts
@ -2,9 +2,21 @@ import marked from "marked";
 // @ts-ignore
 import filterXSS from "xss";

-export const renderMarkdown = (content: string, markedOptions: object) =>
+const allowedSvgTags = ["svg", "path"];
+
+const allowedTag = (tag: string) => tag === "ha-icon";
+
+export const renderMarkdown = (
+  content: string,
+  markedOptions: object,
+  hassOptions: {
+    // Do not allow SVG on untrusted content, it allows XSS.
+    allowSvg?: boolean;
+  } = {}
+) =>
  filterXSS(marked(content, markedOptions), {
-    onIgnoreTag(tag, html) {
-      return ["svg", "path", "ha-icon"].indexOf(tag) !== -1 ? html : null;
-    },
+    onIgnoreTag: hassOptions.allowSvg
+      ? (tag, html) =>
+          allowedTag(tag) || allowedSvgTags.includes(tag) ? html : null
+      : (tag, html) => (allowedTag(tag) ? html : null),
  });
--- a/src/state/hass-element.ts
+++ b/src/state/hass-element.ts
@ -3,6 +3,7 @@ import AuthMixin from "./auth-mixin";
 import TranslationsMixin from "./translations-mixin";
 import ThemesMixin from "./themes-mixin";
 import MoreInfoMixin from "./more-info-mixin";
+import ZHADialogMixin from "./zha-dialog-mixin";
 import SidebarMixin from "./sidebar-mixin";
 import { dialogManagerMixin } from "./dialog-manager-mixin";
 import { connectionMixin } from "./connection-mixin";
@ -25,4 +26,5 @@ export class HassElement extends ext(HassBaseMixin(LitElement), [
  NotificationMixin,
  dialogManagerMixin,
  urlSyncMixin,
+  ZHADialogMixin,
 ]) {}
--- a/src/state/zha-dialog-mixin.ts
+++ b/src/state/zha-dialog-mixin.ts
@ -0,0 +1,29 @@
+import { Constructor, LitElement } from "lit-element";
+import { HassBaseEl } from "./hass-base-mixin";
+import {
+  showZHADeviceInfoDialog,
+  ZHADeviceInfoDialogParams,
+} from "../dialogs/zha-device-info-dialog/show-dialog-zha-device-info";
+import { HASSDomEvent } from "../common/dom/fire_event";
+
+declare global {
+  // for fire event
+  interface HASSDomEvents {
+    "zha-show-device-dialog": {
+      ieee: string;
+    };
+  }
+}
+
+export default (superClass: Constructor<LitElement & HassBaseEl>) =>
+  class extends superClass {
+    protected firstUpdated(changedProps) {
+      super.firstUpdated(changedProps);
+      this.addEventListener("zha-show-device-dialog", (e) =>
+        showZHADeviceInfoDialog(
+          e.target as HTMLElement,
+          (e as HASSDomEvent<ZHADeviceInfoDialogParams>).detail
+        )
+      );
+    }
+  };
--- a/src/translations/en.json
+++ b/src/translations/en.json
@ -446,6 +446,14 @@
      "script": {
        "execute": "Execute"
      },
+      "timer": {
+        "actions": {
+          "start": "start",
+          "pause": "pause",
+          "cancel": "cancel",
+          "finish": "finish"
+        }
+      },
      "vacuum": {
        "actions": {
          "resume_cleaning": "Resume cleaning",
@ -554,6 +562,20 @@
        "title": "System Options",
        "enable_new_entities_label": "Enable newly added entities.",
        "enable_new_entities_description": "If disabled, newly discovered entities will not be automatically added to Home Assistant."
+      },
+      "zha_device_info": {
+        "manuf": "by {manufacturer}",
+        "no_area": "No Area",
+        "services": {
+          "reconfigure": "Reconfigure ZHA device (heal device). Use this if you are having issues with the device. If the device in question is a battery powered device please ensure it is awake and accepting commands when you use this service.",
+          "updateDeviceName": "Set a custom name for this device in the device registry.",
+          "remove": "Remove a device from the ZigBee network."
+        },
+        "zha_device_card": {
+          "device_name_placeholder": "User given name",
+          "area_picker_label": "Area",
+          "update_name_button": "Update Name"
+        }
      }
    },
    "duration": {
@ -780,6 +802,9 @@
              "unsupported_condition": "Unsupported condition: {condition}",
              "type_select": "Condition type",
              "type": {
+                "device": {
+                  "label": "Device"
+                },
                "state": {
                  "label": "[%key:ui::panel::config::automation::editor::triggers::type::state::label%]",
                  "state": "[%key:ui::panel::config::automation::editor::triggers::type::state::label%]"
@ -942,16 +967,6 @@
        "zha": {
          "caption": "ZHA",
          "description": "Zigbee Home Automation network management",
-          "services": {
-            "reconfigure": "Reconfigure ZHA device (heal device). Use this if you are having issues with the device. If the device in question is a battery powered device please ensure it is awake and accepting commands when you use this service.",
-            "updateDeviceName": "Set a custom name for this device in the device registry.",
-            "remove": "Remove a device from the ZigBee network."
-          },
-          "device_card": {
-            "device_name_placeholder": "User given name",
-            "area_picker_label": "Area",
-            "update_name_button": "Update Name"
-          },
          "add_device_page": {
            "header": "Zigbee Home Automation - Add Devices",
            "spinner": "Searching for ZHA Zigbee devices...",
@ -1053,6 +1068,10 @@
            "unsaved_changes": "Unsaved changes",
            "saved": "Saved"
          },
+          "edit_lovelace": {
+            "header": "Title of your Lovelace UI",
+            "explanation": "This title is shown above all your views in Lovelace."
+          },
          "edit_view": {
            "header": "View Configuration",
            "add": "Add view",
--- a/src/translations/translationMetadata.json
+++ b/src/translations/translationMetadata.json
@ -70,6 +70,9 @@
  "hu": {
    "nativeName": "Magyar"
  },
+  "hy": {
+    "nativeName": "Հայերեն"
+  },
  "id": {
    "nativeName": "Indonesia"
  },
--- a/yarn.lock
+++ b/yarn.lock
@ -847,10 +847,10 @@
  dependencies:
    "@material/feature-targeting" "^0.44.1"

-"@mdi/svg@4.2.95":
-  version "4.2.95"
-  resolved "https://registry.yarnpkg.com/@mdi/svg/-/svg-4.2.95.tgz#05d45a4391da211da3de2e0e25acad8272c23d67"
-  integrity sha512-99vNFQO8g8YakSBNa4pNx0CxmgOOvvme8fHZCPOZsgVTaW8sJepS3zugUb/csU+tDTnlRztDoPAtzcXvn2WzwA==
+"@mdi/svg@4.3.95":
+  version "4.3.95"
+  resolved "https://registry.yarnpkg.com/@mdi/svg/-/svg-4.3.95.tgz#f2121132baab9e8953ee7ef71834cbe2f03065bb"
+  integrity sha512-RRda3q+270vhiL0Nt7oyeGX03zndEzkGJQJSz8dny1Yjwx2iVRUz51Xop6PTBPaEH4csa3sRkFY3q2PeIa2fKg==

 "@mrmlnc/readdir-enhanced@^2.2.1":
  version "2.2.1"
@ -8233,10 +8233,10 @@ js-yaml@3.12.0:
    argparse "^1.0.7"
    esprima "^4.0.0"

-js-yaml@^3.12.0, js-yaml@^3.13.0, js-yaml@^3.7.0:
-  version "3.13.0"
-  resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-3.13.0.tgz#38ee7178ac0eea2c97ff6d96fff4b18c7d8cf98e"
-  integrity sha512-pZZoSxcCYco+DIKBTimr67J6Hy+EYGZDY/HCWC+iAEA9h1ByhMXAIVUXMcMFpOCxQ/xjXmPI2MkDL5HRm5eFrQ==
+js-yaml@^3.12.0, js-yaml@^3.13.0, js-yaml@^3.13.1, js-yaml@^3.7.0:
+  version "3.13.1"
+  resolved "https://registry.yarnpkg.com/js-yaml/-/js-yaml-3.13.1.tgz#aff151b30bfdfa8e49e05da22e7415e9dfa37847"
+  integrity sha512-YfbcO7jXDdyj0DGxYVSlSeQNHbD7XPWvrVWeVUujrQEoZzWJIRrCPoyk6kL6IAjAG2IolMK4T0hNUe0HOUs5Jw==
  dependencies:
    argparse "^1.0.7"
    esprima "^4.0.0"
@ -9502,9 +9502,9 @@ mississippi@^3.0.0:
    through2 "^2.0.0"

 mixin-deep@^1.2.0:
-  version "1.3.1"
-  resolved "https://registry.yarnpkg.com/mixin-deep/-/mixin-deep-1.3.1.tgz#a49e7268dce1a0d9698e45326c5626df3543d0fe"
-  integrity sha512-8ZItLHeEgaqEvd5lYBXfm4EZSFCX29Jb9K+lAHhDKzReKBQKj3R+7NOF6tjqYi9t4oI8VUfaWITJQm86wnXGNQ==
+  version "1.3.2"
+  resolved "https://registry.yarnpkg.com/mixin-deep/-/mixin-deep-1.3.2.tgz#1120b43dc359a785dce65b55b82e257ccf479566"
+  integrity sha512-WRoDn//mXBiJ1H40rqa3vH0toePwSsGb45iInWlTySa+Uu4k3tYUSxa2v1KqAiLtvlrSzaExqS1gtk96A9zvEA==
  dependencies:
    for-in "^1.0.2"
    is-extendable "^1.0.1"