insteon-frontend-home-assistant 0.3.3__py3-none-any.whl → 0.3.4__py3-none-any.whl

insteon_frontend/frontend_latest/entrypoint-fbe0ce27.js.LICENSE.txt

@@ -0,0 +1,152 @@
+/**
+ * @fileoverview
+ * @suppress {checkPrototypalTypes}
+ * @license Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
+ * This code may only be used under the BSD style license found at
+ * http://polymer.github.io/LICENSE.txt The complete set of authors may be found
+ * at http://polymer.github.io/AUTHORS.txt The complete set of contributors may
+ * be found at http://polymer.github.io/CONTRIBUTORS.txt Code distributed by
+ * Google as part of the polymer project is also subject to an additional IP
+ * rights grant found at http://polymer.github.io/PATENTS.txt
+ */
+
+/**
+ * @license
+ * Copyright 2016 Google Inc.
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in
+ * all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+ * THE SOFTWARE.
+ */
+
+/**
+ * @license
+ * Copyright 2017 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+
+/**
+ * @license
+ * Copyright 2018 Google Inc.
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in
+ * all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+ * THE SOFTWARE.
+ */
+
+/**
+ * @license
+ * Copyright 2018 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+/**
+ * @license
+ * Copyright 2018 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+
+/**
+ * @license
+ * Copyright 2019 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+/**
+ * @license
+ * Copyright 2019 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+
+/**
+ * @license
+ * Copyright 2020 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+/**
+ * @license
+ * Copyright 2021 Google LLC
+ * SPDX-LIcense-Identifier: Apache-2.0
+ */
+
+/**
+ * @license
+ * Copyright 2021 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+/**
+ * @license
+ * Copyright 2021 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */
+
+/**
+@license
+Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at
+http://polymer.github.io/LICENSE.txt The complete set of authors may be found at
+http://polymer.github.io/AUTHORS.txt The complete set of contributors may be
+found at http://polymer.github.io/CONTRIBUTORS.txt Code distributed by Google as
+part of the polymer project is also subject to an additional IP rights grant
+found at http://polymer.github.io/PATENTS.txt
+*/
+
+/**
+@license
+Copyright (c) 2015 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+Code distributed by Google as part of the polymer project is also
+subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+*/
+
+/**
+@license
+Copyright (c) 2017 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+Code distributed by Google as part of the polymer project is also
+subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+*/
+
+/**
+@license
+Copyright (c) 2019 The Polymer Project Authors. All rights reserved.
+This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
+The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
+The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
+Code distributed by Google as part of the polymer project is also
+subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
+*/

insteon_frontend/frontend_latest/entrypoint-fbe0ce27.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"entrypoint-fbe0ce27.js","mappings":";;;AA4CA;;;AAMA;;AAEA;;;;;AAKA;;;;;AAKA;AAEA;;;AAGA;;;;;AAOA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6FA;;AC7GA;AACA;;AAEA;;;AAIA;AACA;AACA;AAEA;;;AAkBA;;AAEA;AACA;;AAEA;AACA;AACA;AACA;;AAGA;;;AASA;;AAGA;;;AAkBA;AACA;AACA;AACA;AACA;;;;;AAKA;AACA;AACA;AACA;AACA;;;;;AAKA;AACA;AACA;AACA;AACA;;AAGA;;;;ACnGA;;ACvBA;AACA;AACA;;AAGA;;ACaA;;AAEA;;AAwBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;AAKA;;ACtDA;AACA;AACA;AACA;;AAEA;;AAKA;;;;;;;;;;;;AAgBA;;AChBA;;AAEA;;AAEA;AAEA;;;;;;;;;;;;;;;AA2EA;;ACrHA;;;;;;;AAOA;;AAGA;;;;;;;;;;;;;;;;;AAqBA;ACrBA;AAEA;;AAGA;AACA;;AAEA;;AAGA;AACA;;;AAGA;;AAGA;;AAEA;AACA;;;;AAKA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgDA;AC1EA;AAGA;;AAGA;AACA;;AAEA;;AAGA;AACA;;;;;;;AAQA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwCA;;;;;;;;;;;;ACqFA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAwFA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuDA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyCA;;;;;;;;;;;;;;;;;AAmBA;;;;;;;;;;ACrQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;AAGA;;;AAGA;AACA;;;;;AAOA;;;AAIA;;AAMA;AAEA;ACuEA;AACA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC3GA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC2TA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACzPA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;ACrGA;;AChCA;AACA;AACA;AACA;;AARA","sources":["webpack://insteon-panel-frontend/./homeassistant-frontend/src/components/ha-alert.ts","webpack://insteon-panel-frontend/mwc-circular-progress-base.ts","webpack://insteon-panel-frontend/./homeassistant-frontend/src/components/ha-circular-progress.ts","webpack://insteon-panel-frontend/./homeassistant-frontend/src/components/ha-icon-button-arrow-prev.ts","webpack://insteon-panel-frontend/mwc-icon-button-base.ts","webpack://insteon-panel-frontend/./homeassistant-frontend/src/components/ha-icon-button.ts","webpack://insteon-panel-frontend/./homeassistant-frontend/src/components/ha-menu-button.ts","webpack://insteon-panel-frontend/./homeassistant-frontend/src/components/ha-svg-icon.ts","webpack://insteon-panel-frontend/./homeassistant-frontend/src/layouts/hass-error-screen.ts","webpack://insteon-panel-frontend/./homeassistant-frontend/src/layouts/hass-loading-screen.ts","webpack://insteon-panel-frontend/./homeassistant-frontend/src/resources/styles.ts","webpack://insteon-panel-frontend/mwc-button-base.ts","webpack://insteon-panel-frontend/mwc-ripple-base.ts","webpack://insteon-panel-frontend/./node_modules/@polymer/app-layout/app-toolbar/app-toolbar.js","webpack://insteon-panel-frontend/./node_modules/@polymer/iron-flex-layout/iron-flex-layout.js","webpack://insteon-panel-frontend/./node_modules/@polymer/paper-styles/typography.js","webpack://insteon-panel-frontend/./node_modules/@polymer/paper-styles/shadow.js","webpack://insteon-panel-frontend/./src/main.ts"],"sourcesContent":["import {\n  mdiAlertCircleOutline,\n  mdiAlertOutline,\n  mdiCheckboxMarkedCircleOutline,\n  mdiClose,\n  mdiInformationOutline,\n} from \"@mdi/js\";\nimport { css, html, LitElement } from \"lit\";\nimport { customElement, property } from \"lit/decorators\";\nimport { classMap } from \"lit/directives/class-map\";\nimport { fireEvent } from \"../common/dom/fire_event\";\nimport \"./ha-icon-button\";\nimport \"./ha-svg-icon\";\n\nconst ALERT_ICONS = {\n  info: mdiInformationOutline,\n  warning: mdiAlertOutline,\n  error: mdiAlertCircleOutline,\n  success: mdiCheckboxMarkedCircleOutline,\n};\n\ndeclare global {\n  interface HASSDomEvents {\n    \"alert-dismissed-clicked\": undefined;\n  }\n}\n\n@customElement(\"ha-alert\")\nclass HaAlert extends LitElement {\n  @property() public title = \"\";\n\n  @property({ attribute: \"alert-type\" }) public alertType:\n    | \"info\"\n    | \"warning\"\n    | \"error\"\n    | \"success\" = \"info\";\n\n  @property({ type: Boolean }) public dismissable = false;\n\n  @property({ type: Boolean }) public rtl = false;\n\n  public render() {\n    return html`\n      <div\n        class=\"issue-type ${classMap({\n          rtl: this.rtl,\n          [this.alertType]: true,\n        })}\"\n        role=\"alert\"\n      >\n        <div class=\"icon ${this.title ? \"\" : \"no-title\"}\">\n          <slot name=\"icon\">\n            <ha-svg-icon .path=${ALERT_ICONS[this.alertType]}></ha-svg-icon>\n          </slot>\n        </div>\n        <div class=\"content\">\n          <div class=\"main-content\">\n            ${this.title ? html`<div class=\"title\">${this.title}</div>` : \"\"}\n            <slot></slot>\n          </div>\n          <div class=\"action\">\n            <slot name=\"action\">\n              ${this.dismissable\n                ? html`<ha-icon-button\n                    @click=${this._dismiss_clicked}\n                    label=\"Dismiss alert\"\n                    .path=${mdiClose}\n                  ></ha-icon-button>`\n                : \"\"}\n            </slot>\n          </div>\n        </div>\n      </div>\n    `;\n  }\n\n  private _dismiss_clicked() {\n    fireEvent(this, \"alert-dismissed-clicked\");\n  }\n\n  static styles = css`\n    .issue-type {\n      position: relative;\n      padding: 8px;\n      display: flex;\n    }\n    .issue-type.rtl {\n      flex-direction: row-reverse;\n    }\n    .issue-type::after {\n      position: absolute;\n      top: 0;\n      right: 0;\n      bottom: 0;\n      left: 0;\n      opacity: 0.12;\n      pointer-events: none;\n      content: \"\";\n      border-radius: 4px;\n    }\n    .icon {\n      z-index: 1;\n    }\n    .icon.no-title {\n      align-self: center;\n    }\n    .issue-type.rtl > .content {\n      flex-direction: row-reverse;\n      text-align: right;\n    }\n    .content {\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      width: 100%;\n    }\n    .action {\n      z-index: 1;\n      width: min-content;\n      --mdc-theme-primary: var(--primary-text-color);\n    }\n    .main-content {\n      overflow-wrap: anywhere;\n      word-break: break-word;\n      margin-left: 8px;\n      margin-right: 0;\n    }\n    .issue-type.rtl > .content > .main-content {\n      margin-left: 0;\n      margin-right: 8px;\n    }\n    .title {\n      margin-top: 2px;\n      font-weight: bold;\n    }\n    .action mwc-button,\n    .action ha-icon-button {\n      --mdc-theme-primary: var(--primary-text-color);\n      --mdc-icon-button-size: 36px;\n    }\n    .issue-type.info > .icon {\n      color: var(--info-color);\n    }\n    .issue-type.info::after {\n      background-color: var(--info-color);\n    }\n\n    .issue-type.warning > .icon {\n      color: var(--warning-color);\n    }\n    .issue-type.warning::after {\n      background-color: var(--warning-color);\n    }\n\n    .issue-type.error > .icon {\n      color: var(--error-color);\n    }\n    .issue-type.error::after {\n      background-color: var(--error-color);\n    }\n\n    .issue-type.success > .icon {\n      color: var(--success-color);\n    }\n    .issue-type.success::after {\n      background-color: var(--success-color);\n    }\n  `;\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"ha-alert\": HaAlert;\n  }\n}\n","/**\n * @license\n * Copyright 2020 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\n// Style preference for leading underscores.\n// tslint:disable:strip-private-property-underscore\n\nimport {ariaProperty} from '@material/mwc-base/aria-property.js';\nimport {html, LitElement, PropertyValues, TemplateResult} from 'lit';\nimport {property} from 'lit/decorators.js';\nimport {classMap} from 'lit/directives/class-map.js';\nimport {ifDefined} from 'lit/directives/if-defined.js';\nimport {styleMap} from 'lit/directives/style-map.js';\n\n/** @soyCompatible */\nexport class CircularProgressBase extends LitElement {\n  @property({type: Boolean, reflect: true}) indeterminate = false;\n\n  @property({type: Number, reflect: true}) progress = 0;\n\n  @property({type: Number, reflect: true}) density = 0;\n\n  @property({type: Boolean, reflect: true}) closed = false;\n\n  /** @soyPrefixAttribute */\n  @ariaProperty\n  @property({type: String, attribute: 'aria-label'})\n  override ariaLabel!: string\n\n  open() {\n    this.closed = false;\n  }\n\n  close() {\n    this.closed = true;\n  }\n\n  /**\n   * @soyTemplate\n   */\n  protected override render(): TemplateResult {\n    /** @classMap */\n    const classes = {\n      'mdc-circular-progress--closed': this.closed,\n      'mdc-circular-progress--indeterminate': this.indeterminate,\n    };\n\n    const containerSideLength = 48 + this.density * 4;\n    /** @styleMap */\n    const styles = {\n      'width': `${containerSideLength}px`,\n      'height': `${containerSideLength}px`,\n    };\n\n    return html`\n      <div\n        class=\"mdc-circular-progress ${classMap(classes)}\"\n        style=\"${styleMap(styles)}\"\n        role=\"progressbar\"\n        aria-label=\"${ifDefined(this.ariaLabel)}\"\n        aria-valuemin=\"0\"\n        aria-valuemax=\"1\"\n        aria-valuenow=\"${\n        ifDefined(this.indeterminate ? undefined : this.progress)}\">\n        ${this.renderDeterminateContainer()}\n        ${this.renderIndeterminateContainer()}\n      </div>`;\n  }\n\n  /**\n   * @soyTemplate\n   */\n  protected renderDeterminateContainer(): TemplateResult {\n    const sideLength = 48 + this.density * 4;\n    const center = sideLength / 2;\n    const circleRadius = this.density >= -3 ? 18 + this.density * 11 / 6 :\n                                              12.5 + (this.density + 3) * 5 / 4;\n    const circumference = 2 * 3.1415926 * circleRadius;\n    const determinateStrokeDashOffset = (1 - this.progress) * circumference;\n    const strokeWidth = this.density >= -3 ? 4 + this.density * (1 / 3) :\n                                             3 + (this.density + 3) * (1 / 6);\n\n    return html`\n      <div class=\"mdc-circular-progress__determinate-container\">\n        <svg class=\"mdc-circular-progress__determinate-circle-graphic\"\n             viewBox=\"0 0 ${sideLength} ${sideLength}\">\n          <circle class=\"mdc-circular-progress__determinate-track\"\n                  cx=\"${center}\" cy=\"${center}\" r=\"${circleRadius}\"\n                  stroke-width=\"${strokeWidth}\"></circle>\n          <circle class=\"mdc-circular-progress__determinate-circle\"\n                  cx=\"${center}\" cy=\"${center}\" r=\"${circleRadius}\"\n                  stroke-dasharray=\"${2 * 3.1415926 * circleRadius}\"\n                  stroke-dashoffset=\"${determinateStrokeDashOffset}\"\n                  stroke-width=\"${strokeWidth}\"></circle>\n        </svg>\n      </div>`;\n  }\n\n  /**\n   * @soyTemplate\n   */\n  protected renderIndeterminateContainer(): TemplateResult {\n    return html`\n      <div class=\"mdc-circular-progress__indeterminate-container\">\n        <div class=\"mdc-circular-progress__spinner-layer\">\n          ${this.renderIndeterminateSpinnerLayer()}\n        </div>\n      </div>`;\n  }\n\n  /**\n   * @soyTemplate\n   */\n  protected renderIndeterminateSpinnerLayer(): TemplateResult {\n    const sideLength = 48 + this.density * 4;\n    const center = sideLength / 2;\n    const circleRadius = this.density >= -3 ? 18 + this.density * 11 / 6 :\n                                              12.5 + (this.density + 3) * 5 / 4;\n    const circumference = 2 * 3.1415926 * circleRadius;\n    const halfCircumference = 0.5 * circumference;\n    const strokeWidth = this.density >= -3 ? 4 + this.density * (1 / 3) :\n                                             3 + (this.density + 3) * (1 / 6);\n\n    return html`\n        <div class=\"mdc-circular-progress__circle-clipper mdc-circular-progress__circle-left\">\n          <svg class=\"mdc-circular-progress__indeterminate-circle-graphic\"\n               viewBox=\"0 0 ${sideLength} ${sideLength}\">\n            <circle cx=\"${center}\" cy=\"${center}\" r=\"${circleRadius}\"\n                    stroke-dasharray=\"${circumference}\"\n                    stroke-dashoffset=\"${halfCircumference}\"\n                    stroke-width=\"${strokeWidth}\"></circle>\n          </svg>\n        </div>\n        <div class=\"mdc-circular-progress__gap-patch\">\n          <svg class=\"mdc-circular-progress__indeterminate-circle-graphic\"\n               viewBox=\"0 0 ${sideLength} ${sideLength}\">\n            <circle cx=\"${center}\" cy=\"${center}\" r=\"${circleRadius}\"\n                    stroke-dasharray=\"${circumference}\"\n                    stroke-dashoffset=\"${halfCircumference}\"\n                    stroke-width=\"${strokeWidth * 0.8}\"></circle>\n          </svg>\n        </div>\n        <div class=\"mdc-circular-progress__circle-clipper mdc-circular-progress__circle-right\">\n          <svg class=\"mdc-circular-progress__indeterminate-circle-graphic\"\n               viewBox=\"0 0 ${sideLength} ${sideLength}\">\n            <circle cx=\"${center}\" cy=\"${center}\" r=\"${circleRadius}\"\n                    stroke-dasharray=\"${circumference}\"\n                    stroke-dashoffset=\"${halfCircumference}\"\n                    stroke-width=\"${strokeWidth}\"></circle>\n          </svg>\n        </div>`;\n  }\n\n  override update(changedProperties: PropertyValues<this>) {\n    super.update(changedProperties);\n\n    // Bound progress value in interval [0, 1].\n    if (changedProperties.has('progress')) {\n      if (this.progress > 1) {\n        this.progress = 1;\n      }\n\n      if (this.progress < 0) {\n        this.progress = 0;\n      }\n    }\n  }\n}\n","import { CircularProgress } from \"@material/mwc-circular-progress\";\nimport { CSSResultGroup, css } from \"lit\";\nimport { customElement, property } from \"lit/decorators\";\n\n@customElement(\"ha-circular-progress\")\n// @ts-ignore\nexport class HaCircularProgress extends CircularProgress {\n  @property({ type: Boolean })\n  public active = false;\n\n  @property()\n  public alt = \"Loading\";\n\n  @property()\n  public size: \"tiny\" | \"small\" | \"medium\" | \"large\" = \"medium\";\n\n  // @ts-ignore\n  public set density(_) {\n    // just a dummy\n  }\n\n  public get density() {\n    switch (this.size) {\n      case \"tiny\":\n        return -8;\n      case \"small\":\n        return -5;\n      case \"medium\":\n        return 0;\n      case \"large\":\n        return 5;\n      default:\n        return 0;\n    }\n  }\n\n  // @ts-ignore\n  public set indeterminate(_) {\n    // just a dummy\n  }\n\n  public get indeterminate() {\n    return this.active;\n  }\n\n  static get styles(): CSSResultGroup {\n    return [\n      super.styles,\n      css`\n        :host {\n          overflow: hidden;\n        }\n      `,\n    ];\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"ha-circular-progress\": HaCircularProgress;\n  }\n}\n","import { mdiArrowLeft, mdiArrowRight } from \"@mdi/js\";\nimport { html, LitElement, TemplateResult } from \"lit\";\nimport { customElement, property, state } from \"lit/decorators\";\nimport { HomeAssistant } from \"../types\";\nimport \"./ha-icon-button\";\n\n@customElement(\"ha-icon-button-arrow-prev\")\nexport class HaIconButtonArrowPrev extends LitElement {\n  @property({ attribute: false }) public hass?: HomeAssistant;\n\n  @property({ type: Boolean }) public disabled = false;\n\n  @property() public label?: string;\n\n  @state() private _icon = mdiArrowLeft;\n\n  public connectedCallback() {\n    super.connectedCallback();\n\n    // wait to check for direction since otherwise direction is wrong even though top level is RTL\n    setTimeout(() => {\n      this._icon =\n        window.getComputedStyle(this).direction === \"ltr\"\n          ? mdiArrowLeft\n          : mdiArrowRight;\n    }, 100);\n  }\n\n  protected render(): TemplateResult {\n    return html`\n      <ha-icon-button\n        .disabled=${this.disabled}\n        .label=${this.label || this.hass?.localize(\"ui.common.back\") || \"Back\"}\n        .path=${this._icon}\n      ></ha-icon-button>\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"ha-icon-button-arrow-prev\": HaIconButtonArrowPrev;\n  }\n}\n","/**\n * @license\n * Copyright 2018 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\n// Style preference for leading underscores.\n// tslint:disable:strip-private-property-underscore\n\nimport '@material/mwc-ripple/mwc-ripple.js';\n\nimport {AriaHasPopup, ariaProperty} from '@material/mwc-base/aria-property.js';\nimport {Ripple} from '@material/mwc-ripple/mwc-ripple.js';\nimport {RippleHandlers} from '@material/mwc-ripple/ripple-handlers.js';\nimport {html, LitElement, TemplateResult} from 'lit';\nimport {eventOptions, property, query, queryAsync, state} from 'lit/decorators.js';\nimport {ifDefined} from 'lit/directives/if-defined.js';\n\n/** @soyCompatible */\nexport class IconButtonBase extends LitElement {\n  @property({type: Boolean, reflect: true}) disabled = false;\n\n  @property({type: String}) icon = '';\n\n  /** @soyPrefixAttribute */\n  @ariaProperty\n  @property({type: String, attribute: 'aria-label'})\n  override ariaLabel!: string;\n\n  /** @soyPrefixAttribute */\n  @ariaProperty\n  @property({type: String, attribute: 'aria-haspopup'})\n  override ariaHasPopup!: AriaHasPopup;\n\n  @query('button') buttonElement!: HTMLElement;\n\n  @queryAsync('mwc-ripple') ripple!: Promise<Ripple|null>;\n\n  @state() protected shouldRenderRipple = false;\n\n  protected rippleHandlers: RippleHandlers = new RippleHandlers(() => {\n    this.shouldRenderRipple = true;\n    return this.ripple;\n  });\n\n  /** @soyTemplate */\n  protected renderRipple(): TemplateResult|string {\n    return this.shouldRenderRipple ? html`\n            <mwc-ripple\n                .disabled=\"${this.disabled}\"\n                unbounded>\n            </mwc-ripple>` :\n                                     '';\n  }\n\n  override focus() {\n    const buttonElement = this.buttonElement;\n    if (buttonElement) {\n      this.rippleHandlers.startFocus();\n      buttonElement.focus();\n    }\n  }\n\n  override blur() {\n    const buttonElement = this.buttonElement;\n    if (buttonElement) {\n      this.rippleHandlers.endFocus();\n      buttonElement.blur();\n    }\n  }\n\n  /** @soyTemplate */\n  protected override render(): TemplateResult {\n    return html`<button\n        class=\"mdc-icon-button mdc-icon-button--display-flex\"\n        aria-label=\"${this.ariaLabel || this.icon}\"\n        aria-haspopup=\"${ifDefined(this.ariaHasPopup)}\"\n        ?disabled=\"${this.disabled}\"\n        @focus=\"${this.handleRippleFocus}\"\n        @blur=\"${this.handleRippleBlur}\"\n        @mousedown=\"${this.handleRippleMouseDown}\"\n        @mouseenter=\"${this.handleRippleMouseEnter}\"\n        @mouseleave=\"${this.handleRippleMouseLeave}\"\n        @touchstart=\"${this.handleRippleTouchStart}\"\n        @touchend=\"${this.handleRippleDeactivate}\"\n        @touchcancel=\"${this.handleRippleDeactivate}\"\n    >${this.renderRipple()}\n    ${this.icon ? html`<i class=\"material-icons\">${this.icon}</i>` : ''}\n    <span\n      ><slot></slot\n    ></span>\n  </button>`;\n  }\n\n  @eventOptions({passive: true})\n  protected handleRippleMouseDown(event?: Event) {\n    const onUp = () => {\n      window.removeEventListener('mouseup', onUp);\n\n      this.handleRippleDeactivate();\n    };\n\n    window.addEventListener('mouseup', onUp);\n    this.rippleHandlers.startPress(event);\n  }\n\n  @eventOptions({passive: true})\n  protected handleRippleTouchStart(event?: Event) {\n    this.rippleHandlers.startPress(event);\n  }\n\n  protected handleRippleDeactivate() {\n    this.rippleHandlers.endPress();\n  }\n\n  protected handleRippleMouseEnter() {\n    this.rippleHandlers.startHover();\n  }\n\n  protected handleRippleMouseLeave() {\n    this.rippleHandlers.endHover();\n  }\n\n  protected handleRippleFocus() {\n    this.rippleHandlers.startFocus();\n  }\n\n  protected handleRippleBlur() {\n    this.rippleHandlers.endFocus();\n  }\n}\n","import \"@material/mwc-icon-button\";\nimport type { IconButton } from \"@material/mwc-icon-button\";\nimport { css, CSSResultGroup, html, LitElement, TemplateResult } from \"lit\";\nimport { customElement, property, query } from \"lit/decorators\";\nimport { ifDefined } from \"lit/directives/if-defined\";\nimport \"./ha-svg-icon\";\n\n@customElement(\"ha-icon-button\")\nexport class HaIconButton extends LitElement {\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  // SVG icon path (if you need a non SVG icon instead, use the provided slot to pass an <ha-icon> in)\n  @property({ type: String }) path?: string;\n\n  // Label that is used for ARIA support and as tooltip\n  @property({ type: String }) label?: string;\n\n  // These should always be set as properties, not attributes,\n  // so that only the <button> element gets the attribute\n  @property({ type: String, attribute: \"aria-haspopup\" })\n  override ariaHasPopup!: IconButton[\"ariaHasPopup\"];\n\n  @property({ type: Boolean }) hideTitle = false;\n\n  @query(\"mwc-icon-button\", true) private _button?: IconButton;\n\n  public override focus() {\n    this._button?.focus();\n  }\n\n  static shadowRootOptions: ShadowRootInit = {\n    mode: \"open\",\n    delegatesFocus: true,\n  };\n\n  protected render(): TemplateResult {\n    return html`\n      <mwc-icon-button\n        aria-label=${ifDefined(this.label)}\n        title=${ifDefined(this.hideTitle ? undefined : this.label)}\n        aria-haspopup=${ifDefined(this.ariaHasPopup)}\n        .disabled=${this.disabled}\n      >\n        ${this.path\n          ? html`<ha-svg-icon .path=${this.path}></ha-svg-icon>`\n          : html`<slot></slot>`}\n      </mwc-icon-button>\n    `;\n  }\n\n  static get styles(): CSSResultGroup {\n    return css`\n      :host {\n        display: inline-block;\n        outline: none;\n      }\n      :host([disabled]) {\n        pointer-events: none;\n      }\n      mwc-icon-button {\n        --mdc-theme-on-primary: currentColor;\n        --mdc-theme-text-disabled-on-light: var(--disabled-text-color);\n      }\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"ha-icon-button\": HaIconButton;\n  }\n}\n","import { mdiMenu } from \"@mdi/js\";\nimport { UnsubscribeFunc } from \"home-assistant-js-websocket\";\nimport { css, CSSResultGroup, html, LitElement, TemplateResult } from \"lit\";\nimport { customElement, property, state } from \"lit/decorators\";\nimport { fireEvent } from \"../common/dom/fire_event\";\nimport { subscribeNotifications } from \"../data/persistent_notification\";\nimport { HomeAssistant } from \"../types\";\nimport \"./ha-icon-button\";\n\n@customElement(\"ha-menu-button\")\nclass HaMenuButton extends LitElement {\n  @property({ type: Boolean }) public hassio = false;\n\n  @property() public narrow!: boolean;\n\n  @property({ attribute: false }) public hass!: HomeAssistant;\n\n  @state() private _hasNotifications = false;\n\n  private _alwaysVisible = false;\n\n  private _attachNotifOnConnect = false;\n\n  private _unsubNotifications?: UnsubscribeFunc;\n\n  public connectedCallback() {\n    super.connectedCallback();\n    if (this._attachNotifOnConnect) {\n      this._attachNotifOnConnect = false;\n      this._subscribeNotifications();\n    }\n  }\n\n  public disconnectedCallback() {\n    super.disconnectedCallback();\n    if (this._unsubNotifications) {\n      this._attachNotifOnConnect = true;\n      this._unsubNotifications();\n      this._unsubNotifications = undefined;\n    }\n  }\n\n  protected render(): TemplateResult {\n    const hasNotifications =\n      this._hasNotifications &&\n      (this.narrow || this.hass.dockedSidebar === \"always_hidden\");\n    return html`\n      <ha-icon-button\n        .label=${this.hass.localize(\"ui.sidebar.sidebar_toggle\")}\n        .path=${mdiMenu}\n        @click=${this._toggleMenu}\n      ></ha-icon-button>\n      ${hasNotifications ? html`<div class=\"dot\"></div>` : \"\"}\n    `;\n  }\n\n  protected firstUpdated(changedProps) {\n    super.firstUpdated(changedProps);\n    if (!this.hassio) {\n      return;\n    }\n    // This component is used on Hass.io too, but Hass.io might run the UI\n    // on older frontends too, that don't have an always visible menu button\n    // in the sidebar.\n    this._alwaysVisible =\n      (Number((window.parent as any).frontendVersion) || 0) < 20190710;\n  }\n\n  protected updated(changedProps) {\n    super.updated(changedProps);\n\n    if (!changedProps.has(\"narrow\") && !changedProps.has(\"hass\")) {\n      return;\n    }\n\n    const oldHass = changedProps.get(\"hass\") as HomeAssistant | undefined;\n    const oldNarrow =\n      changedProps.get(\"narrow\") ||\n      (oldHass && oldHass.dockedSidebar === \"always_hidden\");\n    const newNarrow =\n      this.narrow || this.hass.dockedSidebar === \"always_hidden\";\n\n    if (oldNarrow === newNarrow) {\n      return;\n    }\n\n    this.style.display = newNarrow || this._alwaysVisible ? \"initial\" : \"none\";\n\n    if (!newNarrow) {\n      if (this._unsubNotifications) {\n        this._unsubNotifications();\n        this._unsubNotifications = undefined;\n      }\n      return;\n    }\n\n    this._subscribeNotifications();\n  }\n\n  private _subscribeNotifications() {\n    this._unsubNotifications = subscribeNotifications(\n      this.hass.connection,\n      (notifications) => {\n        this._hasNotifications = notifications.length > 0;\n      }\n    );\n  }\n\n  private _toggleMenu(): void {\n    fireEvent(this, \"hass-toggle-menu\");\n  }\n\n  static get styles(): CSSResultGroup {\n    return css`\n      :host {\n        position: relative;\n      }\n      .dot {\n        pointer-events: none;\n        position: absolute;\n        background-color: var(--accent-color);\n        width: 12px;\n        height: 12px;\n        top: 9px;\n        right: 7px;\n        border-radius: 50%;\n        border: 2px solid var(--app-header-background-color);\n      }\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"ha-menu-button\": HaMenuButton;\n  }\n}\n","import { css, CSSResultGroup, LitElement, svg, SVGTemplateResult } from \"lit\";\nimport { customElement, property } from \"lit/decorators\";\n\n@customElement(\"ha-svg-icon\")\nexport class HaSvgIcon extends LitElement {\n  @property() public path?: string;\n\n  @property() public viewBox?: string;\n\n  protected render(): SVGTemplateResult {\n    return svg`\n    <svg\n      viewBox=${this.viewBox || \"0 0 24 24\"}\n      preserveAspectRatio=\"xMidYMid meet\"\n      focusable=\"false\"\n      role=\"img\" \n      aria-hidden=\"true\"\n    >\n      <g>\n      ${this.path ? svg`<path d=${this.path}></path>` : \"\"}\n      </g>\n    </svg>`;\n  }\n\n  static get styles(): CSSResultGroup {\n    return css`\n      :host {\n        display: var(--ha-icon-display, inline-flex);\n        align-items: center;\n        justify-content: center;\n        position: relative;\n        vertical-align: middle;\n        fill: currentcolor;\n        width: var(--mdc-icon-size, 24px);\n        height: var(--mdc-icon-size, 24px);\n      }\n      svg {\n        width: 100%;\n        height: 100%;\n        pointer-events: none;\n        display: block;\n      }\n    `;\n  }\n}\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"ha-svg-icon\": HaSvgIcon;\n  }\n}\n","import \"@material/mwc-button\";\nimport { css, CSSResultGroup, html, LitElement, TemplateResult } from \"lit\";\nimport { customElement, property } from \"lit/decorators\";\nimport \"../components/ha-icon-button-arrow-prev\";\nimport \"../components/ha-menu-button\";\nimport { HomeAssistant } from \"../types\";\nimport \"../components/ha-alert\";\n\n@customElement(\"hass-error-screen\")\nclass HassErrorScreen extends LitElement {\n  @property({ attribute: false }) public hass!: HomeAssistant;\n\n  @property({ type: Boolean }) public toolbar = true;\n\n  @property({ type: Boolean }) public rootnav = false;\n\n  @property({ type: Boolean }) public narrow = false;\n\n  @property() public error?: string;\n\n  protected render(): TemplateResult {\n    return html`\n      ${this.toolbar\n        ? html`<div class=\"toolbar\">\n            ${this.rootnav || history.state?.root\n              ? html`\n                  <ha-menu-button\n                    .hass=${this.hass}\n                    .narrow=${this.narrow}\n                  ></ha-menu-button>\n                `\n              : html`\n                  <ha-icon-button-arrow-prev\n                    .hass=${this.hass}\n                    @click=${this._handleBack}\n                  ></ha-icon-button-arrow-prev>\n                `}\n          </div>`\n        : \"\"}\n      <div class=\"content\">\n        <ha-alert alert-type=\"error\">${this.error}</ha-alert>\n        <slot>\n          <mwc-button @click=${this._handleBack}>\n            ${this.hass?.localize(\"ui.common.back\")}\n          </mwc-button>\n        </slot>\n      </div>\n    `;\n  }\n\n  private _handleBack(): void {\n    history.back();\n  }\n\n  static get styles(): CSSResultGroup {\n    return [\n      css`\n        :host {\n          display: block;\n          height: 100%;\n          background-color: var(--primary-background-color);\n        }\n        .toolbar {\n          display: flex;\n          align-items: center;\n          font-size: 20px;\n          height: var(--header-height);\n          padding: 0 16px;\n          pointer-events: none;\n          background-color: var(--app-header-background-color);\n          font-weight: 400;\n          color: var(--app-header-text-color, white);\n          border-bottom: var(--app-header-border-bottom, none);\n          box-sizing: border-box;\n        }\n        ha-icon-button-arrow-prev {\n          pointer-events: auto;\n        }\n        .content {\n          color: var(--primary-text-color);\n          height: calc(100% - var(--header-height));\n          display: flex;\n          padding: 16px;\n          align-items: center;\n          justify-content: center;\n          flex-direction: column;\n          box-sizing: border-box;\n        }\n        a {\n          color: var(--primary-color);\n        }\n        ha-alert {\n          margin-bottom: 16px;\n        }\n      `,\n    ];\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"hass-error-screen\": HassErrorScreen;\n  }\n}\n","import \"@polymer/app-layout/app-toolbar/app-toolbar\";\nimport { css, CSSResultGroup, html, LitElement, TemplateResult } from \"lit\";\nimport { customElement, property } from \"lit/decorators\";\nimport \"../components/ha-circular-progress\";\nimport \"../components/ha-icon-button-arrow-prev\";\nimport \"../components/ha-menu-button\";\nimport { haStyle } from \"../resources/styles\";\nimport { HomeAssistant } from \"../types\";\n\n@customElement(\"hass-loading-screen\")\nclass HassLoadingScreen extends LitElement {\n  @property({ attribute: false }) public hass?: HomeAssistant;\n\n  @property({ type: Boolean, attribute: \"no-toolbar\" })\n  public noToolbar = false;\n\n  @property({ type: Boolean }) public rootnav = false;\n\n  @property({ type: Boolean }) public narrow = false;\n\n  protected render(): TemplateResult {\n    return html`\n      ${this.noToolbar\n        ? \"\"\n        : html`<div class=\"toolbar\">\n            ${this.rootnav || history.state?.root\n              ? html`\n                  <ha-menu-button\n                    .hass=${this.hass}\n                    .narrow=${this.narrow}\n                  ></ha-menu-button>\n                `\n              : html`\n                  <ha-icon-button-arrow-prev\n                    .hass=${this.hass}\n                    @click=${this._handleBack}\n                  ></ha-icon-button-arrow-prev>\n                `}\n          </div>`}\n      <div class=\"content\">\n        <ha-circular-progress active></ha-circular-progress>\n      </div>\n    `;\n  }\n\n  private _handleBack() {\n    history.back();\n  }\n\n  static get styles(): CSSResultGroup {\n    return [\n      haStyle,\n      css`\n        :host {\n          display: block;\n          height: 100%;\n          background-color: var(--primary-background-color);\n        }\n        .toolbar {\n          display: flex;\n          align-items: center;\n          font-size: 20px;\n          height: var(--header-height);\n          padding: 0 16px;\n          pointer-events: none;\n          background-color: var(--app-header-background-color);\n          font-weight: 400;\n          color: var(--app-header-text-color, white);\n          border-bottom: var(--app-header-border-bottom, none);\n          box-sizing: border-box;\n        }\n        ha-menu-button,\n        ha-icon-button-arrow-prev {\n          pointer-events: auto;\n        }\n        .content {\n          height: calc(100% - var(--header-height));\n          display: flex;\n          align-items: center;\n          justify-content: center;\n        }\n      `,\n    ];\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"hass-loading-screen\": HassLoadingScreen;\n  }\n}\n","import { css } from \"lit\";\n\nexport const darkStyles = {\n  \"primary-background-color\": \"#111111\",\n  \"card-background-color\": \"#1c1c1c\",\n  \"secondary-background-color\": \"#202020\",\n  \"primary-text-color\": \"#e1e1e1\",\n  \"secondary-text-color\": \"#9b9b9b\",\n  \"disabled-text-color\": \"#6f6f6f\",\n  \"app-header-text-color\": \"#e1e1e1\",\n  \"app-header-background-color\": \"#101e24\",\n  \"switch-unchecked-button-color\": \"#999999\",\n  \"switch-unchecked-track-color\": \"#9b9b9b\",\n  \"divider-color\": \"rgba(225, 225, 225, .12)\",\n  \"mdc-ripple-color\": \"#AAAAAA\",\n\n  \"input-idle-line-color\": \"rgba(255, 255, 255, 0.42)\",\n  \"input-hover-line-color\": \"rgba(255, 255, 255, 0.87)\",\n  \"input-disabled-line-color\": \"rgba(255, 255, 255, 0.06)\",\n  \"input-outlined-idle-border-color\": \"rgba(255, 255, 255, 0.38)\",\n  \"input-outlined-hover-border-color\": \"rgba(255, 255, 255, 0.87)\",\n  \"input-outlined-disabled-border-color\": \"rgba(255, 255, 255, 0.06)\",\n  \"input-fill-color\": \"rgba(255, 255, 255, 0.05)\",\n  \"input-disabled-fill-color\": \"rgba(255, 255, 255, 0.02)\",\n  \"input-ink-color\": \"rgba(255, 255, 255, 0.87)\",\n  \"input-label-ink-color\": \"rgba(255, 255, 255, 0.6)\",\n  \"input-disabled-ink-color\": \"rgba(255, 255, 255, 0.37)\",\n  \"input-dropdown-icon-color\": \"rgba(255, 255, 255, 0.54)\",\n\n  \"codemirror-keyword\": \"#C792EA\",\n  \"codemirror-operator\": \"#89DDFF\",\n  \"codemirror-variable\": \"#f07178\",\n  \"codemirror-variable-2\": \"#EEFFFF\",\n  \"codemirror-variable-3\": \"#DECB6B\",\n  \"codemirror-builtin\": \"#FFCB6B\",\n  \"codemirror-atom\": \"#F78C6C\",\n  \"codemirror-number\": \"#FF5370\",\n  \"codemirror-def\": \"#82AAFF\",\n  \"codemirror-string\": \"#C3E88D\",\n  \"codemirror-string-2\": \"#f07178\",\n  \"codemirror-comment\": \"#545454\",\n  \"codemirror-tag\": \"#FF5370\",\n  \"codemirror-meta\": \"#FFCB6B\",\n  \"codemirror-attribute\": \"#C792EA\",\n  \"codemirror-property\": \"#C792EA\",\n  \"codemirror-qualifier\": \"#DECB6B\",\n  \"codemirror-type\": \"#DECB6B\",\n  \"energy-grid-return-color\": \"#a280db\",\n  \"map-filter\":\n    \"invert(.9) hue-rotate(170deg) brightness(1.5) contrast(1.2) saturate(.3)\",\n  \"disabled-color\": \"#464646\",\n};\n\nexport const derivedStyles = {\n  \"state-icon-error-color\": \"var(--error-state-color, var(--error-color))\",\n  \"state-unavailable-color\":\n    \"var(--state-icon-unavailable-color, var(--disabled-text-color))\",\n  \"sidebar-text-color\": \"var(--primary-text-color)\",\n  \"sidebar-background-color\": \"var(--card-background-color)\",\n  \"sidebar-selected-text-color\": \"var(--primary-color)\",\n  \"sidebar-selected-icon-color\": \"var(--primary-color)\",\n  \"sidebar-icon-color\": \"rgba(var(--rgb-primary-text-color), 0.6)\",\n  \"switch-checked-color\": \"var(--primary-color)\",\n  \"switch-checked-button-color\":\n    \"var(--switch-checked-color, var(--primary-background-color))\",\n  \"switch-checked-track-color\": \"var(--switch-checked-color, #000000)\",\n  \"switch-unchecked-button-color\":\n    \"var(--switch-unchecked-color, var(--primary-background-color))\",\n  \"switch-unchecked-track-color\": \"var(--switch-unchecked-color, #000000)\",\n  \"slider-color\": \"var(--primary-color)\",\n  \"slider-secondary-color\": \"var(--light-primary-color)\",\n  \"slider-track-color\": \"var(--scrollbar-thumb-color)\",\n  \"label-badge-background-color\": \"var(--card-background-color)\",\n  \"label-badge-text-color\": \"rgba(var(--rgb-primary-text-color), 0.8)\",\n  \"paper-listbox-background-color\": \"var(--card-background-color)\",\n  \"paper-item-icon-color\": \"var(--state-icon-color)\",\n  \"paper-item-icon-active-color\": \"var(--state-icon-active-color)\",\n  \"table-header-background-color\": \"var(--input-fill-color)\",\n  \"table-row-background-color\": \"var(--primary-background-color)\",\n  \"table-row-alternative-background-color\": \"var(--secondary-background-color)\",\n  \"paper-slider-knob-color\": \"var(--slider-color)\",\n  \"paper-slider-knob-start-color\": \"var(--slider-color)\",\n  \"paper-slider-pin-color\": \"var(--slider-color)\",\n  \"paper-slider-pin-start-color\": \"var(--slider-color)\",\n  \"paper-slider-active-color\": \"var(--slider-color)\",\n  \"paper-slider-secondary-color\": \"var(--slider-secondary-color)\",\n  \"paper-slider-container-color\": \"var(--slider-track-color)\",\n  \"data-table-background-color\": \"var(--card-background-color)\",\n  \"markdown-code-background-color\": \"var(--primary-background-color)\",\n\n  // https://github.com/material-components/material-web/blob/master/docs/theming.md\n  \"mdc-theme-primary\": \"var(--primary-color)\",\n  \"mdc-theme-secondary\": \"var(--accent-color)\",\n  \"mdc-theme-background\": \"var(--primary-background-color)\",\n  \"mdc-theme-surface\": \"var(--card-background-color)\",\n  \"mdc-theme-on-primary\": \"var(--text-primary-color)\",\n  \"mdc-theme-on-secondary\": \"var(--text-primary-color)\",\n  \"mdc-theme-on-surface\": \"var(--primary-text-color)\",\n  \"mdc-theme-text-disabled-on-light\": \"var(--disabled-text-color)\",\n  \"mdc-theme-text-primary-on-background\": \"var(--primary-text-color)\",\n  \"mdc-theme-text-secondary-on-background\": \"var(--secondary-text-color)\",\n  \"mdc-theme-text-hint-on-background\": \"var(--secondary-text-color)\",\n  \"mdc-theme-text-icon-on-background\": \"var(--secondary-text-color)\",\n  \"mdc-theme-error\": \"var(--error-color)\",\n  \"app-header-text-color\": \"var(--text-primary-color)\",\n  \"app-header-background-color\": \"var(--primary-color)\",\n  \"mdc-checkbox-unchecked-color\": \"rgba(var(--rgb-primary-text-color), 0.54)\",\n  \"mdc-checkbox-disabled-color\": \"var(--disabled-text-color)\",\n  \"mdc-radio-unchecked-color\": \"rgba(var(--rgb-primary-text-color), 0.54)\",\n  \"mdc-radio-disabled-color\": \"var(--disabled-text-color)\",\n  \"mdc-tab-text-label-color-default\": \"var(--primary-text-color)\",\n  \"mdc-button-disabled-ink-color\": \"var(--disabled-text-color)\",\n  \"mdc-button-outline-color\": \"var(--divider-color)\",\n  \"mdc-dialog-scroll-divider-color\": \"var(--divider-color)\",\n\n  \"mdc-text-field-idle-line-color\": \"var(--input-idle-line-color)\",\n  \"mdc-text-field-hover-line-color\": \"var(--input-hover-line-color)\",\n  \"mdc-text-field-disabled-line-color\": \"var(--input-disabled-line-color)\",\n  \"mdc-text-field-outlined-idle-border-color\":\n    \"var(--input-outlined-idle-border-color)\",\n  \"mdc-text-field-outlined-hover-border-color\":\n    \"var(--input-outlined-hover-border-color)\",\n  \"mdc-text-field-outlined-disabled-border-color\":\n    \"var(--input-outlined-disabled-border-color)\",\n  \"mdc-text-field-fill-color\": \"var(--input-fill-color)\",\n  \"mdc-text-field-disabled-fill-color\": \"var(--input-disabled-fill-color)\",\n  \"mdc-text-field-ink-color\": \"var(--input-ink-color)\",\n  \"mdc-text-field-label-ink-color\": \"var(--input-label-ink-color)\",\n  \"mdc-text-field-disabled-ink-color\": \"var(--input-disabled-ink-color)\",\n\n  \"mdc-select-idle-line-color\": \"var(--input-idle-line-color)\",\n  \"mdc-select-hover-line-color\": \"var(--input-hover-line-color)\",\n  \"mdc-select-outlined-idle-border-color\":\n    \"var(--input-outlined-idle-border-color)\",\n  \"mdc-select-outlined-hover-border-color\":\n    \"var(--input-outlined-hover-border-color)\",\n  \"mdc-select-outlined-disabled-border-color\":\n    \"var(--input-outlined-disabled-border-color)\",\n  \"mdc-select-fill-color\": \"var(--input-fill-color)\",\n  \"mdc-select-disabled-fill-color\": \"var(--input-disabled-fill-color)\",\n  \"mdc-select-ink-color\": \"var(--input-ink-color)\",\n  \"mdc-select-label-ink-color\": \"var(--input-label-ink-color)\",\n  \"mdc-select-disabled-ink-color\": \"var(--input-disabled-ink-color)\",\n  \"mdc-select-dropdown-icon-color\": \"var(--input-dropdown-icon-color)\",\n  \"mdc-select-disabled-dropdown-icon-color\": \"var(--input-disabled-ink-color)\",\n\n  \"chip-background-color\": \"rgba(var(--rgb-primary-text-color), 0.15)\",\n  // Vaadin\n  \"material-body-text-color\": \"var(--primary-text-color)\",\n  \"material-background-color\": \"var(--card-background-color)\",\n  \"material-secondary-background-color\": \"var(--secondary-background-color)\",\n  \"material-secondary-text-color\": \"var(--secondary-text-color)\",\n};\n\nexport const buttonLinkStyle = css`\n  button.link {\n    background: none;\n    color: inherit;\n    border: none;\n    padding: 0;\n    font: inherit;\n    text-align: left;\n    text-decoration: underline;\n    cursor: pointer;\n    outline: none;\n  }\n`;\n\nexport const haStyle = css`\n  :host {\n    font-family: var(--paper-font-body1_-_font-family);\n    -webkit-font-smoothing: var(--paper-font-body1_-_-webkit-font-smoothing);\n    font-size: var(--paper-font-body1_-_font-size);\n    font-weight: var(--paper-font-body1_-_font-weight);\n    line-height: var(--paper-font-body1_-_line-height);\n  }\n\n  app-header-layout,\n  ha-app-layout {\n    background-color: var(--primary-background-color);\n  }\n\n  app-header,\n  app-toolbar {\n    background-color: var(--app-header-background-color);\n    font-weight: 400;\n    color: var(--app-header-text-color, white);\n  }\n\n  app-toolbar {\n    height: var(--header-height);\n    border-bottom: var(--app-header-border-bottom);\n    box-sizing: border-box;\n  }\n\n  app-header div[sticky] {\n    height: 48px;\n  }\n\n  app-toolbar [main-title] {\n    margin-left: 20px;\n  }\n\n  h1 {\n    font-family: var(--paper-font-headline_-_font-family);\n    -webkit-font-smoothing: var(--paper-font-headline_-_-webkit-font-smoothing);\n    white-space: var(--paper-font-headline_-_white-space);\n    overflow: var(--paper-font-headline_-_overflow);\n    text-overflow: var(--paper-font-headline_-_text-overflow);\n    font-size: var(--paper-font-headline_-_font-size);\n    font-weight: var(--paper-font-headline_-_font-weight);\n    line-height: var(--paper-font-headline_-_line-height);\n  }\n\n  h2 {\n    font-family: var(--paper-font-title_-_font-family);\n    -webkit-font-smoothing: var(--paper-font-title_-_-webkit-font-smoothing);\n    white-space: var(--paper-font-title_-_white-space);\n    overflow: var(--paper-font-title_-_overflow);\n    text-overflow: var(--paper-font-title_-_text-overflow);\n    font-size: var(--paper-font-title_-_font-size);\n    font-weight: var(--paper-font-title_-_font-weight);\n    line-height: var(--paper-font-title_-_line-height);\n  }\n\n  h3 {\n    font-family: var(--paper-font-subhead_-_font-family);\n    -webkit-font-smoothing: var(--paper-font-subhead_-_-webkit-font-smoothing);\n    white-space: var(--paper-font-subhead_-_white-space);\n    overflow: var(--paper-font-subhead_-_overflow);\n    text-overflow: var(--paper-font-subhead_-_text-overflow);\n    font-size: var(--paper-font-subhead_-_font-size);\n    font-weight: var(--paper-font-subhead_-_font-weight);\n    line-height: var(--paper-font-subhead_-_line-height);\n  }\n\n  a {\n    color: var(--primary-color);\n  }\n\n  .secondary {\n    color: var(--secondary-text-color);\n  }\n\n  .error {\n    color: var(--error-color);\n  }\n\n  .warning {\n    color: var(--error-color);\n  }\n\n  mwc-button.warning {\n    --mdc-theme-primary: var(--error-color);\n  }\n\n  ${buttonLinkStyle}\n\n  .card-actions a {\n    text-decoration: none;\n  }\n\n  .card-actions .warning {\n    --mdc-theme-primary: var(--error-color);\n  }\n\n  .layout.horizontal,\n  .layout.vertical {\n    display: flex;\n  }\n  .layout.inline {\n    display: inline-flex;\n  }\n  .layout.horizontal {\n    flex-direction: row;\n  }\n  .layout.vertical {\n    flex-direction: column;\n  }\n  .layout.wrap {\n    flex-wrap: wrap;\n  }\n  .layout.no-wrap {\n    flex-wrap: nowrap;\n  }\n  .layout.center,\n  .layout.center-center {\n    align-items: center;\n  }\n  .layout.bottom {\n    align-items: flex-end;\n  }\n  .layout.center-justified,\n  .layout.center-center {\n    justify-content: center;\n  }\n  .flex {\n    flex: 1;\n    flex-basis: 0.000000001px;\n  }\n  .flex-auto {\n    flex: 1 1 auto;\n  }\n  .flex-none {\n    flex: none;\n  }\n  .layout.justified {\n    justify-content: space-between;\n  }\n`;\n\nexport const haStyleDialog = css`\n  /* mwc-dialog (ha-dialog) styles */\n  ha-dialog {\n    --mdc-dialog-min-width: 400px;\n    --mdc-dialog-max-width: 600px;\n    --mdc-dialog-heading-ink-color: var(--primary-text-color);\n    --mdc-dialog-content-ink-color: var(--primary-text-color);\n    --justify-action-buttons: space-between;\n  }\n\n  ha-dialog .form {\n    color: var(--primary-text-color);\n  }\n\n  a {\n    color: var(--primary-color);\n  }\n\n  /* make dialog fullscreen on small screens */\n  @media all and (max-width: 450px), all and (max-height: 500px) {\n    ha-dialog {\n      --mdc-dialog-min-width: calc(\n        100vw - env(safe-area-inset-right) - env(safe-area-inset-left)\n      );\n      --mdc-dialog-max-width: calc(\n        100vw - env(safe-area-inset-right) - env(safe-area-inset-left)\n      );\n      --mdc-dialog-min-height: 100%;\n      --mdc-dialog-max-height: 100%;\n      --vertical-align-dialog: flex-end;\n      --ha-dialog-border-radius: 0px;\n    }\n  }\n  mwc-button.warning {\n    --mdc-theme-primary: var(--error-color);\n  }\n  .error {\n    color: var(--error-color);\n  }\n`;\n\nexport const haStyleScrollbar = css`\n  .ha-scrollbar::-webkit-scrollbar {\n    width: 0.4rem;\n    height: 0.4rem;\n  }\n\n  .ha-scrollbar::-webkit-scrollbar-thumb {\n    -webkit-border-radius: 4px;\n    border-radius: 4px;\n    background: var(--scrollbar-thumb-color);\n  }\n\n  .ha-scrollbar {\n    overflow-y: auto;\n    scrollbar-color: var(--scrollbar-thumb-color) transparent;\n    scrollbar-width: thin;\n  }\n`;\n\nexport const baseEntrypointStyles = css`\n  body {\n    background-color: var(--primary-background-color);\n    color: var(--primary-text-color);\n    height: calc(100vh - 32px);\n    width: 100vw;\n  }\n`;\n","/**\n * @license\n * Copyright 2019 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\n// Style preference for leading underscores.\n// tslint:disable:strip-private-property-underscore\n\nimport '@material/mwc-icon/mwc-icon.js';\nimport '@material/mwc-ripple/mwc-ripple.js';\n\nimport {AriaHasPopup, ariaProperty} from '@material/mwc-base/aria-property.js';\nimport {Ripple} from '@material/mwc-ripple/mwc-ripple.js';\nimport {RippleHandlers} from '@material/mwc-ripple/ripple-handlers.js';\nimport {html, LitElement, TemplateResult} from 'lit';\nimport {eventOptions, property, query, queryAsync, state} from 'lit/decorators.js';\nimport {ClassInfo, classMap} from 'lit/directives/class-map.js';\nimport {ifDefined} from 'lit/directives/if-defined.js';\n\n/** @soyCompatible */\nexport class ButtonBase extends LitElement {\n  static override shadowRootOptions:\n      ShadowRootInit = {mode: 'open', delegatesFocus: true};\n\n  /** @soyPrefixAttribute */\n  @ariaProperty\n  @property({type: String, attribute: 'aria-haspopup'})\n  override ariaHasPopup!: AriaHasPopup;\n\n  @property({type: Boolean, reflect: true}) raised = false;\n\n  @property({type: Boolean, reflect: true}) unelevated = false;\n\n  @property({type: Boolean, reflect: true}) outlined = false;\n\n  @property({type: Boolean}) dense = false;\n\n  @property({type: Boolean, reflect: true}) disabled = false;\n\n  @property({type: Boolean, attribute: 'trailingicon'}) trailingIcon = false;\n\n  @property({type: Boolean, reflect: true}) fullwidth = false;\n\n  @property({type: String}) icon = '';\n\n  @property({type: String}) label = '';\n\n  @property({type: Boolean}) expandContent = false;\n\n  @query('#button') buttonElement!: HTMLElement;\n\n  @queryAsync('mwc-ripple') ripple!: Promise<Ripple|null>;\n\n  @state() protected shouldRenderRipple = false;\n\n  protected rippleHandlers = new RippleHandlers(() => {\n    this.shouldRenderRipple = true;\n    return this.ripple;\n  });\n\n  /** @soyTemplate */\n  protected renderOverlay(): TemplateResult {\n    return html``;\n  }\n\n  /** @soyTemplate */\n  protected renderRipple(): TemplateResult|string {\n    const filled = this.raised || this.unelevated;\n    return this.shouldRenderRipple ?\n        html`<mwc-ripple class=\"ripple\" .primary=\"${!filled}\" .disabled=\"${\n            this.disabled}\"></mwc-ripple>` :\n        '';\n  }\n\n  override focus() {\n    const buttonElement = this.buttonElement;\n    if (buttonElement) {\n      this.rippleHandlers.startFocus();\n      buttonElement.focus();\n    }\n  }\n\n  override blur() {\n    const buttonElement = this.buttonElement;\n    if (buttonElement) {\n      this.rippleHandlers.endFocus();\n      buttonElement.blur();\n    }\n  }\n\n  /** @soyTemplate */\n  protected getRenderClasses(): ClassInfo {\n    return {\n      'mdc-button--raised': this.raised,\n      'mdc-button--unelevated': this.unelevated,\n      'mdc-button--outlined': this.outlined,\n      'mdc-button--dense': this.dense,\n    };\n  }\n\n  /**\n   * @soyTemplate\n   * @soyAttributes buttonAttributes: #button\n   * @soyClasses buttonClasses: #button\n   */\n  protected override render(): TemplateResult {\n    return html`\n      <button\n          id=\"button\"\n          class=\"mdc-button ${classMap(this.getRenderClasses())}\"\n          ?disabled=\"${this.disabled}\"\n          aria-label=\"${this.label || this.icon}\"\n          aria-haspopup=\"${ifDefined(this.ariaHasPopup)}\"\n          @focus=\"${this.handleRippleFocus}\"\n          @blur=\"${this.handleRippleBlur}\"\n          @mousedown=\"${this.handleRippleActivate}\"\n          @mouseenter=\"${this.handleRippleMouseEnter}\"\n          @mouseleave=\"${this.handleRippleMouseLeave}\"\n          @touchstart=\"${this.handleRippleActivate}\"\n          @touchend=\"${this.handleRippleDeactivate}\"\n          @touchcancel=\"${this.handleRippleDeactivate}\">\n        ${this.renderOverlay()}\n        ${this.renderRipple()}\n        <span class=\"leading-icon\">\n          <slot name=\"icon\">\n            ${this.icon && !this.trailingIcon ? this.renderIcon() : ''}\n          </slot>\n        </span>\n        <span class=\"mdc-button__label\">${this.label}</span>\n        <span class=\"slot-container ${classMap({\n      flex: this.expandContent\n    })}\">\n          <slot></slot>\n        </span>\n        <span class=\"trailing-icon\">\n          <slot name=\"trailingIcon\">\n            ${this.icon && this.trailingIcon ? this.renderIcon() : ''}\n          </slot>\n        </span>\n      </button>`;\n  }\n\n  /** @soyTemplate */\n  protected renderIcon(): TemplateResult {\n    return html`\n    <mwc-icon class=\"mdc-button__icon\">\n      ${this.icon}\n    </mwc-icon>`;\n  }\n\n  @eventOptions({passive: true})\n  protected handleRippleActivate(evt?: Event) {\n    const onUp = () => {\n      window.removeEventListener('mouseup', onUp);\n\n      this.handleRippleDeactivate();\n    };\n\n    window.addEventListener('mouseup', onUp);\n    this.rippleHandlers.startPress(evt);\n  }\n\n  protected handleRippleDeactivate() {\n    this.rippleHandlers.endPress();\n  }\n\n  protected handleRippleMouseEnter() {\n    this.rippleHandlers.startHover();\n  }\n\n  protected handleRippleMouseLeave() {\n    this.rippleHandlers.endHover();\n  }\n\n  protected handleRippleFocus() {\n    this.rippleHandlers.startFocus();\n  }\n\n  protected handleRippleBlur() {\n    this.rippleHandlers.endFocus();\n  }\n}\n","/**\n * @license\n * Copyright 2018 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\n// Style preference for leading underscores.\n// tslint:disable:strip-private-property-underscore\n\nimport {matches} from '@material/dom/ponyfill.js';\nimport {BaseElement} from '@material/mwc-base/base-element.js';\nimport {RippleInterface} from '@material/mwc-base/utils.js';\nimport {MDCRippleAdapter} from '@material/ripple/adapter.js';\nimport MDCRippleFoundation from '@material/ripple/foundation.js';\nimport {html, PropertyValues, TemplateResult} from 'lit';\nimport {property, query, state} from 'lit/decorators.js';\nimport {classMap} from 'lit/directives/class-map.js';\nimport {styleMap} from 'lit/directives/style-map.js';\n\n/** @soyCompatible */\nexport class RippleBase extends BaseElement implements RippleInterface {\n  @query('.mdc-ripple-surface') mdcRoot!: HTMLElement;\n\n  @property({type: Boolean}) primary = false;\n\n  @property({type: Boolean}) accent = false;\n\n  @property({type: Boolean}) unbounded = false;\n\n  @property({type: Boolean}) disabled = false;\n\n  @property({type: Boolean}) activated = false;\n\n  @property({type: Boolean}) selected = false;\n\n  @property({type: Boolean}) internalUseStateLayerCustomProperties = false;\n\n  @state() protected hovering = false;\n\n  @state() protected bgFocused = false;\n\n  @state() protected fgActivation = false;\n\n  @state() protected fgDeactivation = false;\n\n  @state() protected fgScale = '';\n\n  @state() protected fgSize = '';\n\n  @state() protected translateStart = '';\n\n  @state() protected translateEnd = '';\n\n  @state() protected leftPos = '';\n\n  @state() protected topPos = '';\n\n  protected mdcFoundationClass = MDCRippleFoundation;\n\n  protected mdcFoundation!: MDCRippleFoundation;\n\n  get isActive(): any {\n    return matches(this.parentElement || this, ':active');\n  }\n\n  createAdapter(): MDCRippleAdapter {\n    return {\n      browserSupportsCssVars: () => true,\n      isUnbounded: () => this.unbounded,\n      isSurfaceActive: () => this.isActive,\n      isSurfaceDisabled: () => this.disabled,\n      addClass: (className: string) => {\n        switch (className) {\n          case 'mdc-ripple-upgraded--background-focused':\n            this.bgFocused = true;\n            break;\n          case 'mdc-ripple-upgraded--foreground-activation':\n            this.fgActivation = true;\n            break;\n          case 'mdc-ripple-upgraded--foreground-deactivation':\n            this.fgDeactivation = true;\n            break;\n          default:\n            break;\n        }\n      },\n      removeClass: (className: string) => {\n        switch (className) {\n          case 'mdc-ripple-upgraded--background-focused':\n            this.bgFocused = false;\n            break;\n          case 'mdc-ripple-upgraded--foreground-activation':\n            this.fgActivation = false;\n            break;\n          case 'mdc-ripple-upgraded--foreground-deactivation':\n            this.fgDeactivation = false;\n            break;\n          default:\n            break;\n        }\n      },\n      containsEventTarget: () => true,\n      registerInteractionHandler: () => undefined,\n      deregisterInteractionHandler: () => undefined,\n      registerDocumentInteractionHandler: () => undefined,\n      deregisterDocumentInteractionHandler: () => undefined,\n      registerResizeHandler: () => undefined,\n      deregisterResizeHandler: () => undefined,\n      updateCssVariable: (varName: string, value: string) => {\n        switch (varName) {\n          case '--mdc-ripple-fg-scale':\n            this.fgScale = value;\n            break;\n          case '--mdc-ripple-fg-size':\n            this.fgSize = value;\n            break;\n          case '--mdc-ripple-fg-translate-end':\n            this.translateEnd = value;\n            break;\n          case '--mdc-ripple-fg-translate-start':\n            this.translateStart = value;\n            break;\n          case '--mdc-ripple-left':\n            this.leftPos = value;\n            break;\n          case '--mdc-ripple-top':\n            this.topPos = value;\n            break;\n          default:\n            break;\n        }\n      },\n      computeBoundingRect: () =>\n          (this.parentElement || this).getBoundingClientRect(),\n      getWindowPageOffset: () =>\n          ({x: window.pageXOffset, y: window.pageYOffset}),\n    };\n  }\n\n  startPress(ev?: Event) {\n    this.waitForFoundation(() => {\n      this.mdcFoundation.activate(ev);\n    });\n  }\n\n  endPress() {\n    this.waitForFoundation(() => {\n      this.mdcFoundation.deactivate();\n    });\n  }\n\n  startFocus() {\n    this.waitForFoundation(() => {\n      this.mdcFoundation.handleFocus();\n    });\n  }\n\n  endFocus() {\n    this.waitForFoundation(() => {\n      this.mdcFoundation.handleBlur();\n    });\n  }\n\n  startHover() {\n    this.hovering = true;\n  }\n\n  endHover() {\n    this.hovering = false;\n  }\n\n  /**\n   * Wait for the MDCFoundation to be created by `firstUpdated`\n   */\n  protected waitForFoundation(fn: () => void) {\n    if (this.mdcFoundation) {\n      fn();\n    } else {\n      this.updateComplete.then(fn);\n    }\n  }\n\n  protected override update(changedProperties: PropertyValues<this>) {\n    if (changedProperties.has('disabled')) {\n      // stop hovering when ripple is disabled to prevent a stuck \"hover\" state\n      // When re-enabled, the outer component will get a `mouseenter` event on\n      // the first movement, which will call `startHover()`\n      if (this.disabled) {\n        this.endHover();\n      }\n    }\n    super.update(changedProperties);\n  }\n\n  /** @soyTemplate */\n  protected override render(): TemplateResult {\n    const shouldActivateInPrimary =\n        this.activated && (this.primary || !this.accent);\n    const shouldSelectInPrimary =\n        this.selected && (this.primary || !this.accent);\n\n    /** @classMap */\n    const classes = {\n      'mdc-ripple-surface--accent': this.accent,\n      'mdc-ripple-surface--primary--activated': shouldActivateInPrimary,\n      'mdc-ripple-surface--accent--activated': this.accent && this.activated,\n      'mdc-ripple-surface--primary--selected': shouldSelectInPrimary,\n      'mdc-ripple-surface--accent--selected': this.accent && this.selected,\n      'mdc-ripple-surface--disabled': this.disabled,\n      'mdc-ripple-surface--hover': this.hovering,\n      'mdc-ripple-surface--primary': this.primary,\n      'mdc-ripple-surface--selected': this.selected,\n      'mdc-ripple-upgraded--background-focused': this.bgFocused,\n      'mdc-ripple-upgraded--foreground-activation': this.fgActivation,\n      'mdc-ripple-upgraded--foreground-deactivation': this.fgDeactivation,\n      'mdc-ripple-upgraded--unbounded': this.unbounded,\n      'mdc-ripple-surface--internal-use-state-layer-custom-properties':\n          this.internalUseStateLayerCustomProperties,\n    };\n    return html`\n        <div class=\"mdc-ripple-surface mdc-ripple-upgraded ${classMap(classes)}\"\n          style=\"${styleMap({\n      '--mdc-ripple-fg-scale': this.fgScale,\n      '--mdc-ripple-fg-size': this.fgSize,\n      '--mdc-ripple-fg-translate-end': this.translateEnd,\n      '--mdc-ripple-fg-translate-start': this.translateStart,\n      '--mdc-ripple-left': this.leftPos,\n      '--mdc-ripple-top': this.topPos,\n    })}\"></div>`;\n  }\n}\n","/**\n@license\nCopyright (c) 2015 The Polymer Project Authors. All rights reserved.\nThis code may only be used under the BSD style license found at\nhttp://polymer.github.io/LICENSE.txt The complete set of authors may be found at\nhttp://polymer.github.io/AUTHORS.txt The complete set of contributors may be\nfound at http://polymer.github.io/CONTRIBUTORS.txt Code distributed by Google as\npart of the polymer project is also subject to an additional IP rights grant\nfound at http://polymer.github.io/PATENTS.txt\n*/\nimport '@polymer/polymer/polymer-legacy.js';\n\nimport '@polymer/iron-flex-layout/iron-flex-layout.js';\nimport {Polymer} from '@polymer/polymer/lib/legacy/polymer-fn.js';\nimport {html} from '@polymer/polymer/lib/utils/html-tag.js';\n\n/**\napp-toolbar is a horizontal toolbar containing items that can be used for\nlabel, navigation, search and actions.\n\n### Example\n\nAdd a title to the toolbar.\n\n```html\n<app-toolbar>\n  <div main-title>App name</div>\n</app-toolbar>\n```\n\nAdd a button to the left and right side of the toolbar.\n\n```html\n<app-toolbar>\n  <paper-icon-button icon=\"menu\"></paper-icon-button>\n  <div main-title>App name</div>\n  <paper-icon-button icon=\"search\"></paper-icon-button>\n</app-toolbar>\n```\n\nYou can use the attributes `top-item` or `bottom-item` to completely fit an\nelement to the top or bottom of the toolbar respectively.\n\n### Content attributes\n\nAttribute            | Description\n---------------------|---------------------------------------------------------\n`main-title`         | The main title element.\n`condensed-title`    | The title element if used inside a condensed app-header.\n`spacer`             | Adds a left margin of `64px`.\n`bottom-item`        | Sticks the element to the bottom of the toolbar.\n`top-item`           | Sticks the element to the top of the toolbar.\n\n### Styling\n\nCustom property              | Description                  | Default\n-----------------------------|------------------------------|-----------------------\n`--app-toolbar-font-size`    | Toolbar font size            | 20px\n\n@element app-toolbar\n@demo app-toolbar/demo/index.html\n*/\nPolymer({\n  /** @override */\n  _template: html`\n    <style>\n\n      :host {\n        @apply --layout-horizontal;\n        @apply --layout-center;\n        position: relative;\n        height: 64px;\n        padding: 0 16px;\n        pointer-events: none;\n        font-size: var(--app-toolbar-font-size, 20px);\n      }\n\n      :host ::slotted(*) {\n        pointer-events: auto;\n      }\n\n      :host ::slotted(paper-icon-button) {\n        /* paper-icon-button/issues/33 */\n        font-size: 0;\n      }\n\n      :host ::slotted([main-title]),\n      :host ::slotted([condensed-title]) {\n        pointer-events: none;\n        @apply --layout-flex;\n      }\n\n      :host ::slotted([bottom-item]) {\n        position: absolute;\n        right: 0;\n        bottom: 0;\n        left: 0;\n      }\n\n      :host ::slotted([top-item]) {\n        position: absolute;\n        top: 0;\n        right: 0;\n        left: 0;\n      }\n\n      :host ::slotted([spacer]) {\n        margin-left: 64px;\n      }\n    </style>\n\n    <slot></slot>\n`,\n\n  is: 'app-toolbar'\n});\n","/**\n@license\nCopyright (c) 2015 The Polymer Project Authors. All rights reserved.\nThis code may only be used under the BSD style license found at\nhttp://polymer.github.io/LICENSE.txt The complete set of authors may be found at\nhttp://polymer.github.io/AUTHORS.txt The complete set of contributors may be\nfound at http://polymer.github.io/CONTRIBUTORS.txt Code distributed by Google as\npart of the polymer project is also subject to an additional IP rights grant\nfound at http://polymer.github.io/PATENTS.txt\n*/\nimport '@polymer/polymer/polymer-legacy.js';\nimport {html} from '@polymer/polymer/lib/utils/html-tag.js';\n\n/**\nThe `<iron-flex-layout>` component provides simple ways to use\n[CSS flexible box\nlayout](https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Flexible_boxes),\nalso known as flexbox. Note that this is an old element, that was written\nbefore all modern browsers had non-prefixed flex styles. As such, nowadays you\ndon't really need to use this element anymore, and can use CSS flex styles\ndirectly in your code.\n\nThis component provides two different ways to use flexbox:\n\n1. [Layout\nclasses](https://github.com/PolymerElements/iron-flex-layout/tree/master/iron-flex-layout-classes.html).\nThe layout class stylesheet provides a simple set of class-based flexbox rules,\nthat let you specify layout properties directly in markup. You must include this\nfile in every element that needs to use them.\n\n    Sample use:\n\n    ```\n    <custom-element-demo>\n      <template>\n        <script src=\"../webcomponentsjs/webcomponents-lite.js\"></script>\n        <next-code-block></next-code-block>\n      </template>\n    </custom-element-demo>\n    ```\n\n    ```js\n    import {html} from '@polymer/polymer/lib/utils/html-tag.js';\n    import '@polymer/iron-flex-layout/iron-flex-layout-classes.js';\n\n    const template = html`\n      <style is=\"custom-style\" include=\"iron-flex iron-flex-alignment\"></style>\n      <style>\n        .test { width: 100px; }\n      </style>\n      <div class=\"layout horizontal center-center\">\n        <div class=\"test\">horizontal layout center alignment</div>\n      </div>\n    `;\n    document.body.appendChild(template.content);\n    ```\n\n2. [Custom CSS\nmixins](https://github.com/PolymerElements/iron-flex-layout/blob/master/iron-flex-layout.html).\nThe mixin stylesheet includes custom CSS mixins that can be applied inside a CSS\nrule using the `@apply` function.\n\nPlease note that the old [/deep/ layout\nclasses](https://github.com/PolymerElements/iron-flex-layout/tree/master/classes)\nare deprecated, and should not be used. To continue using layout properties\ndirectly in markup, please switch to using the new `dom-module`-based\n[layout\nclasses](https://github.com/PolymerElements/iron-flex-layout/tree/master/iron-flex-layout-classes.html).\nPlease note that the new version does not use `/deep/`, and therefore requires\nyou to import the `dom-modules` in every element that needs to use them.\n\n@group Iron Elements\n@pseudoElement iron-flex-layout\n@demo demo/index.html\n*/\nconst template = html`\n<custom-style>\n  <style is=\"custom-style\">\n    [hidden] {\n      display: none !important;\n    }\n  </style>\n</custom-style>\n<custom-style>\n  <style is=\"custom-style\">\n    html {\n\n      --layout: {\n        display: -ms-flexbox;\n        display: -webkit-flex;\n        display: flex;\n      };\n\n      --layout-inline: {\n        display: -ms-inline-flexbox;\n        display: -webkit-inline-flex;\n        display: inline-flex;\n      };\n\n      --layout-horizontal: {\n        @apply --layout;\n\n        -ms-flex-direction: row;\n        -webkit-flex-direction: row;\n        flex-direction: row;\n      };\n\n      --layout-horizontal-reverse: {\n        @apply --layout;\n\n        -ms-flex-direction: row-reverse;\n        -webkit-flex-direction: row-reverse;\n        flex-direction: row-reverse;\n      };\n\n      --layout-vertical: {\n        @apply --layout;\n\n        -ms-flex-direction: column;\n        -webkit-flex-direction: column;\n        flex-direction: column;\n      };\n\n      --layout-vertical-reverse: {\n        @apply --layout;\n\n        -ms-flex-direction: column-reverse;\n        -webkit-flex-direction: column-reverse;\n        flex-direction: column-reverse;\n      };\n\n      --layout-wrap: {\n        -ms-flex-wrap: wrap;\n        -webkit-flex-wrap: wrap;\n        flex-wrap: wrap;\n      };\n\n      --layout-wrap-reverse: {\n        -ms-flex-wrap: wrap-reverse;\n        -webkit-flex-wrap: wrap-reverse;\n        flex-wrap: wrap-reverse;\n      };\n\n      --layout-flex-auto: {\n        -ms-flex: 1 1 auto;\n        -webkit-flex: 1 1 auto;\n        flex: 1 1 auto;\n      };\n\n      --layout-flex-none: {\n        -ms-flex: none;\n        -webkit-flex: none;\n        flex: none;\n      };\n\n      --layout-flex: {\n        -ms-flex: 1 1 0.000000001px;\n        -webkit-flex: 1;\n        flex: 1;\n        -webkit-flex-basis: 0.000000001px;\n        flex-basis: 0.000000001px;\n      };\n\n      --layout-flex-2: {\n        -ms-flex: 2;\n        -webkit-flex: 2;\n        flex: 2;\n      };\n\n      --layout-flex-3: {\n        -ms-flex: 3;\n        -webkit-flex: 3;\n        flex: 3;\n      };\n\n      --layout-flex-4: {\n        -ms-flex: 4;\n        -webkit-flex: 4;\n        flex: 4;\n      };\n\n      --layout-flex-5: {\n        -ms-flex: 5;\n        -webkit-flex: 5;\n        flex: 5;\n      };\n\n      --layout-flex-6: {\n        -ms-flex: 6;\n        -webkit-flex: 6;\n        flex: 6;\n      };\n\n      --layout-flex-7: {\n        -ms-flex: 7;\n        -webkit-flex: 7;\n        flex: 7;\n      };\n\n      --layout-flex-8: {\n        -ms-flex: 8;\n        -webkit-flex: 8;\n        flex: 8;\n      };\n\n      --layout-flex-9: {\n        -ms-flex: 9;\n        -webkit-flex: 9;\n        flex: 9;\n      };\n\n      --layout-flex-10: {\n        -ms-flex: 10;\n        -webkit-flex: 10;\n        flex: 10;\n      };\n\n      --layout-flex-11: {\n        -ms-flex: 11;\n        -webkit-flex: 11;\n        flex: 11;\n      };\n\n      --layout-flex-12: {\n        -ms-flex: 12;\n        -webkit-flex: 12;\n        flex: 12;\n      };\n\n      /* alignment in cross axis */\n\n      --layout-start: {\n        -ms-flex-align: start;\n        -webkit-align-items: flex-start;\n        align-items: flex-start;\n      };\n\n      --layout-center: {\n        -ms-flex-align: center;\n        -webkit-align-items: center;\n        align-items: center;\n      };\n\n      --layout-end: {\n        -ms-flex-align: end;\n        -webkit-align-items: flex-end;\n        align-items: flex-end;\n      };\n\n      --layout-baseline: {\n        -ms-flex-align: baseline;\n        -webkit-align-items: baseline;\n        align-items: baseline;\n      };\n\n      /* alignment in main axis */\n\n      --layout-start-justified: {\n        -ms-flex-pack: start;\n        -webkit-justify-content: flex-start;\n        justify-content: flex-start;\n      };\n\n      --layout-center-justified: {\n        -ms-flex-pack: center;\n        -webkit-justify-content: center;\n        justify-content: center;\n      };\n\n      --layout-end-justified: {\n        -ms-flex-pack: end;\n        -webkit-justify-content: flex-end;\n        justify-content: flex-end;\n      };\n\n      --layout-around-justified: {\n        -ms-flex-pack: distribute;\n        -webkit-justify-content: space-around;\n        justify-content: space-around;\n      };\n\n      --layout-justified: {\n        -ms-flex-pack: justify;\n        -webkit-justify-content: space-between;\n        justify-content: space-between;\n      };\n\n      --layout-center-center: {\n        @apply --layout-center;\n        @apply --layout-center-justified;\n      };\n\n      /* self alignment */\n\n      --layout-self-start: {\n        -ms-align-self: flex-start;\n        -webkit-align-self: flex-start;\n        align-self: flex-start;\n      };\n\n      --layout-self-center: {\n        -ms-align-self: center;\n        -webkit-align-self: center;\n        align-self: center;\n      };\n\n      --layout-self-end: {\n        -ms-align-self: flex-end;\n        -webkit-align-self: flex-end;\n        align-self: flex-end;\n      };\n\n      --layout-self-stretch: {\n        -ms-align-self: stretch;\n        -webkit-align-self: stretch;\n        align-self: stretch;\n      };\n\n      --layout-self-baseline: {\n        -ms-align-self: baseline;\n        -webkit-align-self: baseline;\n        align-self: baseline;\n      };\n\n      /* multi-line alignment in main axis */\n\n      --layout-start-aligned: {\n        -ms-flex-line-pack: start;  /* IE10 */\n        -ms-align-content: flex-start;\n        -webkit-align-content: flex-start;\n        align-content: flex-start;\n      };\n\n      --layout-end-aligned: {\n        -ms-flex-line-pack: end;  /* IE10 */\n        -ms-align-content: flex-end;\n        -webkit-align-content: flex-end;\n        align-content: flex-end;\n      };\n\n      --layout-center-aligned: {\n        -ms-flex-line-pack: center;  /* IE10 */\n        -ms-align-content: center;\n        -webkit-align-content: center;\n        align-content: center;\n      };\n\n      --layout-between-aligned: {\n        -ms-flex-line-pack: justify;  /* IE10 */\n        -ms-align-content: space-between;\n        -webkit-align-content: space-between;\n        align-content: space-between;\n      };\n\n      --layout-around-aligned: {\n        -ms-flex-line-pack: distribute;  /* IE10 */\n        -ms-align-content: space-around;\n        -webkit-align-content: space-around;\n        align-content: space-around;\n      };\n\n      /*******************************\n                Other Layout\n      *******************************/\n\n      --layout-block: {\n        display: block;\n      };\n\n      --layout-invisible: {\n        visibility: hidden !important;\n      };\n\n      --layout-relative: {\n        position: relative;\n      };\n\n      --layout-fit: {\n        position: absolute;\n        top: 0;\n        right: 0;\n        bottom: 0;\n        left: 0;\n      };\n\n      --layout-scroll: {\n        -webkit-overflow-scrolling: touch;\n        overflow: auto;\n      };\n\n      --layout-fullbleed: {\n        margin: 0;\n        height: 100vh;\n      };\n\n      /* fixed position */\n\n      --layout-fixed-top: {\n        position: fixed;\n        top: 0;\n        left: 0;\n        right: 0;\n      };\n\n      --layout-fixed-right: {\n        position: fixed;\n        top: 0;\n        right: 0;\n        bottom: 0;\n      };\n\n      --layout-fixed-bottom: {\n        position: fixed;\n        right: 0;\n        bottom: 0;\n        left: 0;\n      };\n\n      --layout-fixed-left: {\n        position: fixed;\n        top: 0;\n        bottom: 0;\n        left: 0;\n      };\n\n    }\n  </style>\n</custom-style>`;\n\ntemplate.setAttribute('style', 'display: none;');\ndocument.head.appendChild(template.content);\n\nvar style = document.createElement('style');\nstyle.textContent = '[hidden] { display: none !important; }';\ndocument.head.appendChild(style);\n","/**\n@license\nCopyright (c) 2015 The Polymer Project Authors. All rights reserved.\nThis code may only be used under the BSD style license found at\nhttp://polymer.github.io/LICENSE.txt The complete set of authors may be found at\nhttp://polymer.github.io/AUTHORS.txt The complete set of contributors may be\nfound at http://polymer.github.io/CONTRIBUTORS.txt Code distributed by Google as\npart of the polymer project is also subject to an additional IP rights grant\nfound at http://polymer.github.io/PATENTS.txt\n*/\n/*\nTypographic styles are provided matching the Material Design standard styles:\nhttp://www.google.com/design/spec/style/typography.html#typography-standard-styles\n\nNote that these are English/Latin centric styles. You may need to further adjust\nline heights and weights for CJK typesetting. See the notes in the Material\nDesign typography section.\n*/\n\nimport '@polymer/polymer/polymer-legacy.js';\nimport '@polymer/font-roboto/roboto.js';\n\nimport {html} from '@polymer/polymer/lib/utils/html-tag.js';\nconst template = html`<custom-style>\n  <style is=\"custom-style\">\n    html {\n\n      /* Shared Styles */\n      --paper-font-common-base: {\n        font-family: 'Roboto', 'Noto', sans-serif;\n        -webkit-font-smoothing: antialiased;\n      };\n\n      --paper-font-common-code: {\n        font-family: 'Roboto Mono', 'Consolas', 'Menlo', monospace;\n        -webkit-font-smoothing: antialiased;\n      };\n\n      --paper-font-common-expensive-kerning: {\n        text-rendering: optimizeLegibility;\n      };\n\n      --paper-font-common-nowrap: {\n        white-space: nowrap;\n        overflow: hidden;\n        text-overflow: ellipsis;\n      };\n\n      /* Material Font Styles */\n\n      --paper-font-display4: {\n        @apply --paper-font-common-base;\n        @apply --paper-font-common-nowrap;\n\n        font-size: 112px;\n        font-weight: 300;\n        letter-spacing: -.044em;\n        line-height: 120px;\n      };\n\n      --paper-font-display3: {\n        @apply --paper-font-common-base;\n        @apply --paper-font-common-nowrap;\n\n        font-size: 56px;\n        font-weight: 400;\n        letter-spacing: -.026em;\n        line-height: 60px;\n      };\n\n      --paper-font-display2: {\n        @apply --paper-font-common-base;\n\n        font-size: 45px;\n        font-weight: 400;\n        letter-spacing: -.018em;\n        line-height: 48px;\n      };\n\n      --paper-font-display1: {\n        @apply --paper-font-common-base;\n\n        font-size: 34px;\n        font-weight: 400;\n        letter-spacing: -.01em;\n        line-height: 40px;\n      };\n\n      --paper-font-headline: {\n        @apply --paper-font-common-base;\n\n        font-size: 24px;\n        font-weight: 400;\n        letter-spacing: -.012em;\n        line-height: 32px;\n      };\n\n      --paper-font-title: {\n        @apply --paper-font-common-base;\n        @apply --paper-font-common-nowrap;\n\n        font-size: 20px;\n        font-weight: 500;\n        line-height: 28px;\n      };\n\n      --paper-font-subhead: {\n        @apply --paper-font-common-base;\n\n        font-size: 16px;\n        font-weight: 400;\n        line-height: 24px;\n      };\n\n      --paper-font-body2: {\n        @apply --paper-font-common-base;\n\n        font-size: 14px;\n        font-weight: 500;\n        line-height: 24px;\n      };\n\n      --paper-font-body1: {\n        @apply --paper-font-common-base;\n\n        font-size: 14px;\n        font-weight: 400;\n        line-height: 20px;\n      };\n\n      --paper-font-caption: {\n        @apply --paper-font-common-base;\n        @apply --paper-font-common-nowrap;\n\n        font-size: 12px;\n        font-weight: 400;\n        letter-spacing: 0.011em;\n        line-height: 20px;\n      };\n\n      --paper-font-menu: {\n        @apply --paper-font-common-base;\n        @apply --paper-font-common-nowrap;\n\n        font-size: 13px;\n        font-weight: 500;\n        line-height: 24px;\n      };\n\n      --paper-font-button: {\n        @apply --paper-font-common-base;\n        @apply --paper-font-common-nowrap;\n\n        font-size: 14px;\n        font-weight: 500;\n        letter-spacing: 0.018em;\n        line-height: 24px;\n        text-transform: uppercase;\n      };\n\n      --paper-font-code2: {\n        @apply --paper-font-common-code;\n\n        font-size: 14px;\n        font-weight: 700;\n        line-height: 20px;\n      };\n\n      --paper-font-code1: {\n        @apply --paper-font-common-code;\n\n        font-size: 14px;\n        font-weight: 500;\n        line-height: 20px;\n      };\n\n    }\n\n  </style>\n</custom-style>`;\ntemplate.setAttribute('style', 'display: none;');\ndocument.head.appendChild(template.content);\n","/**\n@license\nCopyright (c) 2015 The Polymer Project Authors. All rights reserved.\nThis code may only be used under the BSD style license found at\nhttp://polymer.github.io/LICENSE.txt The complete set of authors may be found at\nhttp://polymer.github.io/AUTHORS.txt The complete set of contributors may be\nfound at http://polymer.github.io/CONTRIBUTORS.txt Code distributed by Google as\npart of the polymer project is also subject to an additional IP rights grant\nfound at http://polymer.github.io/PATENTS.txt\n*/\n\nimport '@polymer/polymer/polymer-legacy.js';\n\nimport {html} from '@polymer/polymer/lib/utils/html-tag.js';\nconst template = html`\n<custom-style>\n  <style is=\"custom-style\">\n    html {\n\n      --shadow-transition: {\n        transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1);\n      };\n\n      --shadow-none: {\n        box-shadow: none;\n      };\n\n      /* from http://codepen.io/shyndman/pen/c5394ddf2e8b2a5c9185904b57421cdb */\n\n      --shadow-elevation-2dp: {\n        box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14),\n                    0 1px 5px 0 rgba(0, 0, 0, 0.12),\n                    0 3px 1px -2px rgba(0, 0, 0, 0.2);\n      };\n\n      --shadow-elevation-3dp: {\n        box-shadow: 0 3px 4px 0 rgba(0, 0, 0, 0.14),\n                    0 1px 8px 0 rgba(0, 0, 0, 0.12),\n                    0 3px 3px -2px rgba(0, 0, 0, 0.4);\n      };\n\n      --shadow-elevation-4dp: {\n        box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14),\n                    0 1px 10px 0 rgba(0, 0, 0, 0.12),\n                    0 2px 4px -1px rgba(0, 0, 0, 0.4);\n      };\n\n      --shadow-elevation-6dp: {\n        box-shadow: 0 6px 10px 0 rgba(0, 0, 0, 0.14),\n                    0 1px 18px 0 rgba(0, 0, 0, 0.12),\n                    0 3px 5px -1px rgba(0, 0, 0, 0.4);\n      };\n\n      --shadow-elevation-8dp: {\n        box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14),\n                    0 3px 14px 2px rgba(0, 0, 0, 0.12),\n                    0 5px 5px -3px rgba(0, 0, 0, 0.4);\n      };\n\n      --shadow-elevation-12dp: {\n        box-shadow: 0 12px 16px 1px rgba(0, 0, 0, 0.14),\n                    0 4px 22px 3px rgba(0, 0, 0, 0.12),\n                    0 6px 7px -4px rgba(0, 0, 0, 0.4);\n      };\n\n      --shadow-elevation-16dp: {\n        box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14),\n                    0  6px 30px 5px rgba(0, 0, 0, 0.12),\n                    0  8px 10px -5px rgba(0, 0, 0, 0.4);\n      };\n\n      --shadow-elevation-24dp: {\n        box-shadow: 0 24px 38px 3px rgba(0, 0, 0, 0.14),\n                    0 9px 46px 8px rgba(0, 0, 0, 0.12),\n                    0 11px 15px -7px rgba(0, 0, 0, 0.4);\n      };\n    }\n  </style>\n</custom-style>`;\ntemplate.setAttribute('style', 'display: none;');\ndocument.head.appendChild(template.content);\n","import { html, TemplateResult } from \"lit\";\nimport { customElement, property } from \"lit/decorators\";\nimport { applyThemesOnElement } from \"../homeassistant-frontend/src/common/dom/apply_themes_on_element\";\nimport { navigate } from \"../homeassistant-frontend/src/common/navigate\";\nimport { makeDialogManager } from \"../homeassistant-frontend/src/dialogs/make-dialog-manager\";\nimport \"../homeassistant-frontend/src/resources/ha-style\";\nimport { HomeAssistant, Route } from \"../homeassistant-frontend/src/types\";\nimport { LocationChangedEvent } from \"./data/common\";\nimport { insteonElement } from \"./insteon\";\nimport \"./insteon-router\";\n\n@customElement(\"insteon-frontend\")\nclass InsteonFrontend extends insteonElement {\n  @property({ attribute: false }) public hass!: HomeAssistant;\n\n  @property({ attribute: false }) public narrow!: boolean;\n\n  @property({ attribute: false }) public route!: Route;\n\n  protected firstUpdated(changedProps) {\n    super.firstUpdated(changedProps);\n    if (!this.hass) {\n      return;\n    }\n    if (!this.insteon) {\n      this._getInsteonConfigEntry();\n    }\n    //this.insteon.language = this.hass.language;\n    this.addEventListener(\"insteon-location-changed\", (e) =>\n      this._setRoute(e as LocationChangedEvent)\n    );\n\n    makeDialogManager(this, this.shadowRoot!);\n    if (this.route.path === \"\") {\n      navigate(\"/insteon/devices\", { replace: true });\n    }\n\n    this._applyTheme();\n  }\n\n  protected render(): TemplateResult | void {\n    if (!this.hass || !this.insteon) {\n      return html``;\n    }\n\n    return html`\n      <insteon-router\n        .hass=${this.hass}\n        .insteon=${this.insteon}\n        .route=${this.route}\n        .narrow=${this.narrow}\n      ></insteon-router>\n    `;\n  }\n\n  private _setRoute(ev: LocationChangedEvent): void {\n    this.route = ev.detail!.route;\n    navigate(this.route.path, { replace: true });\n    this.requestUpdate();\n  }\n\n  private _applyTheme() {\n    let options: Partial<HomeAssistant[\"selectedTheme\"]> | undefined;\n\n    const themeName =\n      this.hass.selectedTheme?.theme ||\n      (this.hass.themes.darkMode && this.hass.themes.default_dark_theme\n        ? this.hass.themes.default_dark_theme!\n        : this.hass.themes.default_theme);\n\n    options = this.hass.selectedTheme;\n    if (themeName === \"default\" && options?.dark === undefined) {\n      options = {\n        ...this.hass.selectedTheme,\n      };\n    }\n\n    applyThemesOnElement(this.parentElement, this.hass.themes, themeName, {\n      ...options,\n      dark: this.hass.themes.darkMode,\n    });\n    this.parentElement!.style.backgroundColor = \"var(--primary-background-color)\";\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    \"insteon-frontend\": InsteonFrontend;\n  }\n}\n"],"names":[],"sourceRoot":""}

insteon_frontend/frontend_latest/manifest.json

@@ -1,3 +1,3 @@
 {
-  "entrypoint.js": "/insteon_static/frontend_latest/entrypoint-805dad43.js"
+  "entrypoint.js": "/insteon_static/frontend_latest/entrypoint-fbe0ce27.js"
 }

{insteon_frontend_home_assistant-0.3.3.dist-info → insteon_frontend_home_assistant-0.3.4.dist-info}/METADATA

@@ -1,6 +1,6 @@
 Metadata-Version: 2.1
 Name: insteon-frontend-home-assistant
-Version: 0.3.3
+Version: 0.3.4
 Summary: The Insteon frontend for Home Assistant
 Home-page: https://github.com/home-assistant/frontend
 Author: The pyinsteon development team

{insteon_frontend_home_assistant-0.3.3.dist-info → insteon_frontend_home_assistant-0.3.4.dist-info}/RECORD

@@ -1,7 +1,9 @@
 insteon_frontend/__init__.py,sha256=p8VSSPPCWIqAd-r4sfRiRN0TxuyT-nE7dY_2_OGW7ao,279
-insteon_frontend/constants.py,sha256=JbRePirXd8rOdvjOxzx4Ik-wPDUHinXKZz8-rX9VFMY,24
+insteon_frontend/constants.py,sha256=j8Mk3u8U_kIsutVTXhs2v-pEe5ZiKsiJBkt5prIjNP8,24
 insteon_frontend/entrypoint-805dad43.js,sha256=cRradJJprNyaCE3Tf3YH_K6rcHTdsrqtMjDoZpvO-j4,405
 insteon_frontend/entrypoint-805dad43.js.gz,sha256=fWlscD1Jl1PBKi6hgmdgHq6S2tkj6hz96ysG2-IA0mo,280
+insteon_frontend/entrypoint-fbe0ce27.js,sha256=5ISmRbPy8J33bTZ6da4s8l8tSl4aAAYUJsbhDdrCbRU,405
+insteon_frontend/entrypoint-fbe0ce27.js.gz,sha256=vdH66j_HsAnUZhDbt4NOqpF0bacoxdGvyoy6s2KG5P4,278
 insteon_frontend/frontend_es5/02dded1b.js,sha256=mRGgy5FI6HRkkiVH749kYOzTdtXZ40VJCs9JvdGpsWQ,11153
 insteon_frontend/frontend_es5/02dded1b.js.gz,sha256=I1_YYleQwZ_WSS80Cm7oGDoHI9I8fhm7Ysj7oHzZz9E,3409
 insteon_frontend/frontend_es5/04bf09eb.js,sha256=5HeWtt4-pusK8UQjA1_brnhAb5JDri53J8AJHD3B--0,10626
@@ -291,6 +293,9 @@ insteon_frontend/frontend_es5/ef49476d.js.gz,sha256=fWSoM_EUszTq_PfhCh6jkUE1pmWa
 insteon_frontend/frontend_es5/entrypoint-877f2520.js,sha256=Axne6yCxaC517miyzQtCUcoskq6jAbSk8TsRuikiLHk,2511533
 insteon_frontend/frontend_es5/entrypoint-877f2520.js.LICENSE.txt,sha256=-UgzeBxSpzuCgjoMQtjmgzg2YtRJJAixhTHZJExvt9A,4845
 insteon_frontend/frontend_es5/entrypoint-877f2520.js.gz,sha256=u9rgHbEjHm2ls20RyiMvG90QGp6w4wTx9dQuWcUzrxs,444844
+insteon_frontend/frontend_es5/entrypoint-acae4cac.js,sha256=CwIXEHajX77uR1i4k2GeOkM35hf6X0guFOATDiuhzdY,2513055
+insteon_frontend/frontend_es5/entrypoint-acae4cac.js.LICENSE.txt,sha256=-UgzeBxSpzuCgjoMQtjmgzg2YtRJJAixhTHZJExvt9A,4845
+insteon_frontend/frontend_es5/entrypoint-acae4cac.js.gz,sha256=EMv6ut56f4baGpPWnmMWRPbS5BGpFFU0Ucjajp66Irs,445282
 insteon_frontend/frontend_es5/f3b6bab0.js,sha256=5ufokTInnvqwfN1x6bVWRWFz_wJAQewfauUqGoHNueQ,35717
 insteon_frontend/frontend_es5/f3b6bab0.js.LICENSE.txt,sha256=M7UXSQDHTF-vamFVtlKAOaGSMARk8bKbMLR7Mss5V1U,125
 insteon_frontend/frontend_es5/f3b6bab0.js.gz,sha256=uBvgulZXMcixIIXdiywPHG9Hw2E1cdOowt-ex6yNO2k,11913
@@ -312,7 +317,7 @@ insteon_frontend/frontend_es5/f8894f3f.js,sha256=wHvp7676iqa2nthpw4HlXYO3hzCLpJR
 insteon_frontend/frontend_es5/f8894f3f.js.gz,sha256=DfpC063kPD2StjbazQTzZ8RxgWG-lRSIM7IbLDtbjWU,3552
 insteon_frontend/frontend_es5/fd27dfba.js,sha256=PlId4N2ZzxSkXKtMnVKCmS4riaIAg-fsDsRoBSHXSqY,11573
 insteon_frontend/frontend_es5/fd27dfba.js.gz,sha256=qiY-CHewYh6ZSsyzYNHIRBXD7QUOZWVCs-_C3ClxisA,3606
-insteon_frontend/frontend_es5/manifest.json,sha256=wVxie9Ee-I3o8pzAqbT81wBes1GLoCgok4OiOCAY5RA,76
+insteon_frontend/frontend_es5/manifest.json,sha256=wwr2YmzmxKTwIfQjGGkwpcFiegdcUM_l-spvYYTygKs,76
 insteon_frontend/frontend_latest/0282887a.js,sha256=pPKuHf2GmeK9tO0noxWeDgIV-4h3oxHAzQneoDJ17m0,32232
 insteon_frontend/frontend_latest/0282887a.js.gz,sha256=QkRBYuEdPUchfsV098mY4TVklY9aQ9I9kslBEYynru8,6235
 insteon_frontend/frontend_latest/0282887a.js.map,sha256=GlWP6W6HTGfLqx0_vXBZCfyXsKWrJs9YhfLm3NM2leQ,23392
@@ -661,6 +666,10 @@ insteon_frontend/frontend_latest/entrypoint-805dad43.js,sha256=mg-sqwOEZd43i5w8u
 insteon_frontend/frontend_latest/entrypoint-805dad43.js.LICENSE.txt,sha256=66Y7AKmWEFtexsTJGvcTzjTc8IJ0o8Ush3F_6j3HU_Y,5695
 insteon_frontend/frontend_latest/entrypoint-805dad43.js.gz,sha256=x-ZIG3WAmay3ZZRbW9BeVQfNbvs1TIkyXZJuRBf0Kgo,95887
 insteon_frontend/frontend_latest/entrypoint-805dad43.js.map,sha256=o-M01PcDbsY8FM9U-9Za8QMcs9UeT2w7MIyDIkW261U,85494
+insteon_frontend/frontend_latest/entrypoint-fbe0ce27.js,sha256=RVTJdDgaaJnP82RocYzssIeXwKheOWj6cNZ9PglBK_A,443461
+insteon_frontend/frontend_latest/entrypoint-fbe0ce27.js.LICENSE.txt,sha256=66Y7AKmWEFtexsTJGvcTzjTc8IJ0o8Ush3F_6j3HU_Y,5695
+insteon_frontend/frontend_latest/entrypoint-fbe0ce27.js.gz,sha256=H2kAzmgygzgEjZZ-Z30SZ-hShQMx6DEtcMT-3bVGglY,96192
+insteon_frontend/frontend_latest/entrypoint-fbe0ce27.js.map,sha256=y6S4aOT1xBl5upKG1G3qq5fWPaOOZOjPtCFpROvCZ4w,85494
 insteon_frontend/frontend_latest/f3d474c3.js,sha256=8Ia8j067uquhn2IhQiZMakjJJXJXMXsMsts5T3nFK_g,215
 insteon_frontend/frontend_latest/f3d474c3.js.gz,sha256=8V-Pr-ph29GKIXVPcoaH8f3OkMlHP6llZbFvy_Lvglo,177
 insteon_frontend/frontend_latest/f645ea33.js,sha256=UuU7krhF6vsNOiTOnFCYcWlbq8u1XP0ocIc1ihAQfKM,67309
@@ -674,10 +683,10 @@ insteon_frontend/frontend_latest/fcc81ea9.js.map,sha256=ANeBP6NwCvBZsYMOOGcVYN5k
 insteon_frontend/frontend_latest/fea404af.js,sha256=Tdg4DJ2WcMztKBRLW6hH_sECcCjXgIhDI8njPyT5Hjg,19338
 insteon_frontend/frontend_latest/fea404af.js.gz,sha256=jp5NCB27SAxLmnYXoCcB_IlrgtAo-DJR9fvfwZ5ApO8,3517
 insteon_frontend/frontend_latest/fea404af.js.map,sha256=2K6LrS_i6BYm240AolrgG5XLkSMy2VDDwzwYgj_Fc34,4999
-insteon_frontend/frontend_latest/manifest.json,sha256=-xZOW8EfbDBfYjIPPsclThg13JwfRMEb2Woz6JkHL7E,79
+insteon_frontend/frontend_latest/manifest.json,sha256=4uztItP1WfvkxbcucV0H0cbLxGPL4CNXQQNp5Af39zs,79
 insteon_frontend_git/constants.py,sha256=NCqqqASMTc269wh6o7MGRP80FvvlBn0_3te9s8Q7yjM,19
-insteon_frontend_home_assistant-0.3.3.dist-info/LICENSE,sha256=yUdH8rCZ6GH9NxoFu_RDzEZrLO5MZEjLA6Vs_T8yRKs,1070
-insteon_frontend_home_assistant-0.3.3.dist-info/METADATA,sha256=7MPWgzJEBmQ_uSptYp8RZULMYIDgWErOw1Oyg8q8w0E,573
-insteon_frontend_home_assistant-0.3.3.dist-info/WHEEL,sha256=G16H4A3IeoQmnOrYV4ueZGKSjhipXx8zc8nu9FGlvMA,92
-insteon_frontend_home_assistant-0.3.3.dist-info/top_level.txt,sha256=neJcLnPRNoI2L6k0GLmOPRxCwGUzmmBiiRjKxFnnU80,38
-insteon_frontend_home_assistant-0.3.3.dist-info/RECORD,,
+insteon_frontend_home_assistant-0.3.4.dist-info/LICENSE,sha256=yUdH8rCZ6GH9NxoFu_RDzEZrLO5MZEjLA6Vs_T8yRKs,1070
+insteon_frontend_home_assistant-0.3.4.dist-info/METADATA,sha256=9-5ua7__3lbo1_R05VsAD7Mw9L-SsI1djiaXZy7QTKE,573
+insteon_frontend_home_assistant-0.3.4.dist-info/WHEEL,sha256=G16H4A3IeoQmnOrYV4ueZGKSjhipXx8zc8nu9FGlvMA,92
+insteon_frontend_home_assistant-0.3.4.dist-info/top_level.txt,sha256=neJcLnPRNoI2L6k0GLmOPRxCwGUzmmBiiRjKxFnnU80,38
+insteon_frontend_home_assistant-0.3.4.dist-info/RECORD,,