/*! For license information please see 799e89c754967444d303.chunk.js.LICENSE */
(window.webpackJsonp=window.webpackJsonp||[]).push([[88,95],{101:function(e,t,a){"use strict";a.d(t,"a",function(){return i});a(2);const i={properties:{value:{type:Number,value:0,notify:!0,reflectToAttribute:!0},min:{type:Number,value:0,notify:!0},max:{type:Number,value:100,notify:!0},step:{type:Number,value:1,notify:!0},ratio:{type:Number,value:0,readOnly:!0,notify:!0}},observers:["_update(value, min, max, step)"],_calcRatio:function(e){return(this._clampValue(e)-this.min)/(this.max-this.min)},_clampValue:function(e){return Math.min(this.max,Math.max(this.min,this._calcStep(e)))},_calcStep:function(e){if(e=parseFloat(e),!this.step)return e;var t=Math.round((e-this.min)/this.step);return this.step<1?t/(1/this.step)+this.min:t*this.step+this.min},_validateValue:function(){var e=this._clampValue(this.value);return this.value=this.oldValue=isNaN(e)?this.oldValue:e,this.value!==e},_update:function(){this._validateValue(),this._setRatio(100*this._calcRatio(this.value))}}},111:function(e,t,a){"use strict";a.d(t,"a",function(){return s});a(2);var i=a(50),r=a(32);const s=[i.a,r.a,{hostAttributes:{role:"option",tabindex:"0"}}]},114:function(e,t,a){"use strict";a(2);var i=a(57),r=a(58);const s={properties:{checked:{type:Boolean,value:!1,reflectToAttribute:!0,notify:!0,observer:"_checkedChanged"},toggles:{type:Boolean,value:!0,reflectToAttribute:!0},value:{type:String,value:"on",observer:"_valueChanged"}},observers:["_requiredChanged(required)"],created:function(){this._hasIronCheckedElementBehavior=!0},_getValidity:function(e){return this.disabled||!this.required||this.checked},_requiredChanged:function(){this.required?this.setAttribute("aria-required","true"):this.removeAttribute("aria-required")},_checkedChanged:function(){this.active=this.checked,this.fire("iron-change")},_valueChanged:function(){void 0!==this.value&&null!==this.value||(this.value="on")}},n=[i.a,r.a,s];var o=a(55),l=a(62);a.d(t,"a",function(){return d});const c={_checkedChanged:function(){s._checkedChanged.call(this),this.hasRipple()&&(this.checked?this._ripple.setAttribute("checked",""):this._ripple.removeAttribute("checked"))},_buttonStateChanged:function(){l.a._buttonStateChanged.call(this),this.disabled||this.isAttached&&(this.checked=this.active)}},d=[o.a,n,c]},130:function(e,t,a){"use strict";a(2),a(40),a(131);var i=a(4),r=a(3),s=a(111);Object(i.a)({_template:r.a`
    <style include="paper-item-shared-styles">
      :host {
        @apply --layout-horizontal;
        @apply --layout-center;
        @apply --paper-font-subhead;

        @apply --paper-item;
      }
    </style>
    <slot></slot>
`,is:"paper-item",behaviors:[s.a]})},131:function(e,t,a){"use strict";a(40),a(54),a(41),a(49);const i=document.createElement("template");i.setAttribute("style","display: none;"),i.innerHTML="<dom-module id=\"paper-item-shared-styles\">\n  <template>\n    <style>\n      :host, .paper-item {\n        display: block;\n        position: relative;\n        min-height: var(--paper-item-min-height, 48px);\n        padding: 0px 16px;\n      }\n\n      .paper-item {\n        @apply --paper-font-subhead;\n        border:none;\n        outline: none;\n        background: white;\n        width: 100%;\n        text-align: left;\n      }\n\n      :host([hidden]), .paper-item[hidden] {\n        display: none !important;\n      }\n\n      :host(.iron-selected), .paper-item.iron-selected {\n        font-weight: var(--paper-item-selected-weight, bold);\n\n        @apply --paper-item-selected;\n      }\n\n      :host([disabled]), .paper-item[disabled] {\n        color: var(--paper-item-disabled-color, var(--disabled-text-color));\n\n        @apply --paper-item-disabled;\n      }\n\n      :host(:focus), .paper-item:focus {\n        position: relative;\n        outline: 0;\n\n        @apply --paper-item-focused;\n      }\n\n      :host(:focus):before, .paper-item:focus:before {\n        @apply --layout-fit;\n\n        background: currentColor;\n        content: '';\n        opacity: var(--dark-divider-opacity);\n        pointer-events: none;\n\n        @apply --paper-item-focused-before;\n      }\n    </style>\n  </template>\n</dom-module>",document.head.appendChild(i.content)},133:function(e,t,a){"use strict";a(2),a(30),a(99),a(83),a(137),a(102),a(41),a(135),a(136);var i=a(50),r=a(32),s=a(57),n=a(58),o=a(4),l=a(0),c=a(33),d=a(3);Object(o.a)({_template:d.a`
    <style include="paper-dropdown-menu-shared-styles"></style>

    <!-- this div fulfills an a11y requirement for combobox, do not remove -->
    <span role="button"></span>
    <paper-menu-button id="menuButton" vertical-align="[[verticalAlign]]" horizontal-align="[[horizontalAlign]]" dynamic-align="[[dynamicAlign]]" vertical-offset="[[_computeMenuVerticalOffset(noLabelFloat, verticalOffset)]]" disabled="[[disabled]]" no-animations="[[noAnimations]]" on-iron-select="_onIronSelect" on-iron-deselect="_onIronDeselect" opened="{{opened}}" close-on-activate allow-outside-scroll="[[allowOutsideScroll]]" restore-focus-on-close="[[restoreFocusOnClose]]">
      <!-- support hybrid mode: user might be using paper-menu-button 1.x which distributes via <content> -->
      <div class="dropdown-trigger" slot="dropdown-trigger">
        <paper-ripple></paper-ripple>
        <!-- paper-input has type="text" for a11y, do not remove -->
        <paper-input type="text" invalid="[[invalid]]" readonly disabled="[[disabled]]" value="[[value]]" placeholder="[[placeholder]]" error-message="[[errorMessage]]" always-float-label="[[alwaysFloatLabel]]" no-label-float="[[noLabelFloat]]" label="[[label]]">
          <!-- support hybrid mode: user might be using paper-input 1.x which distributes via <content> -->
          <iron-icon icon="paper-dropdown-menu:arrow-drop-down" suffix slot="suffix"></iron-icon>
        </paper-input>
      </div>
      <slot id="content" name="dropdown-content" slot="dropdown-content"></slot>
    </paper-menu-button>
`,is:"paper-dropdown-menu",behaviors:[i.a,r.a,s.a,n.a],properties:{selectedItemLabel:{type:String,notify:!0,readOnly:!0},selectedItem:{type:Object,notify:!0,readOnly:!0},value:{type:String,notify:!0},label:{type:String},placeholder:{type:String},errorMessage:{type:String},opened:{type:Boolean,notify:!0,value:!1,observer:"_openedChanged"},allowOutsideScroll:{type:Boolean,value:!1},noLabelFloat:{type:Boolean,value:!1,reflectToAttribute:!0},alwaysFloatLabel:{type:Boolean,value:!1},noAnimations:{type:Boolean,value:!1},horizontalAlign:{type:String,value:"right"},verticalAlign:{type:String,value:"top"},verticalOffset:Number,dynamicAlign:{type:Boolean},restoreFocusOnClose:{type:Boolean,value:!0}},listeners:{tap:"_onTap"},keyBindings:{"up down":"open",esc:"close"},hostAttributes:{role:"combobox","aria-autocomplete":"none","aria-haspopup":"true"},observers:["_selectedItemChanged(selectedItem)"],attached:function(){var e=this.contentElement;e&&e.selectedItem&&this._setSelectedItem(e.selectedItem)},get contentElement(){for(var e=Object(l.b)(this.$.content).getDistributedNodes(),t=0,a=e.length;t<a;t++)if(e[t].nodeType===Node.ELEMENT_NODE)return e[t]},open:function(){this.$.menuButton.open()},close:function(){this.$.menuButton.close()},_onIronSelect:function(e){this._setSelectedItem(e.detail.item)},_onIronDeselect:function(e){this._setSelectedItem(null)},_onTap:function(e){c.c(e)===this&&this.open()},_selectedItemChanged:function(e){var t="";t=e?e.label||e.getAttribute("label")||e.textContent.trim():"",this.value=t,this._setSelectedItemLabel(t)},_computeMenuVerticalOffset:function(e,t){return t||(e?-4:8)},_getValidity:function(e){return this.disabled||!this.required||this.required&&!!this.value},_openedChanged:function(){var e=this.opened?"true":"false",t=this.contentElement;t&&t.setAttribute("aria-expanded",e)}})},135:function(e,t,a){"use strict";a(76);const i=document.createElement("template");i.setAttribute("style","display: none;"),i.innerHTML='<iron-iconset-svg name="paper-dropdown-menu" size="24">\n<svg><defs>\n<g id="arrow-drop-down"><path d="M7 10l5 5 5-5z"></path></g>\n</defs></svg>\n</iron-iconset-svg>',document.head.appendChild(i.content)},136:function(e,t,a){"use strict";a(41);const i=document.createElement("template");i.setAttribute("style","display: none;"),i.innerHTML='<dom-module id="paper-dropdown-menu-shared-styles">\n  <template>\n    <style>\n      :host {\n        display: inline-block;\n        position: relative;\n        text-align: left;\n\n        /* NOTE(cdata): Both values are needed, since some phones require the\n         * value to be `transparent`.\n         */\n        -webkit-tap-highlight-color: rgba(0,0,0,0);\n        -webkit-tap-highlight-color: transparent;\n\n        --paper-input-container-input: {\n          overflow: hidden;\n          white-space: nowrap;\n          text-overflow: ellipsis;\n          max-width: 100%;\n          box-sizing: border-box;\n          cursor: pointer;\n        };\n\n        @apply --paper-dropdown-menu;\n      }\n\n      :host([disabled]) {\n        @apply --paper-dropdown-menu-disabled;\n      }\n\n      :host([noink]) paper-ripple {\n        display: none;\n      }\n\n      :host([no-label-float]) paper-ripple {\n        top: 8px;\n      }\n\n      paper-ripple {\n        top: 12px;\n        left: 0px;\n        bottom: 8px;\n        right: 0px;\n\n        @apply --paper-dropdown-menu-ripple;\n      }\n\n      paper-menu-button {\n        display: block;\n        padding: 0;\n\n        @apply --paper-dropdown-menu-button;\n      }\n\n      paper-input {\n        @apply --paper-dropdown-menu-input;\n      }\n\n      iron-icon {\n        color: var(--disabled-text-color);\n\n        @apply --paper-dropdown-menu-icon;\n      }\n    </style>\n  </template>\n</dom-module>',document.head.appendChild(i.content)},143:function(e,t,a){"use strict";a(2),a(40),a(54);var i=a(101),r=a(4),s=a(3);Object(r.a)({_template:s.a`
    <style>
      :host {
        display: block;
        width: 200px;
        position: relative;
        overflow: hidden;
      }

      :host([hidden]), [hidden] {
        display: none !important;
      }

      #progressContainer {
        @apply --paper-progress-container;
        position: relative;
      }

      #progressContainer,
      /* the stripe for the indeterminate animation*/
      .indeterminate::after {
        height: var(--paper-progress-height, 4px);
      }

      #primaryProgress,
      #secondaryProgress,
      .indeterminate::after {
        @apply --layout-fit;
      }

      #progressContainer,
      .indeterminate::after {
        background: var(--paper-progress-container-color, var(--google-grey-300));
      }

      :host(.transiting) #primaryProgress,
      :host(.transiting) #secondaryProgress {
        -webkit-transition-property: -webkit-transform;
        transition-property: transform;

        /* Duration */
        -webkit-transition-duration: var(--paper-progress-transition-duration, 0.08s);
        transition-duration: var(--paper-progress-transition-duration, 0.08s);

        /* Timing function */
        -webkit-transition-timing-function: var(--paper-progress-transition-timing-function, ease);
        transition-timing-function: var(--paper-progress-transition-timing-function, ease);

        /* Delay */
        -webkit-transition-delay: var(--paper-progress-transition-delay, 0s);
        transition-delay: var(--paper-progress-transition-delay, 0s);
      }

      #primaryProgress,
      #secondaryProgress {
        @apply --layout-fit;
        -webkit-transform-origin: left center;
        transform-origin: left center;
        -webkit-transform: scaleX(0);
        transform: scaleX(0);
        will-change: transform;
      }

      #primaryProgress {
        background: var(--paper-progress-active-color, var(--google-green-500));
      }

      #secondaryProgress {
        background: var(--paper-progress-secondary-color, var(--google-green-100));
      }

      :host([disabled]) #primaryProgress {
        background: var(--paper-progress-disabled-active-color, var(--google-grey-500));
      }

      :host([disabled]) #secondaryProgress {
        background: var(--paper-progress-disabled-secondary-color, var(--google-grey-300));
      }

      :host(:not([disabled])) #primaryProgress.indeterminate {
        -webkit-transform-origin: right center;
        transform-origin: right center;
        -webkit-animation: indeterminate-bar var(--paper-progress-indeterminate-cycle-duration, 2s) linear infinite;
        animation: indeterminate-bar var(--paper-progress-indeterminate-cycle-duration, 2s) linear infinite;
      }

      :host(:not([disabled])) #primaryProgress.indeterminate::after {
        content: "";
        -webkit-transform-origin: center center;
        transform-origin: center center;

        -webkit-animation: indeterminate-splitter var(--paper-progress-indeterminate-cycle-duration, 2s) linear infinite;
        animation: indeterminate-splitter var(--paper-progress-indeterminate-cycle-duration, 2s) linear infinite;
      }

      @-webkit-keyframes indeterminate-bar {
        0% {
          -webkit-transform: scaleX(1) translateX(-100%);
        }
        50% {
          -webkit-transform: scaleX(1) translateX(0%);
        }
        75% {
          -webkit-transform: scaleX(1) translateX(0%);
          -webkit-animation-timing-function: cubic-bezier(.28,.62,.37,.91);
        }
        100% {
          -webkit-transform: scaleX(0) translateX(0%);
        }
      }

      @-webkit-keyframes indeterminate-splitter {
        0% {
          -webkit-transform: scaleX(.75) translateX(-125%);
        }
        30% {
          -webkit-transform: scaleX(.75) translateX(-125%);
          -webkit-animation-timing-function: cubic-bezier(.42,0,.6,.8);
        }
        90% {
          -webkit-transform: scaleX(.75) translateX(125%);
        }
        100% {
          -webkit-transform: scaleX(.75) translateX(125%);
        }
      }

      @keyframes indeterminate-bar {
        0% {
          transform: scaleX(1) translateX(-100%);
        }
        50% {
          transform: scaleX(1) translateX(0%);
        }
        75% {
          transform: scaleX(1) translateX(0%);
          animation-timing-function: cubic-bezier(.28,.62,.37,.91);
        }
        100% {
          transform: scaleX(0) translateX(0%);
        }
      }

      @keyframes indeterminate-splitter {
        0% {
          transform: scaleX(.75) translateX(-125%);
        }
        30% {
          transform: scaleX(.75) translateX(-125%);
          animation-timing-function: cubic-bezier(.42,0,.6,.8);
        }
        90% {
          transform: scaleX(.75) translateX(125%);
        }
        100% {
          transform: scaleX(.75) translateX(125%);
        }
      }
    </style>

    <div id="progressContainer">
      <div id="secondaryProgress" hidden\$="[[_hideSecondaryProgress(secondaryRatio)]]"></div>
      <div id="primaryProgress"></div>
    </div>
`,is:"paper-progress",behaviors:[i.a],properties:{secondaryProgress:{type:Number,value:0},secondaryRatio:{type:Number,value:0,readOnly:!0},indeterminate:{type:Boolean,value:!1,observer:"_toggleIndeterminate"},disabled:{type:Boolean,value:!1,reflectToAttribute:!0,observer:"_disabledChanged"}},observers:["_progressChanged(secondaryProgress, value, min, max, indeterminate)"],hostAttributes:{role:"progressbar"},_toggleIndeterminate:function(e){this.toggleClass("indeterminate",e,this.$.primaryProgress)},_transformProgress:function(e,t){var a="scaleX("+t/100+")";e.style.transform=e.style.webkitTransform=a},_mainRatioChanged:function(e){this._transformProgress(this.$.primaryProgress,e)},_progressChanged:function(e,t,a,i,r){e=this._clampValue(e),t=this._clampValue(t);var s=100*this._calcRatio(e),n=100*this._calcRatio(t);this._setSecondaryRatio(s),this._transformProgress(this.$.secondaryProgress,s),this._transformProgress(this.$.primaryProgress,n),this.secondaryProgress=e,r?this.removeAttribute("aria-valuenow"):this.setAttribute("aria-valuenow",t),this.setAttribute("aria-valuemin",a),this.setAttribute("aria-valuemax",i)},_disabledChanged:function(e){this.setAttribute("aria-disabled",e?"true":"false")},_hideSecondaryProgress:function(e){return 0===e}})},144:function(e,t,a){"use strict";a(40),a(83),a(143),a(54);var i=a(30),r=a(57),s=a(101),n=a(55),o=a(4),l=a(33);const c=a(2).c`
  <style>
    :host {
      @apply --layout;
      @apply --layout-justified;
      @apply --layout-center;
      width: 200px;
      cursor: default;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
      -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
      --paper-progress-active-color: var(--paper-slider-active-color, var(--google-blue-700));
      --paper-progress-secondary-color: var(--paper-slider-secondary-color, var(--google-blue-300));
      --paper-progress-disabled-active-color: var(--paper-slider-disabled-active-color, var(--paper-grey-400));
      --paper-progress-disabled-secondary-color: var(--paper-slider-disabled-secondary-color, var(--paper-grey-400));
      --calculated-paper-slider-height: var(--paper-slider-height, 2px);
    }

    /* focus shows the ripple */
    :host(:focus) {
      outline: none;
    }

    /**
      * NOTE(keanulee): Though :host-context is not universally supported, some pages
      * still rely on paper-slider being flipped when dir="rtl" is set on body. For full
      * compatibility, dir="rtl" must be explicitly set on paper-slider.
      */
    :dir(rtl) #sliderContainer {
      -webkit-transform: scaleX(-1);
      transform: scaleX(-1);
    }

    /**
      * NOTE(keanulee): This is separate from the rule above because :host-context may
      * not be recognized.
      */
    :host([dir="rtl"]) #sliderContainer {
      -webkit-transform: scaleX(-1);
      transform: scaleX(-1);
    }

    /**
      * NOTE(keanulee): Needed to override the :host-context rule (where supported)
      * to support LTR sliders in RTL pages.
      */
    :host([dir="ltr"]) #sliderContainer {
      -webkit-transform: scaleX(1);
      transform: scaleX(1);
    }

    #sliderContainer {
      position: relative;
      width: 100%;
      height: calc(30px + var(--calculated-paper-slider-height));
      margin-left: calc(15px + var(--calculated-paper-slider-height)/2);
      margin-right: calc(15px + var(--calculated-paper-slider-height)/2);
    }

    #sliderContainer:focus {
      outline: 0;
    }

    #sliderContainer.editable {
      margin-top: 12px;
      margin-bottom: 12px;
    }

    .bar-container {
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      overflow: hidden;
    }

    .ring > .bar-container {
      left: calc(5px + var(--calculated-paper-slider-height)/2);
      transition: left 0.18s ease;
    }

    .ring.expand.dragging > .bar-container {
      transition: none;
    }

    .ring.expand:not(.pin) > .bar-container {
      left: calc(8px + var(--calculated-paper-slider-height)/2);
    }

    #sliderBar {
      padding: 15px 0;
      width: 100%;
      background-color: var(--paper-slider-bar-color, transparent);
      --paper-progress-container-color: var(--paper-slider-container-color, var(--paper-grey-400));
      --paper-progress-height: var(--calculated-paper-slider-height);
    }

    .slider-markers {
      position: absolute;
      /* slider-knob is 30px + the slider-height so that the markers should start at a offset of 15px*/
      top: 15px;
      height: var(--calculated-paper-slider-height);
      left: 0;
      right: -1px;
      box-sizing: border-box;
      pointer-events: none;
      @apply --layout-horizontal;
    }

    .slider-marker {
      @apply --layout-flex;
    }
    .slider-markers::after,
    .slider-marker::after {
      content: "";
      display: block;
      margin-left: -1px;
      width: 2px;
      height: var(--calculated-paper-slider-height);
      border-radius: 50%;
      background-color: var(--paper-slider-markers-color, #000);
    }

    .slider-knob {
      position: absolute;
      left: 0;
      top: 0;
      margin-left: calc(-15px - var(--calculated-paper-slider-height)/2);
      width: calc(30px + var(--calculated-paper-slider-height));
      height: calc(30px + var(--calculated-paper-slider-height));
    }

    .transiting > .slider-knob {
      transition: left 0.08s ease;
    }

    .slider-knob:focus {
      outline: none;
    }

    .slider-knob.dragging {
      transition: none;
    }

    .snaps > .slider-knob.dragging {
      transition: -webkit-transform 0.08s ease;
      transition: transform 0.08s ease;
    }

    .slider-knob-inner {
      margin: 10px;
      width: calc(100% - 20px);
      height: calc(100% - 20px);
      background-color: var(--paper-slider-knob-color, var(--google-blue-700));
      border: 2px solid var(--paper-slider-knob-color, var(--google-blue-700));
      border-radius: 50%;

      -moz-box-sizing: border-box;
      box-sizing: border-box;

      transition-property: -webkit-transform, background-color, border;
      transition-property: transform, background-color, border;
      transition-duration: 0.18s;
      transition-timing-function: ease;
    }

    .expand:not(.pin) > .slider-knob > .slider-knob-inner {
      -webkit-transform: scale(1.5);
      transform: scale(1.5);
    }

    .ring > .slider-knob > .slider-knob-inner {
      background-color: var(--paper-slider-knob-start-color, transparent);
      border: 2px solid var(--paper-slider-knob-start-border-color, var(--paper-grey-400));
    }

    .slider-knob-inner::before {
      background-color: var(--paper-slider-pin-color, var(--google-blue-700));
    }

    .pin > .slider-knob > .slider-knob-inner::before {
      content: "";
      position: absolute;
      top: 0;
      left: 50%;
      margin-left: -13px;
      width: 26px;
      height: 26px;
      border-radius: 50% 50% 50% 0;

      -webkit-transform: rotate(-45deg) scale(0) translate(0);
      transform: rotate(-45deg) scale(0) translate(0);
    }

    .slider-knob-inner::before,
    .slider-knob-inner::after {
      transition: -webkit-transform .18s ease, background-color .18s ease;
      transition: transform .18s ease, background-color .18s ease;
    }

    .pin.ring > .slider-knob > .slider-knob-inner::before {
      background-color: var(--paper-slider-pin-start-color, var(--paper-grey-400));
    }

    .pin.expand > .slider-knob > .slider-knob-inner::before {
      -webkit-transform: rotate(-45deg) scale(1) translate(17px, -17px);
      transform: rotate(-45deg) scale(1) translate(17px, -17px);
    }

    .pin > .slider-knob > .slider-knob-inner::after {
      content: attr(value);
      position: absolute;
      top: 0;
      left: 50%;
      margin-left: -16px;
      width: 32px;
      height: 26px;
      text-align: center;
      color: var(--paper-slider-font-color, #fff);
      font-size: 10px;

      -webkit-transform: scale(0) translate(0);
      transform: scale(0) translate(0);
    }

    .pin.expand > .slider-knob > .slider-knob-inner::after {
      -webkit-transform: scale(1) translate(0, -17px);
      transform: scale(1) translate(0, -17px);
    }

    /* paper-input */
    .slider-input {
      width: 50px;
      overflow: hidden;
      --paper-input-container-input: {
        text-align: center;
        @apply --paper-slider-input-container-input;
      };
      @apply --paper-slider-input;
    }

    /* disabled state */
    #sliderContainer.disabled {
      pointer-events: none;
    }

    .disabled > .slider-knob > .slider-knob-inner {
      background-color: var(--paper-slider-disabled-knob-color, var(--paper-grey-400));
      border: 2px solid var(--paper-slider-disabled-knob-color, var(--paper-grey-400));
      -webkit-transform: scale3d(0.75, 0.75, 1);
      transform: scale3d(0.75, 0.75, 1);
    }

    .disabled.ring > .slider-knob > .slider-knob-inner {
      background-color: var(--paper-slider-knob-start-color, transparent);
      border: 2px solid var(--paper-slider-knob-start-border-color, var(--paper-grey-400));
    }

    paper-ripple {
      color: var(--paper-slider-knob-color, var(--google-blue-700));
    }
  </style>

  <div id="sliderContainer" class\$="[[_getClassNames(disabled, pin, snaps, immediateValue, min, expand, dragging, transiting, editable)]]">
    <div class="bar-container">
      <paper-progress disabled\$="[[disabled]]" id="sliderBar" aria-hidden="true" min="[[min]]" max="[[max]]" step="[[step]]" value="[[immediateValue]]" secondary-progress="[[secondaryProgress]]" on-down="_bardown" on-up="_resetKnob" on-track="_bartrack" on-tap="_barclick">
      </paper-progress>
    </div>

    <template is="dom-if" if="[[snaps]]">
      <div class="slider-markers">
        <template is="dom-repeat" items="[[markers]]">
          <div class="slider-marker"></div>
        </template>
      </div>
    </template>

    <div id="sliderKnob" class="slider-knob" on-down="_knobdown" on-up="_resetKnob" on-track="_onTrack" on-transitionend="_knobTransitionEnd">
        <div class="slider-knob-inner" value\$="[[immediateValue]]"></div>
    </div>
  </div>

  <template is="dom-if" if="[[editable]]">
    <paper-input id="input" type="number" step="[[step]]" min="[[min]]" max="[[max]]" class="slider-input" disabled\$="[[disabled]]" value="[[immediateValue]]" on-change="_changeValue" on-keydown="_inputKeyDown" no-label-float>
    </paper-input>
  </template>
`;c.setAttribute("strip-whitespace",""),Object(o.a)({_template:c,is:"paper-slider",behaviors:[i.a,r.a,n.a,s.a],properties:{value:{type:Number,value:0},snaps:{type:Boolean,value:!1,notify:!0},pin:{type:Boolean,value:!1,notify:!0},secondaryProgress:{type:Number,value:0,notify:!0,observer:"_secondaryProgressChanged"},editable:{type:Boolean,value:!1},immediateValue:{type:Number,value:0,readOnly:!0,notify:!0},maxMarkers:{type:Number,value:0,notify:!0},expand:{type:Boolean,value:!1,readOnly:!0},ignoreBarTouch:{type:Boolean,value:!1},dragging:{type:Boolean,value:!1,readOnly:!0,notify:!0},transiting:{type:Boolean,value:!1,readOnly:!0},markers:{type:Array,readOnly:!0,value:function(){return[]}}},observers:["_updateKnob(value, min, max, snaps, step)","_valueChanged(value)","_immediateValueChanged(immediateValue)","_updateMarkers(maxMarkers, min, max, snaps)"],hostAttributes:{role:"slider",tabindex:0},keyBindings:{left:"_leftKey",right:"_rightKey","down pagedown home":"_decrementKey","up pageup end":"_incrementKey"},ready:function(){this.ignoreBarTouch&&Object(l.f)(this.$.sliderBar,"auto")},increment:function(){this.value=this._clampValue(this.value+this.step)},decrement:function(){this.value=this._clampValue(this.value-this.step)},_updateKnob:function(e,t,a,i,r){this.setAttribute("aria-valuemin",t),this.setAttribute("aria-valuemax",a),this.setAttribute("aria-valuenow",e),this._positionKnob(100*this._calcRatio(e))},_valueChanged:function(){this.fire("value-change",{composed:!0})},_immediateValueChanged:function(){this.dragging?this.fire("immediate-value-change",{composed:!0}):this.value=this.immediateValue},_secondaryProgressChanged:function(){this.secondaryProgress=this._clampValue(this.secondaryProgress)},_expandKnob:function(){this._setExpand(!0)},_resetKnob:function(){this.cancelDebouncer("expandKnob"),this._setExpand(!1)},_positionKnob:function(e){this._setImmediateValue(this._calcStep(this._calcKnobPosition(e))),this._setRatio(100*this._calcRatio(this.immediateValue)),this.$.sliderKnob.style.left=this.ratio+"%",this.dragging&&(this._knobstartx=this.ratio*this._w/100,this.translate3d(0,0,0,this.$.sliderKnob))},_calcKnobPosition:function(e){return(this.max-this.min)*e/100+this.min},_onTrack:function(e){switch(e.stopPropagation(),e.detail.state){case"start":this._trackStart(e);break;case"track":this._trackX(e);break;case"end":this._trackEnd()}},_trackStart:function(e){this._setTransiting(!1),this._w=this.$.sliderBar.offsetWidth,this._x=this.ratio*this._w/100,this._startx=this._x,this._knobstartx=this._startx,this._minx=-this._startx,this._maxx=this._w-this._startx,this.$.sliderKnob.classList.add("dragging"),this._setDragging(!0)},_trackX:function(e){this.dragging||this._trackStart(e);var t=this._isRTL?-1:1,a=Math.min(this._maxx,Math.max(this._minx,e.detail.dx*t));this._x=this._startx+a;var i=this._calcStep(this._calcKnobPosition(this._x/this._w*100));this._setImmediateValue(i);var r=this._calcRatio(this.immediateValue)*this._w-this._knobstartx;this.translate3d(r+"px",0,0,this.$.sliderKnob)},_trackEnd:function(){var e=this.$.sliderKnob.style;this.$.sliderKnob.classList.remove("dragging"),this._setDragging(!1),this._resetKnob(),this.value=this.immediateValue,e.transform=e.webkitTransform="",this.fire("change",{composed:!0})},_knobdown:function(e){this._expandKnob(),e.preventDefault(),this.focus()},_bartrack:function(e){this._allowBarEvent(e)&&this._onTrack(e)},_barclick:function(e){this._w=this.$.sliderBar.offsetWidth;var t=this.$.sliderBar.getBoundingClientRect(),a=(e.detail.x-t.left)/this._w*100;this._isRTL&&(a=100-a);var i=this.ratio;this._setTransiting(!0),this._positionKnob(a),i===this.ratio&&this._setTransiting(!1),this.async(function(){this.fire("change",{composed:!0})}),e.preventDefault(),this.focus()},_bardown:function(e){this._allowBarEvent(e)&&(this.debounce("expandKnob",this._expandKnob,60),this._barclick(e))},_knobTransitionEnd:function(e){e.target===this.$.sliderKnob&&this._setTransiting(!1)},_updateMarkers:function(e,t,a,i){i||this._setMarkers([]);var r=Math.round((a-t)/this.step);r>e&&(r=e),(r<0||!isFinite(r))&&(r=0),this._setMarkers(new Array(r))},_mergeClasses:function(e){return Object.keys(e).filter(function(t){return e[t]}).join(" ")},_getClassNames:function(){return this._mergeClasses({disabled:this.disabled,pin:this.pin,snaps:this.snaps,ring:this.immediateValue<=this.min,expand:this.expand,dragging:this.dragging,transiting:this.transiting,editable:this.editable})},_allowBarEvent:function(e){return!this.ignoreBarTouch||e.detail.sourceEvent instanceof MouseEvent},get _isRTL(){return void 0===this.__isRTL&&(this.__isRTL="rtl"===window.getComputedStyle(this).direction),this.__isRTL},_leftKey:function(e){this._isRTL?this._incrementKey(e):this._decrementKey(e)},_rightKey:function(e){this._isRTL?this._decrementKey(e):this._incrementKey(e)},_incrementKey:function(e){this.disabled||("end"===e.detail.key?this.value=this.max:this.increment(),this.fire("change"),e.preventDefault())},_decrementKey:function(e){this.disabled||("home"===e.detail.key?this.value=this.min:this.decrement(),this.fire("change"),e.preventDefault())},_changeValue:function(e){this.value=e.target.value,this.fire("change",{composed:!0})},_inputKeyDown:function(e){e.stopPropagation()},_createRipple:function(){return this._rippleContainer=this.$.sliderKnob,n.b._createRipple.call(this)},_focusedChanged:function(e){e&&this.ensureRipple(),this.hasRipple()&&(this._ripple.style.display=e?"":"none",this._ripple.holdDown=e)}})},162:function(e,t,a){"use strict";var i=a(180);t.a=(e=>void 0===e.attributes.friendly_name?Object(i.a)(e.entity_id).replace(/_/g," "):e.attributes.friendly_name||"")},163:function(e,t,a){"use strict";a(2),a(40),a(172),a(171),a(41);var i=a(4),r=a(3);Object(i.a)({_template:r.a`
    <style include="paper-material-styles">
      :host {
        display: inline-block;
        position: relative;
        box-sizing: border-box;
        background-color: var(--paper-card-background-color, var(--primary-background-color));
        border-radius: 2px;

        @apply --paper-font-common-base;
        @apply --paper-card;
      }

      /* IE 10 support for HTML5 hidden attr */
      :host([hidden]), [hidden] {
        display: none !important;
      }

      .header {
        position: relative;
        border-top-left-radius: inherit;
        border-top-right-radius: inherit;
        overflow: hidden;

        @apply --paper-card-header;
      }

      .header iron-image {
        display: block;
        width: 100%;
        --iron-image-width: 100%;
        pointer-events: none;

        @apply --paper-card-header-image;
      }

      .header .title-text {
        padding: 16px;
        font-size: 24px;
        font-weight: 400;
        color: var(--paper-card-header-color, #000);

        @apply --paper-card-header-text;
      }

      .header .title-text.over-image {
        position: absolute;
        bottom: 0px;

        @apply --paper-card-header-image-text;
      }

      :host ::slotted(.card-content) {
        padding: 16px;
        position:relative;

        @apply --paper-card-content;
      }

      :host ::slotted(.card-actions) {
        border-top: 1px solid #e8e8e8;
        padding: 5px 16px;
        position:relative;

        @apply --paper-card-actions;
      }

      :host([elevation="1"]) {
        @apply --paper-material-elevation-1;
      }

      :host([elevation="2"]) {
        @apply --paper-material-elevation-2;
      }

      :host([elevation="3"]) {
        @apply --paper-material-elevation-3;
      }

      :host([elevation="4"]) {
        @apply --paper-material-elevation-4;
      }

      :host([elevation="5"]) {
        @apply --paper-material-elevation-5;
      }
    </style>

    <div class="header">
      <iron-image hidden\$="[[!image]]" aria-hidden\$="[[_isHidden(image)]]" src="[[image]]" alt="[[alt]]" placeholder="[[placeholderImage]]" preload="[[preloadImage]]" fade="[[fadeImage]]"></iron-image>
      <div hidden\$="[[!heading]]" class\$="title-text [[_computeHeadingClass(image)]]">[[heading]]</div>
    </div>

    <slot></slot>
`,is:"paper-card",properties:{heading:{type:String,value:"",observer:"_headingChanged"},image:{type:String,value:""},alt:{type:String},preloadImage:{type:Boolean,value:!1},fadeImage:{type:Boolean,value:!1},placeholderImage:{type:String,value:null},elevation:{type:Number,value:1,reflectToAttribute:!0},animatedShadow:{type:Boolean,value:!1},animated:{type:Boolean,reflectToAttribute:!0,readOnly:!0,computed:"_computeAnimated(animatedShadow)"}},_isHidden:function(e){return e?"false":"true"},_headingChanged:function(e){var t=this.getAttribute("heading"),a=this.getAttribute("aria-label");"string"==typeof a&&a!==t||this.setAttribute("aria-label",e)},_computeHeadingClass:function(e){return e?" over-image":""},_computeAnimated:function(e){return e}})},164:function(e,t,a){"use strict";a(2);const i=a(3).a`
/* Most common used flex styles*/
<dom-module id="iron-flex">
  <template>
    <style>
      .layout.horizontal,
      .layout.vertical {
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
      }

      .layout.inline {
        display: -ms-inline-flexbox;
        display: -webkit-inline-flex;
        display: inline-flex;
      }

      .layout.horizontal {
        -ms-flex-direction: row;
        -webkit-flex-direction: row;
        flex-direction: row;
      }

      .layout.vertical {
        -ms-flex-direction: column;
        -webkit-flex-direction: column;
        flex-direction: column;
      }

      .layout.wrap {
        -ms-flex-wrap: wrap;
        -webkit-flex-wrap: wrap;
        flex-wrap: wrap;
      }

      .layout.no-wrap {
        -ms-flex-wrap: nowrap;
        -webkit-flex-wrap: nowrap;
        flex-wrap: nowrap;
      }

      .layout.center,
      .layout.center-center {
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
      }

      .layout.center-justified,
      .layout.center-center {
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
      }

      .flex {
        -ms-flex: 1 1 0.000000001px;
        -webkit-flex: 1;
        flex: 1;
        -webkit-flex-basis: 0.000000001px;
        flex-basis: 0.000000001px;
      }

      .flex-auto {
        -ms-flex: 1 1 auto;
        -webkit-flex: 1 1 auto;
        flex: 1 1 auto;
      }

      .flex-none {
        -ms-flex: none;
        -webkit-flex: none;
        flex: none;
      }
    </style>
  </template>
</dom-module>
/* Basic flexbox reverse styles */
<dom-module id="iron-flex-reverse">
  <template>
    <style>
      .layout.horizontal-reverse,
      .layout.vertical-reverse {
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
      }

      .layout.horizontal-reverse {
        -ms-flex-direction: row-reverse;
        -webkit-flex-direction: row-reverse;
        flex-direction: row-reverse;
      }

      .layout.vertical-reverse {
        -ms-flex-direction: column-reverse;
        -webkit-flex-direction: column-reverse;
        flex-direction: column-reverse;
      }

      .layout.wrap-reverse {
        -ms-flex-wrap: wrap-reverse;
        -webkit-flex-wrap: wrap-reverse;
        flex-wrap: wrap-reverse;
      }
    </style>
  </template>
</dom-module>
/* Flexbox alignment */
<dom-module id="iron-flex-alignment">
  <template>
    <style>
      /**
       * Alignment in cross axis.
       */
      .layout.start {
        -ms-flex-align: start;
        -webkit-align-items: flex-start;
        align-items: flex-start;
      }

      .layout.center,
      .layout.center-center {
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
      }

      .layout.end {
        -ms-flex-align: end;
        -webkit-align-items: flex-end;
        align-items: flex-end;
      }

      .layout.baseline {
        -ms-flex-align: baseline;
        -webkit-align-items: baseline;
        align-items: baseline;
      }

      /**
       * Alignment in main axis.
       */
      .layout.start-justified {
        -ms-flex-pack: start;
        -webkit-justify-content: flex-start;
        justify-content: flex-start;
      }

      .layout.center-justified,
      .layout.center-center {
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
      }

      .layout.end-justified {
        -ms-flex-pack: end;
        -webkit-justify-content: flex-end;
        justify-content: flex-end;
      }

      .layout.around-justified {
        -ms-flex-pack: distribute;
        -webkit-justify-content: space-around;
        justify-content: space-around;
      }

      .layout.justified {
        -ms-flex-pack: justify;
        -webkit-justify-content: space-between;
        justify-content: space-between;
      }

      /**
       * Self alignment.
       */
      .self-start {
        -ms-align-self: flex-start;
        -webkit-align-self: flex-start;
        align-self: flex-start;
      }

      .self-center {
        -ms-align-self: center;
        -webkit-align-self: center;
        align-self: center;
      }

      .self-end {
        -ms-align-self: flex-end;
        -webkit-align-self: flex-end;
        align-self: flex-end;
      }

      .self-stretch {
        -ms-align-self: stretch;
        -webkit-align-self: stretch;
        align-self: stretch;
      }

      .self-baseline {
        -ms-align-self: baseline;
        -webkit-align-self: baseline;
        align-self: baseline;
      }

      /**
       * multi-line alignment in main axis.
       */
      .layout.start-aligned {
        -ms-flex-line-pack: start;  /* IE10 */
        -ms-align-content: flex-start;
        -webkit-align-content: flex-start;
        align-content: flex-start;
      }

      .layout.end-aligned {
        -ms-flex-line-pack: end;  /* IE10 */
        -ms-align-content: flex-end;
        -webkit-align-content: flex-end;
        align-content: flex-end;
      }

      .layout.center-aligned {
        -ms-flex-line-pack: center;  /* IE10 */
        -ms-align-content: center;
        -webkit-align-content: center;
        align-content: center;
      }

      .layout.between-aligned {
        -ms-flex-line-pack: justify;  /* IE10 */
        -ms-align-content: space-between;
        -webkit-align-content: space-between;
        align-content: space-between;
      }

      .layout.around-aligned {
        -ms-flex-line-pack: distribute;  /* IE10 */
        -ms-align-content: space-around;
        -webkit-align-content: space-around;
        align-content: space-around;
      }
    </style>
  </template>
</dom-module>
/* Non-flexbox positioning helper styles */
<dom-module id="iron-flex-factors">
  <template>
    <style>
      .flex,
      .flex-1 {
        -ms-flex: 1 1 0.000000001px;
        -webkit-flex: 1;
        flex: 1;
        -webkit-flex-basis: 0.000000001px;
        flex-basis: 0.000000001px;
      }

      .flex-2 {
        -ms-flex: 2;
        -webkit-flex: 2;
        flex: 2;
      }

      .flex-3 {
        -ms-flex: 3;
        -webkit-flex: 3;
        flex: 3;
      }

      .flex-4 {
        -ms-flex: 4;
        -webkit-flex: 4;
        flex: 4;
      }

      .flex-5 {
        -ms-flex: 5;
        -webkit-flex: 5;
        flex: 5;
      }

      .flex-6 {
        -ms-flex: 6;
        -webkit-flex: 6;
        flex: 6;
      }

      .flex-7 {
        -ms-flex: 7;
        -webkit-flex: 7;
        flex: 7;
      }

      .flex-8 {
        -ms-flex: 8;
        -webkit-flex: 8;
        flex: 8;
      }

      .flex-9 {
        -ms-flex: 9;
        -webkit-flex: 9;
        flex: 9;
      }

      .flex-10 {
        -ms-flex: 10;
        -webkit-flex: 10;
        flex: 10;
      }

      .flex-11 {
        -ms-flex: 11;
        -webkit-flex: 11;
        flex: 11;
      }

      .flex-12 {
        -ms-flex: 12;
        -webkit-flex: 12;
        flex: 12;
      }
    </style>
  </template>
</dom-module>
<dom-module id="iron-positioning">
  <template>
    <style>
      .block {
        display: block;
      }

      [hidden] {
        display: none !important;
      }

      .invisible {
        visibility: hidden !important;
      }

      .relative {
        position: relative;
      }

      .fit {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
      }

      body.fullbleed {
        margin: 0;
        height: 100vh;
      }

      .scroll {
        -webkit-overflow-scrolling: touch;
        overflow: auto;
      }

      /* fixed position */
      .fixed-bottom,
      .fixed-left,
      .fixed-right,
      .fixed-top {
        position: fixed;
      }

      .fixed-top {
        top: 0;
        left: 0;
        right: 0;
      }

      .fixed-right {
        top: 0;
        right: 0;
        bottom: 0;
      }

      .fixed-bottom {
        right: 0;
        bottom: 0;
        left: 0;
      }

      .fixed-left {
        top: 0;
        bottom: 0;
        left: 0;
      }
    </style>
  </template>
</dom-module>
`;i.setAttribute("style","display: none;"),document.head.appendChild(i.content)},165:function(e,t,a){"use strict";a.d(t,"a",function(){return r});var i=a(168);function r(e){return Object(i.a)(e.entity_id)}},166:function(e,t,a){"use strict";a.d(t,"a",function(){return s});var i=a(112);const r={alert:"hass:alert",automation:"hass:playlist-play",calendar:"hass:calendar",camera:"hass:video",climate:"hass:thermostat",configurator:"hass:settings",conversation:"hass:text-to-speech",device_tracker:"hass:account",fan:"hass:fan",group:"hass:google-circles-communities",history_graph:"hass:chart-line",homeassistant:"hass:home-assistant",homekit:"hass:home-automation",image_processing:"hass:image-filter-frames",input_boolean:"hass:drawing",input_datetime:"hass:calendar-clock",input_number:"hass:ray-vertex",input_select:"hass:format-list-bulleted",input_text:"hass:textbox",light:"hass:lightbulb",mailbox:"hass:mailbox",notify:"hass:comment-alert",person:"hass:account",plant:"hass:flower",proximity:"hass:apple-safari",remote:"hass:remote",scene:"hass:google-pages",script:"hass:file-document",sensor:"hass:eye",simple_alarm:"hass:bell",sun:"hass:white-balance-sunny",switch:"hass:flash",timer:"hass:timer",updater:"hass:cloud-upload",vacuum:"hass:robot-vacuum",water_heater:"hass:thermometer",weblink:"hass:open-in-new"};function s(e,t){if(e in r)return r[e];switch(e){case"alarm_control_panel":switch(t){case"armed_home":return"hass:bell-plus";case"armed_night":return"hass:bell-sleep";case"disarmed":return"hass:bell-outline";case"triggered":return"hass:bell-ring";default:return"hass:bell"}case"binary_sensor":return t&&"off"===t?"hass:radiobox-blank":"hass:checkbox-marked-circle";case"cover":return"closed"===t?"hass:window-closed":"hass:window-open";case"lock":return t&&"unlocked"===t?"hass:lock-open":"hass:lock";case"media_player":return t&&"off"!==t&&"idle"!==t?"hass:cast-connected":"hass:cast";case"zwave":switch(t){case"dead":return"hass:emoticon-dead";case"sleeping":return"hass:sleep";case"initializing":return"hass:timer-sand";default:return"hass:z-wave"}default:return console.warn("Unable to find icon for domain "+e+" ("+t+")"),i.a}}},167:function(e,t,a){"use strict";a.d(t,"a",function(){return s});a(99);const i=customElements.get("iron-icon");let r=!1;class s extends i{constructor(...e){super(...e),this._iconsetName=void 0}listen(e,t,i){super.listen(e,t,i),r||"mdi"!==this._iconsetName||(r=!0,a.e(60).then(a.bind(null,208)))}}customElements.define("ha-icon",s)},168:function(e,t,a){"use strict";function i(e){return e.substr(0,e.indexOf("."))}a.d(t,"a",function(){return i})},171:function(e,t,a){"use strict";a(2),a(74);const i=a(3).a`
<dom-module id="paper-material-styles">
  <template>
    <style>
      html {
        --paper-material: {
          display: block;
          position: relative;
        };
        --paper-material-elevation-1: {
          @apply --shadow-elevation-2dp;
        };
        --paper-material-elevation-2: {
          @apply --shadow-elevation-4dp;
        };
        --paper-material-elevation-3: {
          @apply --shadow-elevation-6dp;
        };
        --paper-material-elevation-4: {
          @apply --shadow-elevation-8dp;
        };
        --paper-material-elevation-5: {
          @apply --shadow-elevation-16dp;
        };
      }
      .paper-material {
        @apply --paper-material;
      }
      .paper-material[elevation="1"] {
        @apply --paper-material-elevation-1;
      }
      .paper-material[elevation="2"] {
        @apply --paper-material-elevation-2;
      }
      .paper-material[elevation="3"] {
        @apply --paper-material-elevation-3;
      }
      .paper-material[elevation="4"] {
        @apply --paper-material-elevation-4;
      }
      .paper-material[elevation="5"] {
        @apply --paper-material-elevation-5;
      }

      /* Duplicate the styles because of https://github.com/webcomponents/shadycss/issues/193 */
      :host {
        --paper-material: {
          display: block;
          position: relative;
        };
        --paper-material-elevation-1: {
          @apply --shadow-elevation-2dp;
        };
        --paper-material-elevation-2: {
          @apply --shadow-elevation-4dp;
        };
        --paper-material-elevation-3: {
          @apply --shadow-elevation-6dp;
        };
        --paper-material-elevation-4: {
          @apply --shadow-elevation-8dp;
        };
        --paper-material-elevation-5: {
          @apply --shadow-elevation-16dp;
        };
      }
      :host(.paper-material) {
        @apply --paper-material;
      }
      :host(.paper-material[elevation="1"]) {
        @apply --paper-material-elevation-1;
      }
      :host(.paper-material[elevation="2"]) {
        @apply --paper-material-elevation-2;
      }
      :host(.paper-material[elevation="3"]) {
        @apply --paper-material-elevation-3;
      }
      :host(.paper-material[elevation="4"]) {
        @apply --paper-material-elevation-4;
      }
      :host(.paper-material[elevation="5"]) {
        @apply --paper-material-elevation-5;
      }
    </style>
  </template>
</dom-module>`;i.setAttribute("style","display: none;"),document.head.appendChild(i.content)},172:function(e,t,a){"use strict";a(2);var i=a(4),r=a(3),s=a(16);Object(i.a)({_template:r.a`
    <style>
      :host {
        display: inline-block;
        overflow: hidden;
        position: relative;
      }

      #baseURIAnchor {
        display: none;
      }

      #sizedImgDiv {
        position: absolute;
        top: 0px;
        right: 0px;
        bottom: 0px;
        left: 0px;

        display: none;
      }

      #img {
        display: block;
        width: var(--iron-image-width, auto);
        height: var(--iron-image-height, auto);
      }

      :host([sizing]) #sizedImgDiv {
        display: block;
      }

      :host([sizing]) #img {
        display: none;
      }

      #placeholder {
        position: absolute;
        top: 0px;
        right: 0px;
        bottom: 0px;
        left: 0px;

        background-color: inherit;
        opacity: 1;

        @apply --iron-image-placeholder;
      }

      #placeholder.faded-out {
        transition: opacity 0.5s linear;
        opacity: 0;
      }
    </style>

    <a id="baseURIAnchor" href="#"></a>
    <div id="sizedImgDiv" role="img" hidden\$="[[_computeImgDivHidden(sizing)]]" aria-hidden\$="[[_computeImgDivARIAHidden(alt)]]" aria-label\$="[[_computeImgDivARIALabel(alt, src)]]"></div>
    <img id="img" alt\$="[[alt]]" hidden\$="[[_computeImgHidden(sizing)]]" crossorigin\$="[[crossorigin]]" on-load="_imgOnLoad" on-error="_imgOnError">
    <div id="placeholder" hidden\$="[[_computePlaceholderHidden(preload, fade, loading, loaded)]]" class\$="[[_computePlaceholderClassName(preload, fade, loading, loaded)]]"></div>
`,is:"iron-image",properties:{src:{type:String,value:""},alt:{type:String,value:null},crossorigin:{type:String,value:null},preventLoad:{type:Boolean,value:!1},sizing:{type:String,value:null,reflectToAttribute:!0},position:{type:String,value:"center"},preload:{type:Boolean,value:!1},placeholder:{type:String,value:null,observer:"_placeholderChanged"},fade:{type:Boolean,value:!1},loaded:{notify:!0,readOnly:!0,type:Boolean,value:!1},loading:{notify:!0,readOnly:!0,type:Boolean,value:!1},error:{notify:!0,readOnly:!0,type:Boolean,value:!1},width:{observer:"_widthChanged",type:Number,value:null},height:{observer:"_heightChanged",type:Number,value:null}},observers:["_transformChanged(sizing, position)","_loadStateObserver(src, preventLoad)"],created:function(){this._resolvedSrc=""},_imgOnLoad:function(){this.$.img.src===this._resolveSrc(this.src)&&(this._setLoading(!1),this._setLoaded(!0),this._setError(!1))},_imgOnError:function(){this.$.img.src===this._resolveSrc(this.src)&&(this.$.img.removeAttribute("src"),this.$.sizedImgDiv.style.backgroundImage="",this._setLoading(!1),this._setLoaded(!1),this._setError(!0))},_computePlaceholderHidden:function(){return!this.preload||!this.fade&&!this.loading&&this.loaded},_computePlaceholderClassName:function(){return this.preload&&this.fade&&!this.loading&&this.loaded?"faded-out":""},_computeImgDivHidden:function(){return!this.sizing},_computeImgDivARIAHidden:function(){return""===this.alt?"true":void 0},_computeImgDivARIALabel:function(){return null!==this.alt?this.alt:""===this.src?"":this._resolveSrc(this.src).replace(/[?|#].*/g,"").split("/").pop()},_computeImgHidden:function(){return!!this.sizing},_widthChanged:function(){this.style.width=isNaN(this.width)?this.width:this.width+"px"},_heightChanged:function(){this.style.height=isNaN(this.height)?this.height:this.height+"px"},_loadStateObserver:function(e,t){var a=this._resolveSrc(e);a!==this._resolvedSrc&&(this._resolvedSrc="",this.$.img.removeAttribute("src"),this.$.sizedImgDiv.style.backgroundImage="",""===e||t?(this._setLoading(!1),this._setLoaded(!1),this._setError(!1)):(this._resolvedSrc=a,this.$.img.src=this._resolvedSrc,this.$.sizedImgDiv.style.backgroundImage='url("'+this._resolvedSrc+'")',this._setLoading(!0),this._setLoaded(!1),this._setError(!1)))},_placeholderChanged:function(){this.$.placeholder.style.backgroundImage=this.placeholder?'url("'+this.placeholder+'")':""},_transformChanged:function(){var e=this.$.sizedImgDiv.style,t=this.$.placeholder.style;e.backgroundSize=t.backgroundSize=this.sizing,e.backgroundPosition=t.backgroundPosition=this.sizing?this.position:"",e.backgroundRepeat=t.backgroundRepeat=this.sizing?"no-repeat":""},_resolveSrc:function(e){var t=Object(s.c)(e,this.$.baseURIAnchor.href);return"/"===t[0]&&(t=(location.origin||location.protocol+"//"+location.host)+t),t}})},175:function(e,t,a){"use strict";a(2),a(54),a(140);var i=a(4),r=a(3),s=a(116);const n=r.a`
  <style include="paper-spinner-styles"></style>

  <div id="spinnerContainer" class-name="[[__computeContainerClasses(active, __coolingDown)]]" on-animationend="__reset" on-webkit-animation-end="__reset">
    <div class="spinner-layer layer-1">
      <div class="circle-clipper left"></div>
      <div class="circle-clipper right"></div>
    </div>

    <div class="spinner-layer layer-2">
      <div class="circle-clipper left"></div>
      <div class="circle-clipper right"></div>
    </div>

    <div class="spinner-layer layer-3">
      <div class="circle-clipper left"></div>
      <div class="circle-clipper right"></div>
    </div>

    <div class="spinner-layer layer-4">
      <div class="circle-clipper left"></div>
      <div class="circle-clipper right"></div>
    </div>
  </div>
`;n.setAttribute("strip-whitespace",""),Object(i.a)({_template:n,is:"paper-spinner",behaviors:[s.a]})},177:function(e,t,a){"use strict";var i=a(5),r=(a(167),a(165)),s=a(184);function n(e){var t,a=p(e.key);"method"===e.kind?t={value:e.value,writable:!0,configurable:!0,enumerable:!1}:"get"===e.kind?t={get:e.value,configurable:!0,enumerable:!1}:"set"===e.kind?t={set:e.value,configurable:!0,enumerable:!1}:"field"===e.kind&&(t={configurable:!0,writable:!0,enumerable:!0});var i={kind:"field"===e.kind?"field":"method",key:a,placement:e.static?"static":"field"===e.kind?"own":"prototype",descriptor:t};return e.decorators&&(i.decorators=e.decorators),"field"===e.kind&&(i.initializer=e.value),i}function o(e,t){void 0!==e.descriptor.get?t.descriptor.get=e.descriptor.get:t.descriptor.set=e.descriptor.set}function l(e){return e.decorators&&e.decorators.length}function c(e){return void 0!==e&&!(void 0===e.value&&void 0===e.writable)}function d(e,t){var a=e[t];if(void 0!==a&&"function"!=typeof a)throw new TypeError("Expected '"+t+"' to be a function");return a}function p(e){var t=function(e,t){if("object"!=typeof e||null===e)return e;var a=e[Symbol.toPrimitive];if(void 0!==a){var i=a.call(e,t||"default");if("object"!=typeof i)return i;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"==typeof t?t:String(t)}let u=function(e,t,a,i){var r=function(){var e={elementsDefinitionOrder:[["method"],["field"]],initializeInstanceElements:function(e,t){["method","field"].forEach(function(a){t.forEach(function(t){t.kind===a&&"own"===t.placement&&this.defineClassElement(e,t)},this)},this)},initializeClassElements:function(e,t){var a=e.prototype;["method","field"].forEach(function(i){t.forEach(function(t){var r=t.placement;if(t.kind===i&&("static"===r||"prototype"===r)){var s="static"===r?e:a;this.defineClassElement(s,t)}},this)},this)},defineClassElement:function(e,t){var a=t.descriptor;if("field"===t.kind){var i=t.initializer;a={enumerable:a.enumerable,writable:a.writable,configurable:a.configurable,value:void 0===i?void 0:i.call(e)}}Object.defineProperty(e,t.key,a)},decorateClass:function(e,t){var a=[],i=[],r={static:[],prototype:[],own:[]};if(e.forEach(function(e){this.addElementPlacement(e,r)},this),e.forEach(function(e){if(!l(e))return a.push(e);var t=this.decorateElement(e,r);a.push(t.element),a.push.apply(a,t.extras),i.push.apply(i,t.finishers)},this),!t)return{elements:a,finishers:i};var s=this.decorateConstructor(a,t);return i.push.apply(i,s.finishers),s.finishers=i,s},addElementPlacement:function(e,t,a){var i=t[e.placement];if(!a&&-1!==i.indexOf(e.key))throw new TypeError("Duplicated element ("+e.key+")");i.push(e.key)},decorateElement:function(e,t){for(var a=[],i=[],r=e.decorators,s=r.length-1;s>=0;s--){var n=t[e.placement];n.splice(n.indexOf(e.key),1);var o=this.fromElementDescriptor(e),l=this.toElementFinisherExtras((0,r[s])(o)||o);e=l.element,this.addElementPlacement(e,t),l.finisher&&i.push(l.finisher);var c=l.extras;if(c){for(var d=0;d<c.length;d++)this.addElementPlacement(c[d],t);a.push.apply(a,c)}}return{element:e,finishers:i,extras:a}},decorateConstructor:function(e,t){for(var a=[],i=t.length-1;i>=0;i--){var r=this.fromClassDescriptor(e),s=this.toClassDescriptor((0,t[i])(r)||r);if(void 0!==s.finisher&&a.push(s.finisher),void 0!==s.elements){e=s.elements;for(var n=0;n<e.length-1;n++)for(var o=n+1;o<e.length;o++)if(e[n].key===e[o].key&&e[n].placement===e[o].placement)throw new TypeError("Duplicated element ("+e[n].key+")")}}return{elements:e,finishers:a}},fromElementDescriptor:function(e){var t={kind:e.kind,key:e.key,placement:e.placement,descriptor:e.descriptor};return Object.defineProperty(t,Symbol.toStringTag,{value:"Descriptor",configurable:!0}),"field"===e.kind&&(t.initializer=e.initializer),t},toElementDescriptors:function(e){var t;if(void 0!==e)return(t=e,function(e){if(Array.isArray(e))return e}(t)||function(e){if(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e))return Array.from(e)}(t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}()).map(function(e){var t=this.toElementDescriptor(e);return this.disallowProperty(e,"finisher","An element descriptor"),this.disallowProperty(e,"extras","An element descriptor"),t},this)},toElementDescriptor:function(e){var t=String(e.kind);if("method"!==t&&"field"!==t)throw new TypeError('An element descriptor\'s .kind property must be either "method" or "field", but a decorator created an element descriptor with .kind "'+t+'"');var a=p(e.key),i=String(e.placement);if("static"!==i&&"prototype"!==i&&"own"!==i)throw new TypeError('An element descriptor\'s .placement property must be one of "static", "prototype" or "own", but a decorator created an element descriptor with .placement "'+i+'"');var r=e.descriptor;this.disallowProperty(e,"elements","An element descriptor");var s={kind:t,key:a,placement:i,descriptor:Object.assign({},r)};return"field"!==t?this.disallowProperty(e,"initializer","A method descriptor"):(this.disallowProperty(r,"get","The property descriptor of a field descriptor"),this.disallowProperty(r,"set","The property descriptor of a field descriptor"),this.disallowProperty(r,"value","The property descriptor of a field descriptor"),s.initializer=e.initializer),s},toElementFinisherExtras:function(e){var t=this.toElementDescriptor(e),a=d(e,"finisher"),i=this.toElementDescriptors(e.extras);return{element:t,finisher:a,extras:i}},fromClassDescriptor:function(e){var t={kind:"class",elements:e.map(this.fromElementDescriptor,this)};return Object.defineProperty(t,Symbol.toStringTag,{value:"Descriptor",configurable:!0}),t},toClassDescriptor:function(e){var t=String(e.kind);if("class"!==t)throw new TypeError('A class descriptor\'s .kind property must be "class", but a decorator created a class descriptor with .kind "'+t+'"');this.disallowProperty(e,"key","A class descriptor"),this.disallowProperty(e,"placement","A class descriptor"),this.disallowProperty(e,"descriptor","A class descriptor"),this.disallowProperty(e,"initializer","A class descriptor"),this.disallowProperty(e,"extras","A class descriptor");var a=d(e,"finisher"),i=this.toElementDescriptors(e.elements);return{elements:i,finisher:a}},runClassFinishers:function(e,t){for(var a=0;a<t.length;a++){var i=(0,t[a])(e);if(void 0!==i){if("function"!=typeof i)throw new TypeError("Finishers must return a constructor.");e=i}}return e},disallowProperty:function(e,t,a){if(void 0!==e[t])throw new TypeError(a+" can't have a ."+t+" property.")}};return e}();if(i)for(var s=0;s<i.length;s++)r=i[s](r);var u=t(function(e){r.initializeInstanceElements(e,h.elements)},a),h=r.decorateClass(function(e){for(var t=[],a=function(e){return"method"===e.kind&&e.key===s.key&&e.placement===s.placement},i=0;i<e.length;i++){var r,s=e[i];if("method"===s.kind&&(r=t.find(a)))if(c(s.descriptor)||c(r.descriptor)){if(l(s)||l(r))throw new ReferenceError("Duplicated methods ("+s.key+") can't be decorated.");r.descriptor=s.descriptor}else{if(l(s)){if(l(r))throw new ReferenceError("Decorators can't be placed on different accessors with for the same property ("+s.key+").");r.decorators=s.decorators}o(s,r)}else t.push(s)}return t}(u.d.map(n)),e);return r.initializeClassElements(u.F,h.elements),r.runClassFinishers(u.F,h.finishers)}(null,function(e,t){return{F:class extends t{constructor(...t){super(...t),e(this)}},d:[{kind:"field",decorators:[Object(i.f)()],key:"stateObj",value:void 0},{kind:"field",decorators:[Object(i.f)()],key:"overrideIcon",value:void 0},{kind:"field",decorators:[Object(i.g)("ha-icon")],key:"_icon",value:void 0},{kind:"method",key:"render",value:function(){const e=this.stateObj;return e?i.e`
      <ha-icon
        id="icon"
        data-domain=${Object(r.a)(e)}
        data-state=${e.state}
        .icon=${this.overrideIcon||Object(s.a)(e)}
      ></ha-icon>
    `:i.e``}},{kind:"method",key:"updated",value:function(e){if(!e.has("stateObj")||!this.stateObj)return;const t=this.stateObj,a={color:"",filter:""},i={backgroundImage:""};if(t)if(t.attributes.entity_picture&&!this.overrideIcon)i.backgroundImage="url("+t.attributes.entity_picture+")",a.display="none";else{if(t.attributes.hs_color){const e=t.attributes.hs_color[0],i=t.attributes.hs_color[1];i>10&&(a.color=`hsl(${e}, 100%, ${100-i/2}%)`)}if(t.attributes.brightness){const e=t.attributes.brightness;if("number"!=typeof e){const a=`Type error: state-badge expected number, but type of ${t.entity_id}.attributes.brightness is ${typeof e} (${e})`;console.warn(a)}a.filter=`brightness(${(e+245)/5}%)`}}Object.assign(this._icon.style,a),Object.assign(this.style,i)}},{kind:"get",static:!0,key:"styles",value:function(){return i.c`
      :host {
        position: relative;
        display: inline-block;
        width: 40px;
        color: var(--paper-item-icon-color, #44739e);
        border-radius: 50%;
        height: 40px;
        text-align: center;
        background-size: cover;
        line-height: 40px;
      }

      ha-icon {
        transition: color 0.3s ease-in-out, filter 0.3s ease-in-out;
      }

      /* Color the icon if light or sun is on */
      ha-icon[data-domain="light"][data-state="on"],
      ha-icon[data-domain="switch"][data-state="on"],
      ha-icon[data-domain="binary_sensor"][data-state="on"],
      ha-icon[data-domain="fan"][data-state="on"],
      ha-icon[data-domain="sun"][data-state="above_horizon"] {
        color: var(--paper-item-icon-active-color, #fdd835);
      }

      /* Color the icon if unavailable */
      ha-icon[data-state="unavailable"] {
        color: var(--state-icon-unavailable-color);
      }
    `}}]}},i.a);customElements.define("state-badge",u)},179:function(e,t,a){"use strict";a(104);var i=a(5),r=a(53);function s(e){var t,a=d(e.key);"method"===e.kind?t={value:e.value,writable:!0,configurable:!0,enumerable:!1}:"get"===e.kind?t={get:e.value,configurable:!0,enumerable:!1}:"set"===e.kind?t={set:e.value,configurable:!0,enumerable:!1}:"field"===e.kind&&(t={configurable:!0,writable:!0,enumerable:!0});var i={kind:"field"===e.kind?"field":"method",key:a,placement:e.static?"static":"field"===e.kind?"own":"prototype",descriptor:t};return e.decorators&&(i.decorators=e.decorators),"field"===e.kind&&(i.initializer=e.value),i}function n(e,t){void 0!==e.descriptor.get?t.descriptor.get=e.descriptor.get:t.descriptor.set=e.descriptor.set}function o(e){return e.decorators&&e.decorators.length}function l(e){return void 0!==e&&!(void 0===e.value&&void 0===e.writable)}function c(e,t){var a=e[t];if(void 0!==a&&"function"!=typeof a)throw new TypeError("Expected '"+t+"' to be a function");return a}function d(e){var t=function(e,t){if("object"!=typeof e||null===e)return e;var a=e[Symbol.toPrimitive];if(void 0!==a){var i=a.call(e,t||"default");if("object"!=typeof i)return i;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"==typeof t?t:String(t)}!function(e,t,a,i){var r=function(){var e={elementsDefinitionOrder:[["method"],["field"]],initializeInstanceElements:function(e,t){["method","field"].forEach(function(a){t.forEach(function(t){t.kind===a&&"own"===t.placement&&this.defineClassElement(e,t)},this)},this)},initializeClassElements:function(e,t){var a=e.prototype;["method","field"].forEach(function(i){t.forEach(function(t){var r=t.placement;if(t.kind===i&&("static"===r||"prototype"===r)){var s="static"===r?e:a;this.defineClassElement(s,t)}},this)},this)},defineClassElement:function(e,t){var a=t.descriptor;if("field"===t.kind){var i=t.initializer;a={enumerable:a.enumerable,writable:a.writable,configurable:a.configurable,value:void 0===i?void 0:i.call(e)}}Object.defineProperty(e,t.key,a)},decorateClass:function(e,t){var a=[],i=[],r={static:[],prototype:[],own:[]};if(e.forEach(function(e){this.addElementPlacement(e,r)},this),e.forEach(function(e){if(!o(e))return a.push(e);var t=this.decorateElement(e,r);a.push(t.element),a.push.apply(a,t.extras),i.push.apply(i,t.finishers)},this),!t)return{elements:a,finishers:i};var s=this.decorateConstructor(a,t);return i.push.apply(i,s.finishers),s.finishers=i,s},addElementPlacement:function(e,t,a){var i=t[e.placement];if(!a&&-1!==i.indexOf(e.key))throw new TypeError("Duplicated element ("+e.key+")");i.push(e.key)},decorateElement:function(e,t){for(var a=[],i=[],r=e.decorators,s=r.length-1;s>=0;s--){var n=t[e.placement];n.splice(n.indexOf(e.key),1);var o=this.fromElementDescriptor(e),l=this.toElementFinisherExtras((0,r[s])(o)||o);e=l.element,this.addElementPlacement(e,t),l.finisher&&i.push(l.finisher);var c=l.extras;if(c){for(var d=0;d<c.length;d++)this.addElementPlacement(c[d],t);a.push.apply(a,c)}}return{element:e,finishers:i,extras:a}},decorateConstructor:function(e,t){for(var a=[],i=t.length-1;i>=0;i--){var r=this.fromClassDescriptor(e),s=this.toClassDescriptor((0,t[i])(r)||r);if(void 0!==s.finisher&&a.push(s.finisher),void 0!==s.elements){e=s.elements;for(var n=0;n<e.length-1;n++)for(var o=n+1;o<e.length;o++)if(e[n].key===e[o].key&&e[n].placement===e[o].placement)throw new TypeError("Duplicated element ("+e[n].key+")")}}return{elements:e,finishers:a}},fromElementDescriptor:function(e){var t={kind:e.kind,key:e.key,placement:e.placement,descriptor:e.descriptor};return Object.defineProperty(t,Symbol.toStringTag,{value:"Descriptor",configurable:!0}),"field"===e.kind&&(t.initializer=e.initializer),t},toElementDescriptors:function(e){var t;if(void 0!==e)return(t=e,function(e){if(Array.isArray(e))return e}(t)||function(e){if(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e))return Array.from(e)}(t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}()).map(function(e){var t=this.toElementDescriptor(e);return this.disallowProperty(e,"finisher","An element descriptor"),this.disallowProperty(e,"extras","An element descriptor"),t},this)},toElementDescriptor:function(e){var t=String(e.kind);if("method"!==t&&"field"!==t)throw new TypeError('An element descriptor\'s .kind property must be either "method" or "field", but a decorator created an element descriptor with .kind "'+t+'"');var a=d(e.key),i=String(e.placement);if("static"!==i&&"prototype"!==i&&"own"!==i)throw new TypeError('An element descriptor\'s .placement property must be one of "static", "prototype" or "own", but a decorator created an element descriptor with .placement "'+i+'"');var r=e.descriptor;this.disallowProperty(e,"elements","An element descriptor");var s={kind:t,key:a,placement:i,descriptor:Object.assign({},r)};return"field"!==t?this.disallowProperty(e,"initializer","A method descriptor"):(this.disallowProperty(r,"get","The property descriptor of a field descriptor"),this.disallowProperty(r,"set","The property descriptor of a field descriptor"),this.disallowProperty(r,"value","The property descriptor of a field descriptor"),s.initializer=e.initializer),s},toElementFinisherExtras:function(e){var t=this.toElementDescriptor(e),a=c(e,"finisher"),i=this.toElementDescriptors(e.extras);return{element:t,finisher:a,extras:i}},fromClassDescriptor:function(e){var t={kind:"class",elements:e.map(this.fromElementDescriptor,this)};return Object.defineProperty(t,Symbol.toStringTag,{value:"Descriptor",configurable:!0}),t},toClassDescriptor:function(e){var t=String(e.kind);if("class"!==t)throw new TypeError('A class descriptor\'s .kind property must be "class", but a decorator created a class descriptor with .kind "'+t+'"');this.disallowProperty(e,"key","A class descriptor"),this.disallowProperty(e,"placement","A class descriptor"),this.disallowProperty(e,"descriptor","A class descriptor"),this.disallowProperty(e,"initializer","A class descriptor"),this.disallowProperty(e,"extras","A class descriptor");var a=c(e,"finisher"),i=this.toElementDescriptors(e.elements);return{elements:i,finisher:a}},runClassFinishers:function(e,t){for(var a=0;a<t.length;a++){var i=(0,t[a])(e);if(void 0!==i){if("function"!=typeof i)throw new TypeError("Finishers must return a constructor.");e=i}}return e},disallowProperty:function(e,t,a){if(void 0!==e[t])throw new TypeError(a+" can't have a ."+t+" property.")}};return e}();if(i)for(var p=0;p<i.length;p++)r=i[p](r);var u=t(function(e){r.initializeInstanceElements(e,h.elements)},a),h=r.decorateClass(function(e){for(var t=[],a=function(e){return"method"===e.kind&&e.key===s.key&&e.placement===s.placement},i=0;i<e.length;i++){var r,s=e[i];if("method"===s.kind&&(r=t.find(a)))if(l(s.descriptor)||l(r.descriptor)){if(o(s)||o(r))throw new ReferenceError("Duplicated methods ("+s.key+") can't be decorated.");r.descriptor=s.descriptor}else{if(o(s)){if(o(r))throw new ReferenceError("Decorators can't be placed on different accessors with for the same property ("+s.key+").");r.decorators=s.decorators}n(s,r)}else t.push(s)}return t}(u.d.map(s)),e);r.initializeClassElements(u.F,h.elements),r.runClassFinishers(u.F,h.finishers)}([Object(i.d)("ha-menu-button")],function(e,t){return{F:class extends t{constructor(...t){super(...t),e(this)}},d:[{kind:"field",decorators:[Object(i.f)({type:Boolean})],key:"hassio",value:()=>!1},{kind:"method",key:"render",value:function(){return i.e`
      <paper-icon-button
        .icon=${this.hassio?"hassio:menu":"hass:menu"}
        @click=${this._toggleMenu}
      ></paper-icon-button>
    `}},{kind:"method",key:"createRenderRoot",value:function(){return this}},{kind:"method",key:"_toggleMenu",value:function(){Object(r.a)(this,"hass-toggle-menu")}}]}},i.a)},180:function(e,t,a){"use strict";function i(e){return e.substr(e.indexOf(".")+1)}a.d(t,"a",function(){return i})},181:function(e,t,a){"use strict";var i=a(5);function r(e){var t,a=c(e.key);"method"===e.kind?t={value:e.value,writable:!0,configurable:!0,enumerable:!1}:"get"===e.kind?t={get:e.value,configurable:!0,enumerable:!1}:"set"===e.kind?t={set:e.value,configurable:!0,enumerable:!1}:"field"===e.kind&&(t={configurable:!0,writable:!0,enumerable:!0});var i={kind:"field"===e.kind?"field":"method",key:a,placement:e.static?"static":"field"===e.kind?"own":"prototype",descriptor:t};return e.decorators&&(i.decorators=e.decorators),"field"===e.kind&&(i.initializer=e.value),i}function s(e,t){void 0!==e.descriptor.get?t.descriptor.get=e.descriptor.get:t.descriptor.set=e.descriptor.set}function n(e){return e.decorators&&e.decorators.length}function o(e){return void 0!==e&&!(void 0===e.value&&void 0===e.writable)}function l(e,t){var a=e[t];if(void 0!==a&&"function"!=typeof a)throw new TypeError("Expected '"+t+"' to be a function");return a}function c(e){var t=function(e,t){if("object"!=typeof e||null===e)return e;var a=e[Symbol.toPrimitive];if(void 0!==a){var i=a.call(e,t||"default");if("object"!=typeof i)return i;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"==typeof t?t:String(t)}let d=function(e,t,a,i){var d=function(){var e={elementsDefinitionOrder:[["method"],["field"]],initializeInstanceElements:function(e,t){["method","field"].forEach(function(a){t.forEach(function(t){t.kind===a&&"own"===t.placement&&this.defineClassElement(e,t)},this)},this)},initializeClassElements:function(e,t){var a=e.prototype;["method","field"].forEach(function(i){t.forEach(function(t){var r=t.placement;if(t.kind===i&&("static"===r||"prototype"===r)){var s="static"===r?e:a;this.defineClassElement(s,t)}},this)},this)},defineClassElement:function(e,t){var a=t.descriptor;if("field"===t.kind){var i=t.initializer;a={enumerable:a.enumerable,writable:a.writable,configurable:a.configurable,value:void 0===i?void 0:i.call(e)}}Object.defineProperty(e,t.key,a)},decorateClass:function(e,t){var a=[],i=[],r={static:[],prototype:[],own:[]};if(e.forEach(function(e){this.addElementPlacement(e,r)},this),e.forEach(function(e){if(!n(e))return a.push(e);var t=this.decorateElement(e,r);a.push(t.element),a.push.apply(a,t.extras),i.push.apply(i,t.finishers)},this),!t)return{elements:a,finishers:i};var s=this.decorateConstructor(a,t);return i.push.apply(i,s.finishers),s.finishers=i,s},addElementPlacement:function(e,t,a){var i=t[e.placement];if(!a&&-1!==i.indexOf(e.key))throw new TypeError("Duplicated element ("+e.key+")");i.push(e.key)},decorateElement:function(e,t){for(var a=[],i=[],r=e.decorators,s=r.length-1;s>=0;s--){var n=t[e.placement];n.splice(n.indexOf(e.key),1);var o=this.fromElementDescriptor(e),l=this.toElementFinisherExtras((0,r[s])(o)||o);e=l.element,this.addElementPlacement(e,t),l.finisher&&i.push(l.finisher);var c=l.extras;if(c){for(var d=0;d<c.length;d++)this.addElementPlacement(c[d],t);a.push.apply(a,c)}}return{element:e,finishers:i,extras:a}},decorateConstructor:function(e,t){for(var a=[],i=t.length-1;i>=0;i--){var r=this.fromClassDescriptor(e),s=this.toClassDescriptor((0,t[i])(r)||r);if(void 0!==s.finisher&&a.push(s.finisher),void 0!==s.elements){e=s.elements;for(var n=0;n<e.length-1;n++)for(var o=n+1;o<e.length;o++)if(e[n].key===e[o].key&&e[n].placement===e[o].placement)throw new TypeError("Duplicated element ("+e[n].key+")")}}return{elements:e,finishers:a}},fromElementDescriptor:function(e){var t={kind:e.kind,key:e.key,placement:e.placement,descriptor:e.descriptor};return Object.defineProperty(t,Symbol.toStringTag,{value:"Descriptor",configurable:!0}),"field"===e.kind&&(t.initializer=e.initializer),t},toElementDescriptors:function(e){var t;if(void 0!==e)return(t=e,function(e){if(Array.isArray(e))return e}(t)||function(e){if(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e))return Array.from(e)}(t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}()).map(function(e){var t=this.toElementDescriptor(e);return this.disallowProperty(e,"finisher","An element descriptor"),this.disallowProperty(e,"extras","An element descriptor"),t},this)},toElementDescriptor:function(e){var t=String(e.kind);if("method"!==t&&"field"!==t)throw new TypeError('An element descriptor\'s .kind property must be either "method" or "field", but a decorator created an element descriptor with .kind "'+t+'"');var a=c(e.key),i=String(e.placement);if("static"!==i&&"prototype"!==i&&"own"!==i)throw new TypeError('An element descriptor\'s .placement property must be one of "static", "prototype" or "own", but a decorator created an element descriptor with .placement "'+i+'"');var r=e.descriptor;this.disallowProperty(e,"elements","An element descriptor");var s={kind:t,key:a,placement:i,descriptor:Object.assign({},r)};return"field"!==t?this.disallowProperty(e,"initializer","A method descriptor"):(this.disallowProperty(r,"get","The property descriptor of a field descriptor"),this.disallowProperty(r,"set","The property descriptor of a field descriptor"),this.disallowProperty(r,"value","The property descriptor of a field descriptor"),s.initializer=e.initializer),s},toElementFinisherExtras:function(e){var t=this.toElementDescriptor(e),a=l(e,"finisher"),i=this.toElementDescriptors(e.extras);return{element:t,finisher:a,extras:i}},fromClassDescriptor:function(e){var t={kind:"class",elements:e.map(this.fromElementDescriptor,this)};return Object.defineProperty(t,Symbol.toStringTag,{value:"Descriptor",configurable:!0}),t},toClassDescriptor:function(e){var t=String(e.kind);if("class"!==t)throw new TypeError('A class descriptor\'s .kind property must be "class", but a decorator created a class descriptor with .kind "'+t+'"');this.disallowProperty(e,"key","A class descriptor"),this.disallowProperty(e,"placement","A class descriptor"),this.disallowProperty(e,"descriptor","A class descriptor"),this.disallowProperty(e,"initializer","A class descriptor"),this.disallowProperty(e,"extras","A class descriptor");var a=l(e,"finisher"),i=this.toElementDescriptors(e.elements);return{elements:i,finisher:a}},runClassFinishers:function(e,t){for(var a=0;a<t.length;a++){var i=(0,t[a])(e);if(void 0!==i){if("function"!=typeof i)throw new TypeError("Finishers must return a constructor.");e=i}}return e},disallowProperty:function(e,t,a){if(void 0!==e[t])throw new TypeError(a+" can't have a ."+t+" property.")}};return e}();if(i)for(var p=0;p<i.length;p++)d=i[p](d);var u=t(function(e){d.initializeInstanceElements(e,h.elements)},a),h=d.decorateClass(function(e){for(var t=[],a=function(e){return"method"===e.kind&&e.key===l.key&&e.placement===l.placement},i=0;i<e.length;i++){var r,l=e[i];if("method"===l.kind&&(r=t.find(a)))if(o(l.descriptor)||o(r.descriptor)){if(n(l)||n(r))throw new ReferenceError("Duplicated methods ("+l.key+") can't be decorated.");r.descriptor=l.descriptor}else{if(n(l)){if(n(r))throw new ReferenceError("Decorators can't be placed on different accessors with for the same property ("+l.key+").");r.decorators=l.decorators}s(l,r)}else t.push(l)}return t}(u.d.map(r)),e);return d.initializeClassElements(u.F,h.elements),d.runClassFinishers(u.F,h.finishers)}(null,function(e,t){return{F:class extends t{constructor(...t){super(...t),e(this)}},d:[{kind:"field",decorators:[Object(i.f)()],key:"header",value:void 0},{kind:"get",static:!0,key:"styles",value:function(){return i.c`
      :host {
        background: var(
          --ha-card-background,
          var(--paper-card-background-color, white)
        );
        border-radius: var(--ha-card-border-radius, 2px);
        box-shadow: var(
          --ha-card-box-shadow,
          0 2px 2px 0 rgba(0, 0, 0, 0.14),
          0 1px 5px 0 rgba(0, 0, 0, 0.12),
          0 3px 1px -2px rgba(0, 0, 0, 0.2)
        );
        color: var(--primary-text-color);
        display: block;
        transition: all 0.3s ease-out;
      }
      .header:not(:empty) {
        font-size: 24px;
        letter-spacing: -0.012em;
        line-height: 32px;
        opacity: 0.87;
        padding: 24px 16px 16px;
      }
    `}},{kind:"method",key:"render",value:function(){return i.e`
      <div class="header">${this.header}</div>
      <slot></slot>
    `}}]}},i.a);customElements.define("ha-card",d)},184:function(e,t,a){"use strict";var i=a(112),r=a(168),s=a(166);const n={humidity:"hass:water-percent",illuminance:"hass:brightness-5",temperature:"hass:thermometer",pressure:"hass:gauge"};a.d(t,"a",function(){return l});const o={binary_sensor:function(e){const t=e.state&&"off"===e.state;switch(e.attributes.device_class){case"battery":return t?"hass:battery":"hass:battery-outline";case"cold":return t?"hass:thermometer":"hass:snowflake";case"connectivity":return t?"hass:server-network-off":"hass:server-network";case"door":return t?"hass:door-closed":"hass:door-open";case"garage_door":return t?"hass:garage":"hass:garage-open";case"gas":case"power":case"problem":case"safety":case"smoke":return t?"hass:shield-check":"hass:alert";case"heat":return t?"hass:thermometer":"hass:fire";case"light":return t?"hass:brightness-5":"hass:brightness-7";case"lock":return t?"hass:lock":"hass:lock-open";case"moisture":return t?"hass:water-off":"hass:water";case"motion":return t?"hass:walk":"hass:run";case"occupancy":return t?"hass:home-outline":"hass:home";case"opening":return t?"hass:square":"hass:square-outline";case"plug":return t?"hass:power-plug-off":"hass:power-plug";case"presence":return t?"hass:home-outline":"hass:home";case"sound":return t?"hass:music-note-off":"hass:music-note";case"vibration":return t?"hass:crop-portrait":"hass:vibrate";case"window":return t?"hass:window-closed":"hass:window-open";default:return t?"hass:radiobox-blank":"hass:checkbox-marked-circle"}},cover:function(e){const t="closed"!==e.state;switch(e.attributes.device_class){case"garage":return t?"hass:garage-open":"hass:garage";default:return Object(s.a)("cover",e.state)}},sensor:function(e){const t=e.attributes.device_class;if(t&&t in n)return n[t];if("battery"===t){const t=Number(e.state);if(isNaN(t))return"hass:battery-unknown";const a=10*Math.round(t/10);return a>=100?"hass:battery":a<=0?"hass:battery-alert":`hass:battery-${a}`}const a=e.attributes.unit_of_measurement;return a===i.j||a===i.k?"hass:thermometer":Object(s.a)("sensor")},input_datetime:function(e){return e.attributes.has_date?e.attributes.has_time?Object(s.a)("input_datetime"):"hass:calendar":"hass:clock"}};function l(e){if(!e)return i.a;if(e.attributes.icon)return e.attributes.icon;const t=Object(r.a)(e.entity_id);return t in o?o[t](e):Object(s.a)(t,e.state)}},187:function(e,t,a){"use strict";var i={},r=/d{1,4}|M{1,4}|YY(?:YY)?|S{1,3}|Do|ZZ|([HhMsDm])\1?|[aA]|"[^"]*"|'[^']*'/g,s="[^\\s]+",n=/\[([^]*?)\]/gm,o=function(){};function l(e,t){for(var a=[],i=0,r=e.length;i<r;i++)a.push(e[i].substr(0,t));return a}function c(e){return function(t,a,i){var r=i[e].indexOf(a.charAt(0).toUpperCase()+a.substr(1).toLowerCase());~r&&(t.month=r)}}function d(e,t){for(e=String(e),t=t||2;e.length<t;)e="0"+e;return e}var p=["Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday"],u=["January","February","March","April","May","June","July","August","September","October","November","December"],h=l(u,3),m=l(p,3);i.i18n={dayNamesShort:m,dayNames:p,monthNamesShort:h,monthNames:u,amPm:["am","pm"],DoFn:function(e){return e+["th","st","nd","rd"][e%10>3?0:(e-e%10!=10)*e%10]}};var b={D:function(e){return e.getDate()},DD:function(e){return d(e.getDate())},Do:function(e,t){return t.DoFn(e.getDate())},d:function(e){return e.getDay()},dd:function(e){return d(e.getDay())},ddd:function(e,t){return t.dayNamesShort[e.getDay()]},dddd:function(e,t){return t.dayNames[e.getDay()]},M:function(e){return e.getMonth()+1},MM:function(e){return d(e.getMonth()+1)},MMM:function(e,t){return t.monthNamesShort[e.getMonth()]},MMMM:function(e,t){return t.monthNames[e.getMonth()]},YY:function(e){return d(String(e.getFullYear()),4).substr(2)},YYYY:function(e){return d(e.getFullYear(),4)},h:function(e){return e.getHours()%12||12},hh:function(e){return d(e.getHours()%12||12)},H:function(e){return e.getHours()},HH:function(e){return d(e.getHours())},m:function(e){return e.getMinutes()},mm:function(e){return d(e.getMinutes())},s:function(e){return e.getSeconds()},ss:function(e){return d(e.getSeconds())},S:function(e){return Math.round(e.getMilliseconds()/100)},SS:function(e){return d(Math.round(e.getMilliseconds()/10),2)},SSS:function(e){return d(e.getMilliseconds(),3)},a:function(e,t){return e.getHours()<12?t.amPm[0]:t.amPm[1]},A:function(e,t){return e.getHours()<12?t.amPm[0].toUpperCase():t.amPm[1].toUpperCase()},ZZ:function(e){var t=e.getTimezoneOffset();return(t>0?"-":"+")+d(100*Math.floor(Math.abs(t)/60)+Math.abs(t)%60,4)}},f={D:["\\d\\d?",function(e,t){e.day=t}],Do:["\\d\\d?"+s,function(e,t){e.day=parseInt(t,10)}],M:["\\d\\d?",function(e,t){e.month=t-1}],YY:["\\d\\d?",function(e,t){var a=+(""+(new Date).getFullYear()).substr(0,2);e.year=""+(t>68?a-1:a)+t}],h:["\\d\\d?",function(e,t){e.hour=t}],m:["\\d\\d?",function(e,t){e.minute=t}],s:["\\d\\d?",function(e,t){e.second=t}],YYYY:["\\d{4}",function(e,t){e.year=t}],S:["\\d",function(e,t){e.millisecond=100*t}],SS:["\\d{2}",function(e,t){e.millisecond=10*t}],SSS:["\\d{3}",function(e,t){e.millisecond=t}],d:["\\d\\d?",o],ddd:[s,o],MMM:[s,c("monthNamesShort")],MMMM:[s,c("monthNames")],a:[s,function(e,t,a){var i=t.toLowerCase();i===a.amPm[0]?e.isPm=!1:i===a.amPm[1]&&(e.isPm=!0)}],ZZ:["[^\\s]*?[\\+\\-]\\d\\d:?\\d\\d|[^\\s]*?Z",function(e,t){var a,i=(t+"").match(/([+-]|\d\d)/gi);i&&(a=60*i[1]+parseInt(i[2],10),e.timezoneOffset="+"===i[0]?a:-a)}]};f.dd=f.d,f.dddd=f.ddd,f.DD=f.D,f.mm=f.m,f.hh=f.H=f.HH=f.h,f.MM=f.M,f.ss=f.s,f.A=f.a,i.masks={default:"ddd MMM DD YYYY HH:mm:ss",shortDate:"M/D/YY",mediumDate:"MMM D, YYYY",longDate:"MMMM D, YYYY",fullDate:"dddd, MMMM D, YYYY",shortTime:"HH:mm",mediumTime:"HH:mm:ss",longTime:"HH:mm:ss.SSS"},i.format=function(e,t,a){var s=a||i.i18n;if("number"==typeof e&&(e=new Date(e)),"[object Date]"!==Object.prototype.toString.call(e)||isNaN(e.getTime()))throw new Error("Invalid Date in fecha.format");t=i.masks[t]||t||i.masks.default;var o=[];return(t=(t=t.replace(n,function(e,t){return o.push(t),"??"})).replace(r,function(t){return t in b?b[t](e,s):t.slice(1,t.length-1)})).replace(/\?\?/g,function(){return o.shift()})},i.parse=function(e,t,a){var s=a||i.i18n;if("string"!=typeof t)throw new Error("Invalid format in fecha.parse");if(t=i.masks[t]||t,e.length>1e3)return null;var n,o={},l=[],c=(n=t,n.replace(/[|\\{()[^$+*?.-]/g,"\\$&")).replace(r,function(e){if(f[e]){var t=f[e];return l.push(t[1]),"("+t[0]+")"}return e}),d=e.match(new RegExp(c,"i"));if(!d)return null;for(var p=1;p<d.length;p++)l[p-1](o,d[p],s);var u,h=new Date;return!0===o.isPm&&null!=o.hour&&12!=+o.hour?o.hour=+o.hour+12:!1===o.isPm&&12==+o.hour&&(o.hour=0),null!=o.timezoneOffset?(o.minute=+(o.minute||0)-+o.timezoneOffset,u=new Date(Date.UTC(o.year||h.getFullYear(),o.month||0,o.day||1,o.hour||0,o.minute||0,o.second||0,o.millisecond||0))):u=new Date(o.year||h.getFullYear(),o.month||0,o.day||1,o.hour||0,o.minute||0,o.second||0,o.millisecond||0),u},t.a=i},190:function(e,t,a){"use strict";var i=a(187);t.a=function(){try{(new Date).toLocaleString("i")}catch(e){return"RangeError"===e.name}return!1}()?(e,t)=>e.toLocaleString(t,{year:"numeric",month:"long",day:"numeric",hour:"numeric",minute:"2-digit"}):e=>i.a.format(e,"haDateTime")},197:function(e,t,a){"use strict";a(2),a(40),a(54),a(41);var i=a(114),r=a(62),s=a(4),n=a(33),o=a(3),l=a(59);const c=o.a`

    <style>
      :host {
        display: inline-block;
        @apply --layout-horizontal;
        @apply --layout-center;
        @apply --paper-font-common-base;
      }

      :host([disabled]) {
        pointer-events: none;
      }

      :host(:focus) {
        outline:none;
      }

      .toggle-bar {
        position: absolute;
        height: 100%;
        width: 100%;
        border-radius: 8px;
        pointer-events: none;
        opacity: 0.4;
        transition: background-color linear .08s;
        background-color: var(--paper-toggle-button-unchecked-bar-color, #000000);

        @apply --paper-toggle-button-unchecked-bar;
      }

      .toggle-button {
        position: absolute;
        top: -3px;
        left: 0;
        height: 20px;
        width: 20px;
        border-radius: 50%;
        box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.6);
        transition: -webkit-transform linear .08s, background-color linear .08s;
        transition: transform linear .08s, background-color linear .08s;
        will-change: transform;
        background-color: var(--paper-toggle-button-unchecked-button-color, var(--paper-grey-50));

        @apply --paper-toggle-button-unchecked-button;
      }

      .toggle-button.dragging {
        -webkit-transition: none;
        transition: none;
      }

      :host([checked]:not([disabled])) .toggle-bar {
        opacity: 0.5;
        background-color: var(--paper-toggle-button-checked-bar-color, var(--primary-color));

        @apply --paper-toggle-button-checked-bar;
      }

      :host([disabled]) .toggle-bar {
        background-color: #000;
        opacity: 0.12;
      }

      :host([checked]) .toggle-button {
        -webkit-transform: translate(16px, 0);
        transform: translate(16px, 0);
      }

      :host([checked]:not([disabled])) .toggle-button {
        background-color: var(--paper-toggle-button-checked-button-color, var(--primary-color));

        @apply --paper-toggle-button-checked-button;
      }

      :host([disabled]) .toggle-button {
        background-color: #bdbdbd;
        opacity: 1;
      }

      .toggle-ink {
        position: absolute;
        top: -14px;
        left: -14px;
        right: auto;
        bottom: auto;
        width: 48px;
        height: 48px;
        opacity: 0.5;
        pointer-events: none;
        color: var(--paper-toggle-button-unchecked-ink-color, var(--primary-text-color));

        @apply --paper-toggle-button-unchecked-ink;
      }

      :host([checked]) .toggle-ink {
        color: var(--paper-toggle-button-checked-ink-color, var(--primary-color));

        @apply --paper-toggle-button-checked-ink;
      }

      .toggle-container {
        display: inline-block;
        position: relative;
        width: 36px;
        height: 14px;
        /* The toggle button has an absolute position of -3px; The extra 1px
        /* accounts for the toggle button shadow box. */
        margin: 4px 1px;
      }

      .toggle-label {
        position: relative;
        display: inline-block;
        vertical-align: middle;
        padding-left: var(--paper-toggle-button-label-spacing, 8px);
        pointer-events: none;
        color: var(--paper-toggle-button-label-color, var(--primary-text-color));
      }

      /* invalid state */
      :host([invalid]) .toggle-bar {
        background-color: var(--paper-toggle-button-invalid-bar-color, var(--error-color));
      }

      :host([invalid]) .toggle-button {
        background-color: var(--paper-toggle-button-invalid-button-color, var(--error-color));
      }

      :host([invalid]) .toggle-ink {
        color: var(--paper-toggle-button-invalid-ink-color, var(--error-color));
      }
    </style>

    <div class="toggle-container">
      <div id="toggleBar" class="toggle-bar"></div>
      <div id="toggleButton" class="toggle-button"></div>
    </div>

    <div class="toggle-label"><slot></slot></div>

  `;c.setAttribute("strip-whitespace",""),Object(s.a)({_template:c,is:"paper-toggle-button",behaviors:[i.a],hostAttributes:{role:"button","aria-pressed":"false",tabindex:0},properties:{},listeners:{track:"_ontrack"},attached:function(){Object(l.a)(this,function(){Object(n.f)(this,"pan-y")})},_ontrack:function(e){var t=e.detail;"start"===t.state?this._trackStart(t):"track"===t.state?this._trackMove(t):"end"===t.state&&this._trackEnd(t)},_trackStart:function(e){this._width=this.$.toggleBar.offsetWidth/2,this._trackChecked=this.checked,this.$.toggleButton.classList.add("dragging")},_trackMove:function(e){var t=e.dx;this._x=Math.min(this._width,Math.max(0,this._trackChecked?this._width+t:t)),this.translate3d(this._x+"px",0,0,this.$.toggleButton),this._userActivate(this._x>this._width/2)},_trackEnd:function(e){this.$.toggleButton.classList.remove("dragging"),this.transform("",this.$.toggleButton)},_createRipple:function(){this._rippleContainer=this.$.toggleButton;var e=r.a._createRipple();return e.id="ink",e.setAttribute("recenters",""),e.classList.add("circle","toggle-ink"),e}})},198:function(e,t,a){"use strict";var i=a(6),r=a(103);t.a=Object(i.a)(e=>(class extends e{navigate(...e){Object(r.a)(this,...e)}}))},199:function(e,t,a){"use strict";var i=a(187);t.a=function(){try{(new Date).toLocaleTimeString("i")}catch(e){return"RangeError"===e.name}return!1}()?(e,t)=>e.toLocaleTimeString(t,{hour:"numeric",minute:"2-digit"}):e=>i.a.format(e,"shortTime")},201:function(e,t,a){"use strict";function i(e,t){return e&&-1!==e.config.components.indexOf(t)}a.d(t,"a",function(){return i})},204:function(e,t,a){"use strict";var i=a(165),r=a(190),s=a(221),n=a(199);t.a=((e,t,a)=>{let o;const l=Object(i.a)(t);if("binary_sensor"===l)t.attributes.device_class&&(o=e(`state.${l}.${t.attributes.device_class}.${t.state}`)),o||(o=e(`state.${l}.default.${t.state}`));else if(t.attributes.unit_of_measurement&&!["unknown","unavailable"].includes(t.state))o=t.state+" "+t.attributes.unit_of_measurement;else if("input_datetime"===l){let e;if(t.attributes.has_time)if(t.attributes.has_date)e=new Date(t.attributes.year,t.attributes.month-1,t.attributes.day,t.attributes.hour,t.attributes.minute),o=Object(r.a)(e,a);else{const i=new Date;e=new Date(i.getFullYear(),i.getMonth(),i.getDay(),t.attributes.hour,t.attributes.minute),o=Object(n.a)(e,a)}else e=new Date(t.attributes.year,t.attributes.month-1,t.attributes.day),o=Object(s.a)(e,a)}else o="zwave"===l?["initializing","dead"].includes(t.state)?e(`state.zwave.query_stage.${t.state}`,"query_stage",t.attributes.query_stage):e(`state.zwave.default.${t.state}`):e(`state.${l}.${t.state}`);return o||(o=e(`state.default.${t.state}`)||e(`component.${l}.state.${t.state}`)||t.state),o})},207:function(e,t,a){"use strict";a.d(t,"a",function(){return i});const i=(e,t)=>0!=(e.attributes.supported_features&t)},215:function(e,t,a){"use strict";a.d(t,"a",function(){return r}),a.d(t,"b",function(){return p});var i=a(207);class r{constructor(e,t){this.hass=e,this.stateObj=t,this._attr=t.attributes,this._feat=this._attr.supported_features}get isFullyOpen(){return void 0!==this._attr.current_position?100===this._attr.current_position:"open"===this.stateObj.state}get isFullyClosed(){return void 0!==this._attr.current_position?0===this._attr.current_position:"closed"===this.stateObj.state}get isFullyOpenTilt(){return 100===this._attr.current_tilt_position}get isFullyClosedTilt(){return 0===this._attr.current_tilt_position}get isOpening(){return"opening"===this.stateObj.state}get isClosing(){return"closing"===this.stateObj.state}get supportsOpen(){return Object(i.a)(this.stateObj,1)}get supportsClose(){return Object(i.a)(this.stateObj,2)}get supportsSetPosition(){return Object(i.a)(this.stateObj,4)}get supportsStop(){return Object(i.a)(this.stateObj,8)}get supportsOpenTilt(){return Object(i.a)(this.stateObj,16)}get supportsCloseTilt(){return Object(i.a)(this.stateObj,32)}get supportsStopTilt(){return Object(i.a)(this.stateObj,64)}get supportsSetTiltPosition(){return Object(i.a)(this.stateObj,128)}get isTiltOnly(){const e=this.supportsOpen||this.supportsClose||this.supportsStop;return(this.supportsOpenTilt||this.supportsCloseTilt||this.supportsStopTilt)&&!e}openCover(){this.callService("open_cover")}closeCover(){this.callService("close_cover")}stopCover(){this.callService("stop_cover")}openCoverTilt(){this.callService("open_cover_tilt")}closeCoverTilt(){this.callService("close_cover_tilt")}stopCoverTilt(){this.callService("stop_cover_tilt")}setCoverPosition(e){this.callService("set_cover_position",{position:e})}setCoverTiltPosition(e){this.callService("set_cover_tilt_position",{tilt_position:e})}callService(e,t={}){t.entity_id=this.stateObj.entity_id,this.hass.callService("cover",e,t)}}const s=e=>Object(i.a)(e,1),n=e=>Object(i.a)(e,2),o=e=>Object(i.a)(e,8),l=e=>Object(i.a)(e,16),c=e=>Object(i.a)(e,32),d=e=>Object(i.a)(e,64);function p(e){const t=s(e)||n(e)||o(e);return(l(e)||c(e)||d(e))&&!t}},217:function(e,t,a){"use strict";a(139);var i=a(3);a(24);customElements.define("ha-app-layout",class extends(customElements.get("app-header-layout")){static get template(){return i.a`
      <style>
        :host {
          display: block;
          /**
         * Force app-header-layout to have its own stacking context so that its parent can
         * control the stacking of it relative to other elements (e.g. app-drawer-layout).
         * This could be done using \`isolation: isolate\`, but that's not well supported
         * across browsers.
         */
          position: relative;
          z-index: 0;
        }

        #wrapper ::slotted([slot="header"]) {
          @apply --layout-fixed-top;
          z-index: 1;
        }

        #wrapper.initializing ::slotted([slot="header"]) {
          position: relative;
        }

        :host([has-scrolling-region]) {
          height: 100%;
        }

        :host([has-scrolling-region]) #wrapper ::slotted([slot="header"]) {
          position: absolute;
        }

        :host([has-scrolling-region])
          #wrapper.initializing
          ::slotted([slot="header"]) {
          position: relative;
        }

        :host([has-scrolling-region]) #wrapper #contentContainer {
          @apply --layout-fit;
          overflow-y: auto;
          -webkit-overflow-scrolling: touch;
        }

        :host([has-scrolling-region]) #wrapper.initializing #contentContainer {
          position: relative;
        }

        #contentContainer {
          /* Create a stacking context here so that all children appear below the header. */
          position: relative;
          z-index: 0;
          /* Using 'transform' will cause 'position: fixed' elements to behave like
           'position: absolute' relative to this element. */
          transform: translate(0);
        }

        @media print {
          :host([has-scrolling-region]) #wrapper #contentContainer {
            overflow-y: visible;
          }
        }
      </style>

      <div id="wrapper" class="initializing">
        <slot id="headerSlot" name="header"></slot>

        <div id="contentContainer"><slot></slot></div>
        <slot id="fab" name="fab"></slot>
      </div>
    `}})},218:function(e,t,a){"use strict";a(104),a(197);var i=a(112),r=a(165),s=a(5);function n(e){var t,a=p(e.key);"method"===e.kind?t={value:e.value,writable:!0,configurable:!0,enumerable:!1}:"get"===e.kind?t={get:e.value,configurable:!0,enumerable:!1}:"set"===e.kind?t={set:e.value,configurable:!0,enumerable:!1}:"field"===e.kind&&(t={configurable:!0,writable:!0,enumerable:!0});var i={kind:"field"===e.kind?"field":"method",key:a,placement:e.static?"static":"field"===e.kind?"own":"prototype",descriptor:t};return e.decorators&&(i.decorators=e.decorators),"field"===e.kind&&(i.initializer=e.value),i}function o(e,t){void 0!==e.descriptor.get?t.descriptor.get=e.descriptor.get:t.descriptor.set=e.descriptor.set}function l(e){return e.decorators&&e.decorators.length}function c(e){return void 0!==e&&!(void 0===e.value&&void 0===e.writable)}function d(e,t){var a=e[t];if(void 0!==a&&"function"!=typeof a)throw new TypeError("Expected '"+t+"' to be a function");return a}function p(e){var t=function(e,t){if("object"!=typeof e||null===e)return e;var a=e[Symbol.toPrimitive];if(void 0!==a){var i=a.call(e,t||"default");if("object"!=typeof i)return i;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===t?String:Number)(e)}(e,"string");return"symbol"==typeof t?t:String(t)}function u(e,t,a){return(u="undefined"!=typeof Reflect&&Reflect.get?Reflect.get:function(e,t,a){var i=function(e,t){for(;!Object.prototype.hasOwnProperty.call(e,t)&&null!==(e=h(e)););return e}(e,t);if(i){var r=Object.getOwnPropertyDescriptor(i,t);return r.get?r.get.call(a):r.value}})(e,t,a||e)}function h(e){return(h=Object.setPrototypeOf?Object.getPrototypeOf:function(e){return e.__proto__||Object.getPrototypeOf(e)})(e)}const m=e=>void 0!==e&&!i.i.includes(e.state);let b=function(e,t,a,i){var r=function(){var e={elementsDefinitionOrder:[["method"],["field"]],initializeInstanceElements:function(e,t){["method","field"].forEach(function(a){t.forEach(function(t){t.kind===a&&"own"===t.placement&&this.defineClassElement(e,t)},this)},this)},initializeClassElements:function(e,t){var a=e.prototype;["method","field"].forEach(function(i){t.forEach(function(t){var r=t.placement;if(t.kind===i&&("static"===r||"prototype"===r)){var s="static"===r?e:a;this.defineClassElement(s,t)}},this)},this)},defineClassElement:function(e,t){var a=t.descriptor;if("field"===t.kind){var i=t.initializer;a={enumerable:a.enumerable,writable:a.writable,configurable:a.configurable,value:void 0===i?void 0:i.call(e)}}Object.defineProperty(e,t.key,a)},decorateClass:function(e,t){var a=[],i=[],r={static:[],prototype:[],own:[]};if(e.forEach(function(e){this.addElementPlacement(e,r)},this),e.forEach(function(e){if(!l(e))return a.push(e);var t=this.decorateElement(e,r);a.push(t.element),a.push.apply(a,t.extras),i.push.apply(i,t.finishers)},this),!t)return{elements:a,finishers:i};var s=this.decorateConstructor(a,t);return i.push.apply(i,s.finishers),s.finishers=i,s},addElementPlacement:function(e,t,a){var i=t[e.placement];if(!a&&-1!==i.indexOf(e.key))throw new TypeError("Duplicated element ("+e.key+")");i.push(e.key)},decorateElement:function(e,t){for(var a=[],i=[],r=e.decorators,s=r.length-1;s>=0;s--){var n=t[e.placement];n.splice(n.indexOf(e.key),1);var o=this.fromElementDescriptor(e),l=this.toElementFinisherExtras((0,r[s])(o)||o);e=l.element,this.addElementPlacement(e,t),l.finisher&&i.push(l.finisher);var c=l.extras;if(c){for(var d=0;d<c.length;d++)this.addElementPlacement(c[d],t);a.push.apply(a,c)}}return{element:e,finishers:i,extras:a}},decorateConstructor:function(e,t){for(var a=[],i=t.length-1;i>=0;i--){var r=this.fromClassDescriptor(e),s=this.toClassDescriptor((0,t[i])(r)||r);if(void 0!==s.finisher&&a.push(s.finisher),void 0!==s.elements){e=s.elements;for(var n=0;n<e.length-1;n++)for(var o=n+1;o<e.length;o++)if(e[n].key===e[o].key&&e[n].placement===e[o].placement)throw new TypeError("Duplicated element ("+e[n].key+")")}}return{elements:e,finishers:a}},fromElementDescriptor:function(e){var t={kind:e.kind,key:e.key,placement:e.placement,descriptor:e.descriptor};return Object.defineProperty(t,Symbol.toStringTag,{value:"Descriptor",configurable:!0}),"field"===e.kind&&(t.initializer=e.initializer),t},toElementDescriptors:function(e){var t;if(void 0!==e)return(t=e,function(e){if(Array.isArray(e))return e}(t)||function(e){if(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e))return Array.from(e)}(t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}()).map(function(e){var t=this.toElementDescriptor(e);return this.disallowProperty(e,"finisher","An element descriptor"),this.disallowProperty(e,"extras","An element descriptor"),t},this)},toElementDescriptor:function(e){var t=String(e.kind);if("method"!==t&&"field"!==t)throw new TypeError('An element descriptor\'s .kind property must be either "method" or "field", but a decorator created an element descriptor with .kind "'+t+'"');var a=p(e.key),i=String(e.placement);if("static"!==i&&"prototype"!==i&&"own"!==i)throw new TypeError('An element descriptor\'s .placement property must be one of "static", "prototype" or "own", but a decorator created an element descriptor with .placement "'+i+'"');var r=e.descriptor;this.disallowProperty(e,"elements","An element descriptor");var s={kind:t,key:a,placement:i,descriptor:Object.assign({},r)};return"field"!==t?this.disallowProperty(e,"initializer","A method descriptor"):(this.disallowProperty(r,"get","The property descriptor of a field descriptor"),this.disallowProperty(r,"set","The property descriptor of a field descriptor"),this.disallowProperty(r,"value","The property descriptor of a field descriptor"),s.initializer=e.initializer),s},toElementFinisherExtras:function(e){var t=this.toElementDescriptor(e),a=d(e,"finisher"),i=this.toElementDescriptors(e.extras);return{element:t,finisher:a,extras:i}},fromClassDescriptor:function(e){var t={kind:"class",elements:e.map(this.fromElementDescriptor,this)};return Object.defineProperty(t,Symbol.toStringTag,{value:"Descriptor",configurable:!0}),t},toClassDescriptor:function(e){var t=String(e.kind);if("class"!==t)throw new TypeError('A class descriptor\'s .kind property must be "class", but a decorator created a class descriptor with .kind "'+t+'"');this.disallowProperty(e,"key","A class descriptor"),this.disallowProperty(e,"placement","A class descriptor"),this.disallowProperty(e,"descriptor","A class descriptor"),this.disallowProperty(e,"initializer","A class descriptor"),this.disallowProperty(e,"extras","A class descriptor");var a=d(e,"finisher"),i=this.toElementDescriptors(e.elements);return{elements:i,finisher:a}},runClassFinishers:function(e,t){for(var a=0;a<t.length;a++){var i=(0,t[a])(e);if(void 0!==i){if("function"!=typeof i)throw new TypeError("Finishers must return a constructor.");e=i}}return e},disallowProperty:function(e,t,a){if(void 0!==e[t])throw new TypeError(a+" can't have a ."+t+" property.")}};return e}();if(i)for(var s=0;s<i.length;s++)r=i[s](r);var u=t(function(e){r.initializeInstanceElements(e,h.elements)},a),h=r.decorateClass(function(e){for(var t=[],a=function(e){return"method"===e.kind&&e.key===s.key&&e.placement===s.placement},i=0;i<e.length;i++){var r,s=e[i];if("method"===s.kind&&(r=t.find(a)))if(c(s.descriptor)||c(r.descriptor)){if(l(s)||l(r))throw new ReferenceError("Duplicated methods ("+s.key+") can't be decorated.");r.descriptor=s.descriptor}else{if(l(s)){if(l(r))throw new ReferenceError("Decorators can't be placed on different accessors with for the same property ("+s.key+").");r.decorators=s.decorators}o(s,r)}else t.push(s)}return t}(u.d.map(n)),e);return r.initializeClassElements(u.F,h.elements),r.runClassFinishers(u.F,h.finishers)}(null,function(e,t){class a extends t{constructor(...t){super(...t),e(this)}}return{F:a,d:[{kind:"field",key:"hass",value:void 0},{kind:"field",decorators:[Object(s.f)()],key:"stateObj",value:void 0},{kind:"field",decorators:[Object(s.f)()],key:"_isOn",value:()=>!1},{kind:"method",key:"render",value:function(){return this.stateObj?this.stateObj.attributes.assumed_state?s.e`
        <paper-icon-button
          icon="hass:flash-off"
          @click=${this._turnOff}
          ?state-active=${!this._isOn}
        ></paper-icon-button>
        <paper-icon-button
          icon="hass:flash"
          @click=${this._turnOn}
          ?state-active=${this._isOn}
        ></paper-icon-button>
      `:s.e`
      <paper-toggle-button
        .checked=${this._isOn}
        @change=${this._toggleChanged}
      ></paper-toggle-button>
    `:s.e`
        <paper-toggle-button disabled></paper-toggle-button>
      `}},{kind:"method",key:"firstUpdated",value:function(e){u(h(a.prototype),"firstUpdated",this).call(this,e),this.addEventListener("click",e=>e.stopPropagation())}},{kind:"method",key:"updated",value:function(e){e.has("stateObj")&&(this._isOn=m(this.stateObj))}},{kind:"method",key:"_toggleChanged",value:function(e){const t=e.target.checked;t!==this._isOn&&this._callService(t)}},{kind:"method",key:"_turnOn",value:function(){this._callService(!0)}},{kind:"method",key:"_turnOff",value:function(){this._callService(!1)}},{kind:"method",key:"_callService",value:async function(e){if(!this.hass||!this.stateObj)return;const t=Object(r.a)(this.stateObj);let a,i;"lock"===t?(a="lock",i=e?"unlock":"lock"):"cover"===t?(a="cover",i=e?"open_cover":"close_cover"):"group"===t?(a="homeassistant",i=e?"turn_on":"turn_off"):(a=t,i=e?"turn_on":"turn_off");const s=this.stateObj;this._isOn=e,await this.hass.callService(a,i,{entity_id:this.stateObj.entity_id}),setTimeout(async()=>{this.stateObj===s&&(this._isOn=m(this.stateObj))},2e3)}},{kind:"get",static:!0,key:"styles",value:function(){return s.c`
      :host {
        white-space: nowrap;
        min-width: 38px;
      }
      paper-icon-button {
        color: var(
          --paper-icon-button-inactive-color,
          var(--primary-text-color)
        );
        transition: color 0.5s;
      }
      paper-icon-button[state-active] {
        color: var(--paper-icon-button-active-color, var(--primary-color));
      }
      paper-toggle-button {
        cursor: pointer;
        --paper-toggle-button-label-spacing: 0;
        padding: 13px 5px;
        margin: -4px -5px;
      }
    `}}]}},s.a);customElements.define("ha-entity-toggle",b)},219:function(e,t,a){"use strict";a.d(t,"c",function(){return l}),a.d(t,"b",function(){return c}),a.d(t,"a",function(){return p});var i=a(162),r=a(165),s=a(204);const n=["climate","water_heater"],o=["temperature","current_temperature","target_temp_low","target_temp_high"],l=(e,t,a,i,r=!1)=>{let s="history/period";return a&&(s+="/"+a.toISOString()),s+="?filter_entity_id="+t,i&&(s+="&end_time="+i.toISOString()),r&&(s+="&skip_initial_state"),e.callApi("GET",s)},c=(e,t,a)=>e.callApi("GET",`history/period/${t.toISOString()}?end_time=${a.toISOString()}`),d=(e,t)=>e.state===t.state&&(!e.attributes||o.every(a=>e.attributes[a]===t.attributes[a])),p=(e,t,a,l)=>{const c={},p=[];return t?(t.forEach(t=>{if(0===t.length)return;const n=t.find(e=>"unit_of_measurement"in e.attributes);let o;n?o=n.attributes.unit_of_measurement:"climate"===Object(r.a)(t[0])?o=e.config.unit_system.temperature:"water_heater"===Object(r.a)(t[0])&&(o=e.config.unit_system.temperature),o?o in c?c[o].push(t):c[o]=[t]:p.push(((e,t,a)=>{const r=[];for(const i of a)r.length>0&&i.state===r[r.length-1].state||r.push({state_localize:Object(s.a)(e,i,t),state:i.state,last_changed:i.last_changed});return{name:Object(i.a)(a[0]),entity_id:a[0].entity_id,data:r}})(a,l,t))}),{line:Object.keys(c).map(e=>((e,t)=>{const a=[];for(const e of t){const t=e[e.length-1],s=Object(r.a)(t),l=[];for(const t of e){let e;if(n.includes(s)){e={state:t.state,last_changed:t.last_updated,attributes:{}};for(const a of o)a in t.attributes&&(e.attributes[a]=t.attributes[a])}else e=t;l.length>1&&d(e,l[l.length-1])&&d(e,l[l.length-2])||l.push(e)}a.push({domain:s,name:Object(i.a)(t),entity_id:t.entity_id,states:l})}return{unit:e,identifier:t.map(e=>e[0].entity_id).join(""),data:a}})(e,c[e])),timeline:p}):{line:[],timeline:[]}}},221:function(e,t,a){"use strict";var i=a(187);t.a=function(){try{(new Date).toLocaleDateString("i")}catch(e){return"RangeError"===e.name}return!1}()?(e,t)=>e.toLocaleDateString(t,{year:"numeric",month:"long",day:"numeric"}):e=>i.a.format(e,"mediumDate")},225:function(e,t,a){"use strict";var i=a(24),r=a(84);let s=null;const n=["svg","path"];customElements.define("ha-markdown",class extends(Object(r.a)(i.a)){static get properties(){return{content:{type:String,observer:"_render"},allowSvg:{type:Boolean,value:!1}}}connectedCallback(){super.connectedCallback(),this._scriptLoaded=0,this._renderScheduled=!1,this._resize=(()=>this.fire("iron-resize")),s||(s=Promise.all([a.e(122),a.e(58)]).then(a.bind(null,286))),s.then(({marked:e,filterXSS:t})=>{this.marked=e,this.filterXSS=t,this._scriptLoaded=1},()=>{this._scriptLoaded=2}).then(()=>this._render())}_render(){0===this._scriptLoaded||this._renderScheduled||(this._renderScheduled=!0,Promise.resolve().then(()=>{if(this._renderScheduled=!1,1===this._scriptLoaded){this.innerHTML=this.filterXSS(this.marked(this.content,{gfm:!0,tables:!0,breaks:!0}),{onIgnoreTag:this.allowSvg?(e,t)=>n.indexOf(e)>=0?t:null:null}),this._resize();const e=document.createTreeWalker(this,1,null,!1);for(;e.nextNode();){const t=e.currentNode;"A"===t.tagName&&t.host!==document.location.host?t.target="_blank":"IMG"===t.tagName&&t.addEventListener("load",this._resize)}}else 2===this._scriptLoaded&&(this.innerText=this.content)}))}})},228:function(e,t,a){"use strict";a(2),a(40);var i=a(50),r=a(32),s=a(62),n=a(4),o=a(0),l=a(3);Object(n.a)({_template:l.a`
    <style>
      :host {
        @apply --layout-inline;
        @apply --layout-center;
        @apply --layout-center-justified;
        @apply --layout-flex-auto;

        position: relative;
        padding: 0 12px;
        overflow: hidden;
        cursor: pointer;
        vertical-align: middle;

        @apply --paper-font-common-base;
        @apply --paper-tab;
      }

      :host(:focus) {
        outline: none;
      }

      :host([link]) {
        padding: 0;
      }

      .tab-content {
        height: 100%;
        transform: translateZ(0);
          -webkit-transform: translateZ(0);
        transition: opacity 0.1s cubic-bezier(0.4, 0.0, 1, 1);
        @apply --layout-horizontal;
        @apply --layout-center-center;
        @apply --layout-flex-auto;
        @apply --paper-tab-content;
      }

      :host(:not(.iron-selected)) > .tab-content {
        opacity: 0.8;

        @apply --paper-tab-content-unselected;
      }

      :host(:focus) .tab-content {
        opacity: 1;
        font-weight: 700;
      }

      paper-ripple {
        color: var(--paper-tab-ink, var(--paper-yellow-a100));
      }

      .tab-content > ::slotted(a) {
        @apply --layout-flex-auto;

        height: 100%;
      }
    </style>

    <div class="tab-content">
      <slot></slot>
    </div>
`,is:"paper-tab",behaviors:[r.a,i.a,s.a],properties:{link:{type:Boolean,value:!1,reflectToAttribute:!0}},hostAttributes:{role:"tab"},listeners:{down:"_updateNoink",tap:"_onTap"},attached:function(){this._updateNoink()},get _parentNoink(){var e=Object(o.b)(this).parentNode;return!!e&&!!e.noink},_updateNoink:function(){this.noink=!!this.noink||!!this._parentNoink},_onTap:function(e){if(this.link){var t=this.queryEffectiveChildren("a");if(!t)return;if(e.target===t)return;t.click()}}})},231:function(e,t,a){"use strict";a.d(t,"b",function(){return r}),a.d(t,"a",function(){return s});a(2);var i=a(115);const r={hostAttributes:{role:"menubar"},keyBindings:{left:"_onLeftKey",right:"_onRightKey"},_onUpKey:function(e){this.focusedItem.click(),e.detail.keyboardEvent.preventDefault()},_onDownKey:function(e){this.focusedItem.click(),e.detail.keyboardEvent.preventDefault()},get _isRTL(){return"rtl"===window.getComputedStyle(this).direction},_onLeftKey:function(e){this._isRTL?this._focusNext():this._focusPrevious(),e.detail.keyboardEvent.preventDefault()},_onRightKey:function(e){this._isRTL?this._focusPrevious():this._focusNext(),e.detail.keyboardEvent.preventDefault()},_onKeydown:function(e){this.keyboardEventMatchesKeys(e,"up down left right esc")||this._focusWithKeyboardEvent(e)}},s=[i.a,r]},232:function(e,t,a){"use strict";var i=a(0),r=a(24),s=a(253),n=a(110);customElements.define("ha-relative-time",class extends(Object(n.a)(r.a)){static get properties(){return{hass:Object,datetime:{type:String,observer:"datetimeChanged"},datetimeObj:{type:Object,observer:"datetimeObjChanged"},parsedDateTime:Object}}constructor(){super(),this.updateRelative=this.updateRelative.bind(this)}connectedCallback(){super.connectedCallback(),this.updateInterval=setInterval(this.updateRelative,6e4)}disconnectedCallback(){super.disconnectedCallback(),clearInterval(this.updateInterval)}datetimeChanged(e){this.parsedDateTime=e?new Date(e):null,this.updateRelative()}datetimeObjChanged(e){this.parsedDateTime=e,this.updateRelative()}updateRelative(){const e=Object(i.b)(this);this.parsedDateTime?e.innerHTML=Object(s.a)(this.parsedDateTime,this.localize):e.innerHTML=this.localize("ui.components.relative_time.never")}})},236:function(e,t,a){"use strict";a.d(t,"a",function(){return r});const i=e=>e<10?`0${e}`:e;function r(e){const t=Math.floor(e/3600),a=Math.floor(e%3600/60),r=Math.floor(e%3600%60);return t>0?`${t}:${i(a)}:${i(r)}`:a>0?`${a}:${i(r)}`:r>0?""+r:null}},237:function(e,t,a){"use strict";a.d(t,"a",function(){return r});var i=a(207);class r{constructor(e,t){this.hass=e,this.stateObj=t,this._attr=t.attributes,this._feat=this._attr.supported_features}get isOff(){return"off"===this.stateObj.state}get isIdle(){return"idle"===this.stateObj.state}get isMuted(){return this._attr.is_volume_muted}get isPaused(){return"paused"===this.stateObj.state}get isPlaying(){return"playing"===this.stateObj.state}get isMusic(){return"music"===this._attr.media_content_type}get isTVShow(){return"tvshow"===this._attr.media_content_type}get hasMediaControl(){return-1!==["playing","paused","unknown"].indexOf(this.stateObj.state)}get volumeSliderValue(){return 100*this._attr.volume_level}get showProgress(){return(this.isPlaying||this.isPaused)&&"media_duration"in this.stateObj.attributes&&"media_position"in this.stateObj.attributes&&"media_position_updated_at"in this.stateObj.attributes}get currentProgress(){var e=this._attr.media_position;return this.isPlaying&&(e+=(Date.now()-new Date(this._attr.media_position_updated_at).getTime())/1e3),e}get supportsPause(){return Object(i.a)(this.stateObj,1)}get supportsVolumeSet(){return Object(i.a)(this.stateObj,4)}get supportsVolumeMute(){return Object(i.a)(this.stateObj,8)}get supportsPreviousTrack(){return Object(i.a)(this.stateObj,16)}get supportsNextTrack(){return Object(i.a)(this.stateObj,32)}get supportsTurnOn(){return Object(i.a)(this.stateObj,128)}get supportsTurnOff(){return Object(i.a)(this.stateObj,256)}get supportsPlayMedia(){return Object(i.a)(this.stateObj,512)}get supportsVolumeButtons(){return Object(i.a)(this.stateObj,1024)}get supportsSelectSource(){return Object(i.a)(this.stateObj,2048)}get supportsSelectSoundMode(){return Object(i.a)(this.stateObj,65536)}get supportsPlay(){return Object(i.a)(this.stateObj,16384)}get primaryTitle(){return this._attr.media_title}get secondaryTitle(){if(this.isMusic)return this._attr.media_artist;if(this.isTVShow){var e=this._attr.media_series_title;return this._attr.media_season&&(e+=" S"+this._attr.media_season,this._attr.media_episode&&(e+="E"+this._attr.media_episode)),e}return this._attr.app_name?this._attr.app_name:""}get source(){return this._attr.source}get sourceList(){return this._attr.source_list}get soundMode(){return this._attr.sound_mode}get soundModeList(){return this._attr.sound_mode_list}mediaPlayPause(){this.callService("media_play_pause")}nextTrack(){this.callService("media_next_track")}playbackControl(){this.callService("media_play_pause")}previousTrack(){this.callService("media_previous_track")}setVolume(e){this.callService("volume_set",{volume_level:e})}togglePower(){this.isOff?this.turnOn():this.turnOff()}turnOff(){this.callService("turn_off")}turnOn(){this.callService("turn_on")}volumeDown(){this.callService("volume_down")}volumeMute(e){if(!this.supportsVolumeMute)throw new Error("Muting volume not supported");this.callService("volume_mute",{is_volume_muted:e})}volumeUp(){this.callService("volume_up")}selectSource(e){this.callService("select_source",{source:e})}selectSoundMode(e){this.callService("select_sound_mode",{sound_mode:e})}callService(e,t={}){t.entity_id=this.stateObj.entity_id,this.hass.callService("media_player",e,t)}}},238:function(e,t,a){"use strict";function i(e,t){return e?t.map(t=>t in e.attributes?"has-"+t:"").filter(e=>""!==e).join(" "):""}a.d(t,"a",function(){return i})},242:function(e,t,a){"use strict";a(175);var i=a(3),r=a(24),s=a(19),n=a(88),o=(a(104),a(11)),l=a(65),c=a(199);let d=null;customElements.define("ha-chart-base",class extends(Object(l.b)([n.a],r.a)){static get template(){return i.a`
      <style>
        :host {
          display: block;
        }
        .chartHeader {
          padding: 6px 0 0 0;
          width: 100%;
          display: flex;
          flex-direction: row;
        }
        .chartHeader > div {
          vertical-align: top;
          padding: 0 8px;
        }
        .chartHeader > div.chartTitle {
          padding-top: 8px;
          flex: 0 0 0;
          max-width: 30%;
        }
        .chartHeader > div.chartLegend {
          flex: 1 1;
          min-width: 70%;
        }
        :root {
          user-select: none;
          -moz-user-select: none;
          -webkit-user-select: none;
          -ms-user-select: none;
        }
        .chartTooltip {
          font-size: 90%;
          opacity: 1;
          position: absolute;
          background: rgba(80, 80, 80, 0.9);
          color: white;
          border-radius: 3px;
          pointer-events: none;
          transform: translate(-50%, 12px);
          z-index: 1000;
          width: 200px;
          transition: opacity 0.15s ease-in-out;
        }
        :host([rtl]) .chartTooltip {
          direction: rtl;
        }
        .chartLegend ul,
        .chartTooltip ul {
          display: inline-block;
          padding: 0 0px;
          margin: 5px 0 0 0;
          width: 100%;
        }
        .chartTooltip li {
          display: block;
          white-space: pre-line;
        }
        .chartTooltip .title {
          text-align: center;
          font-weight: 500;
        }
        .chartLegend li {
          display: inline-block;
          padding: 0 6px;
          max-width: 49%;
          text-overflow: ellipsis;
          white-space: nowrap;
          overflow: hidden;
          box-sizing: border-box;
        }
        .chartLegend li:nth-child(odd):last-of-type {
          /* Make last item take full width if it is odd-numbered. */
          max-width: 100%;
        }
        .chartLegend li[data-hidden] {
          text-decoration: line-through;
        }
        .chartLegend em,
        .chartTooltip em {
          border-radius: 5px;
          display: inline-block;
          height: 10px;
          margin-right: 4px;
          width: 10px;
        }
        :host([rtl]) .chartTooltip em {
          margin-right: inherit;
          margin-left: 4px;
        }
        paper-icon-button {
          color: var(--secondary-text-color);
        }
      </style>
      <template is="dom-if" if="[[unit]]">
        <div class="chartHeader">
          <div class="chartTitle">[[unit]]</div>
          <div class="chartLegend">
            <ul>
              <template is="dom-repeat" items="[[metas]]">
                <li on-click="_legendClick" data-hidden$="[[item.hidden]]">
                  <em style$="background-color:[[item.bgColor]]"></em>
                  [[item.label]]
                </li>
              </template>
            </ul>
          </div>
        </div>
      </template>
      <div id="chartTarget" style="height:40px; width:100%">
        <canvas id="chartCanvas"></canvas>
        <div
          class$="chartTooltip [[tooltip.yAlign]]"
          style$="opacity:[[tooltip.opacity]]; top:[[tooltip.top]]; left:[[tooltip.left]]; padding:[[tooltip.yPadding]]px [[tooltip.xPadding]]px"
        >
          <div class="title">[[tooltip.title]]</div>
          <div>
            <ul>
              <template is="dom-repeat" items="[[tooltip.lines]]">
                <li>
                  <em style$="background-color:[[item.bgColor]]"></em
                  >[[item.text]]
                </li>
              </template>
            </ul>
          </div>
        </div>
      </div>
    `}get chart(){return this._chart}static get properties(){return{data:Object,identifier:String,rendered:{type:Boolean,notify:!0,value:!1,readOnly:!0},metas:{type:Array,value:()=>[]},tooltip:{type:Object,value:()=>({opacity:"0",left:"0",top:"0",xPadding:"5",yPadding:"3"})},unit:Object,rtl:{type:Boolean,reflectToAttribute:!0}}}static get observers(){return["onPropsChange(data)"]}connectedCallback(){super.connectedCallback(),this._isAttached=!0,this.onPropsChange(),this._resizeListener=(()=>{this._debouncer=s.a.debounce(this._debouncer,o.d.after(10),()=>{this._isAttached&&this.resizeChart()})}),"function"==typeof ResizeObserver?(this.resizeObserver=new ResizeObserver(e=>{e.forEach(()=>{this._resizeListener()})}),this.resizeObserver.observe(this.$.chartTarget)):this.addEventListener("iron-resize",this._resizeListener),null===d&&(d=Promise.all([a.e(121),a.e(57)]).then(a.bind(null,749))),d.then(e=>{this.ChartClass=e.default,this.onPropsChange()})}disconnectedCallback(){super.disconnectedCallback(),this._isAttached=!1,this.resizeObserver&&this.resizeObserver.unobserve(this.$.chartTarget),this.removeEventListener("iron-resize",this._resizeListener),void 0!==this._resizeTimer&&(clearInterval(this._resizeTimer),this._resizeTimer=void 0)}onPropsChange(){this._isAttached&&this.ChartClass&&this.data&&this.drawChart()}_customTooltips(e){if(0===e.opacity)return void this.set(["tooltip","opacity"],0);e.yAlign?this.set(["tooltip","yAlign"],e.yAlign):this.set(["tooltip","yAlign"],"no-transform");const t=e.title&&e.title[0]||"";this.set(["tooltip","title"],t);const a=e.body.map(e=>e.lines);e.body&&this.set(["tooltip","lines"],a.map((t,a)=>{const i=e.labelColors[a];return{color:i.borderColor,bgColor:i.backgroundColor,text:t.join("\n")}}));const i=this.$.chartTarget.clientWidth;let r=e.caretX;const s=this._chart.canvas.offsetTop+e.caretY;e.caretX+100>i?r=i-100:e.caretX<100&&(r=100),r+=this._chart.canvas.offsetLeft,this.tooltip=Object.assign({},this.tooltip,{opacity:1,left:`${r}px`,top:`${s}px`})}_legendClick(e){(e=e||window.event).stopPropagation();let t=e.target||e.srcElement;for(;"LI"!==t.nodeName;)t=t.parentElement;const a=e.model.itemsIndex,i=this._chart.getDatasetMeta(a);i.hidden=null===i.hidden?!this._chart.data.datasets[a].hidden:null,this.set(["metas",a,"hidden"],this._chart.isDatasetVisible(a)?null:"hidden"),this._chart.update()}_drawLegend(){const e=this._chart,t=this._oldIdentifier&&this.identifier===this._oldIdentifier;this._oldIdentifier=this.identifier,this.set("metas",this._chart.data.datasets.map((a,i)=>({label:a.label,color:a.color,bgColor:a.backgroundColor,hidden:t&&i<this.metas.length?this.metas[i].hidden:!e.isDatasetVisible(i)})));let a=!1;if(t)for(let t=0;t<this.metas.length;t++){const i=e.getDatasetMeta(t);!!i.hidden!=!!this.metas[t].hidden&&(a=!0),i.hidden=!!this.metas[t].hidden||null}a&&e.update(),this.unit=this.data.unit}_formatTickValue(e,t,a){if(0===a.length)return e;const i=new Date(a[t].value);return Object(c.a)(i)}drawChart(){const e=this.data.data,t=this.$.chartCanvas;if(e.datasets&&e.datasets.length||this._chart){if("timeline"!==this.data.type&&e.datasets.length>0){const t=e.datasets.length,a=this.constructor.getColorList(t);for(let i=0;i<t;i++)e.datasets[i].borderColor=a[i].rgbString(),e.datasets[i].backgroundColor=a[i].alpha(.6).rgbaString()}if(this._chart)this._customTooltips({opacity:0}),this._chart.data=e,this._chart.update({duration:0}),this.isTimeline?this._chart.options.scales.yAxes[0].gridLines.display=e.length>1:!0===this.data.legend&&this._drawLegend(),this.resizeChart();else{if(!e.datasets)return;this._customTooltips({opacity:0});const a=[{afterRender:()=>this._setRendered(!0)}];let i={responsive:!0,maintainAspectRatio:!1,animation:{duration:0},hover:{animationDuration:0},responsiveAnimationDuration:0,tooltips:{enabled:!1,custom:this._customTooltips.bind(this)},legend:{display:!1},line:{spanGaps:!0},elements:{font:"12px 'Roboto', 'sans-serif'"},ticks:{fontFamily:"'Roboto', 'sans-serif'"}};(i=Chart.helpers.merge(i,this.data.options)).scales.xAxes[0].ticks.callback=this._formatTickValue,"timeline"===this.data.type?(this.set("isTimeline",!0),void 0!==this.data.colors&&(this._colorFunc=this.constructor.getColorGenerator(this.data.colors.staticColors,this.data.colors.staticColorIndex)),void 0!==this._colorFunc&&(i.elements.colorFunction=this._colorFunc),1===e.datasets.length&&(i.scales.yAxes[0].ticks?i.scales.yAxes[0].ticks.display=!1:i.scales.yAxes[0].ticks={display:!1},i.scales.yAxes[0].gridLines?i.scales.yAxes[0].gridLines.display=!1:i.scales.yAxes[0].gridLines={display:!1}),this.$.chartTarget.style.height="50px"):this.$.chartTarget.style.height="160px";const r={type:this.data.type,data:this.data.data,options:i,plugins:a};this._chart=new this.ChartClass(t,r),!0!==this.isTimeline&&!0===this.data.legend&&this._drawLegend(),this.resizeChart()}}}resizeChart(){this._chart&&(void 0!==this._resizeTimer?(clearInterval(this._resizeTimer),this._resizeTimer=void 0,this._resizeChart()):this._resizeTimer=setInterval(this.resizeChart.bind(this),10))}_resizeChart(){const e=this.$.chartTarget,t=this.data.data;if(0===t.datasets.length)return;if(!this.isTimeline)return void this._chart.resize();const a=this._chart.chartArea.top,i=this._chart.chartArea.bottom,r=this._chart.canvas.clientHeight;if(i>0&&(this._axisHeight=r-i+a),!this._axisHeight)return e.style.height="50px",this._chart.resize(),void this.resizeChart();if(this._axisHeight){const a=30*t.datasets.length+this._axisHeight+"px";e.style.height!==a&&(e.style.height=a),this._chart.resize()}}static getColorList(e){let t=!1;e>10&&(t=!0,e=Math.ceil(e/2));const a=360/e,i=[];for(let r=0;r<e;r++)i[r]=Color().hsl(a*r,80,38),t&&(i[r+e]=Color().hsl(a*r,80,62));return i}static getColorGenerator(e,t){const a=["ff0029","66a61e","377eb8","984ea3","00d2d5","ff7f00","af8d00","7f80cd","b3e900","c42e60","a65628","f781bf","8dd3c7","bebada","fb8072","80b1d3","fdb462","fccde5","bc80bd","ffed6f","c4eaff","cf8c00","1b9e77","d95f02","e7298a","e6ab02","a6761d","0097ff","00d067","f43600","4ba93b","5779bb","927acc","97ee3f","bf3947","9f5b00","f48758","8caed6","f2b94f","eff26e","e43872","d9b100","9d7a00","698cff","d9d9d9","00d27e","d06800","009f82","c49200","cbe8ff","fecddf","c27eb6","8cd2ce","c4b8d9","f883b0","a49100","f48800","27d0df","a04a9b"];function i(e){return Color("#"+a[e%a.length])}const r={};let s=0;return t>0&&(s=t),e&&Object.keys(e).forEach(t=>{const a=e[t];isFinite(a)?r[t.toLowerCase()]=i(a):r[t.toLowerCase()]=Color(e[t])}),function(e,t){let a;const n=t[3];if(null===n)return Color().hsl(0,40,38);if(void 0===n)return Color().hsl(120,40,38);const o=n.toLowerCase();return void 0===a&&(a=r[o]),void 0===a&&(a=i(s),s++,r[o]=a),a}}});var p=a(110),u=a(190);customElements.define("state-history-chart-line",class extends(Object(p.a)(r.a)){static get template(){return i.a`
      <style>
        :host {
          display: block;
          overflow: hidden;
          height: 0;
          transition: height 0.3s ease-in-out;
        }
      </style>
      <ha-chart-base
        id="chart"
        data="[[chartData]]"
        identifier="[[identifier]]"
        rendered="{{rendered}}"
      ></ha-chart-base>
    `}static get properties(){return{chartData:Object,data:Object,names:Object,unit:String,identifier:String,isSingleDevice:{type:Boolean,value:!1},endTime:Object,rendered:{type:Boolean,value:!1,observer:"_onRenderedChanged"}}}static get observers(){return["dataChanged(data, endTime, isSingleDevice)"]}connectedCallback(){super.connectedCallback(),this._isAttached=!0,this.drawChart()}dataChanged(){this.drawChart()}_onRenderedChanged(e){e&&this.animateHeight()}animateHeight(){requestAnimationFrame(()=>requestAnimationFrame(()=>{this.style.height=this.$.chart.scrollHeight+"px"}))}drawChart(){const e=this.unit,t=this.data,a=[];let i;if(!this._isAttached)return;if(0===t.length)return;function r(e){const t=parseFloat(e);return isFinite(t)?t:null}(i=this.endTime||new Date(Math.max.apply(null,t.map(e=>new Date(e.states[e.states.length-1].last_changed)))))>new Date&&(i=new Date);const s=this.names||{};t.forEach(t=>{const n=t.domain,o=s[t.entity_id]||t.name;let l;const c=[];function d(e,t){t&&(e>i||(c.forEach((a,i)=>{a.data.push({x:e,y:t[i]})}),l=t))}function p(t,a,i){let r=!1,s=!1;i&&(r="origin"),a&&(s="before"),c.push({label:t,fill:r,steppedLine:s,pointRadius:0,data:[],unitText:e})}if("thermostat"===n||"climate"===n||"water_heater"===n){const e=t.states.some(e=>e.attributes&&e.attributes.target_temp_high!==e.attributes.target_temp_low),a=t.states.some(e=>"heat"===e.state),i=t.states.some(e=>"cool"===e.state);p(o+" current temperature",!0),a&&p(o+" heating",!0,!0),i&&p(o+" cooling",!0,!0),e?(p(o+" target temperature high",!0),p(o+" target temperature low",!0)):p(o+" target temperature",!0),t.states.forEach(t=>{if(!t.attributes)return;const s=r(t.attributes.current_temperature),n=[s];if(a&&n.push("heat"===t.state?s:null),i&&n.push("cool"===t.state?s:null),e){const e=r(t.attributes.target_temp_high),a=r(t.attributes.target_temp_low);n.push(e,a),d(new Date(t.last_changed),n)}else{const e=r(t.attributes.temperature);n.push(e),d(new Date(t.last_changed),n)}})}else{p(o,"sensor"===n);let e=null,a=null,i=null;t.states.forEach(t=>{const s=r(t.state),n=new Date(t.last_changed);if(null!==s&&null!==i){const t=n.getTime(),r=i.getTime(),o=a.getTime();d(i,[(r-o)/(t-o)*(s-e)+e]),d(new Date(r+1),[null]),d(n,[s]),a=n,e=s,i=null}else null!==s&&null===i?(d(n,[s]),a=n,e=s):null===s&&null===i&&null!==e&&(i=n)})}d(i,l),Array.prototype.push.apply(a,c)});const n={type:"line",unit:e,legend:!this.isSingleDevice,options:{scales:{xAxes:[{type:"time",ticks:{major:{fontStyle:"bold"}}}],yAxes:[{ticks:{maxTicksLimit:7}}]},tooltips:{mode:"neareach",callbacks:{title:(e,t)=>{const a=e[0],i=t.datasets[a.datasetIndex].data[a.index].x;return Object(u.a)(i,this.hass.language)}}},hover:{mode:"neareach"},layout:{padding:{top:5}},elements:{line:{tension:.1,pointRadius:0,borderWidth:1.5},point:{hitRadius:5}},plugins:{filler:{propagate:!0}}},data:{labels:[],datasets:a}};this.chartData=n}});var h=a(100);customElements.define("state-history-chart-timeline",class extends(Object(p.a)(r.a)){static get template(){return i.a`
      <style>
        :host {
          display: block;
          opacity: 0;
          transition: opacity 0.3s ease-in-out;
        }
        :host([rendered]) {
          opacity: 1;
        }

        ha-chart-base {
          direction: ltr;
        }
      </style>
      <ha-chart-base
        data="[[chartData]]"
        rendered="{{rendered}}"
        rtl="{{rtl}}"
      ></ha-chart-base>
    `}static get properties(){return{hass:{type:Object},chartData:Object,data:{type:Object,observer:"dataChanged"},names:Object,noSingle:Boolean,endTime:Date,rendered:{type:Boolean,value:!1,reflectToAttribute:!0},rtl:{reflectToAttribute:!0,computed:"_computeRTL(hass)"}}}static get observers(){return["dataChanged(data, endTime, localize, language)"]}connectedCallback(){super.connectedCallback(),this._isAttached=!0,this.drawChart()}dataChanged(){this.drawChart()}drawChart(){let e=this.data;if(!this._isAttached)return;e||(e=[]);const t=new Date(e.reduce((e,t)=>Math.min(e,new Date(t.data[0].last_changed)),new Date));let a=this.endTime||new Date(e.reduce((e,t)=>Math.max(e,new Date(t.data[t.data.length-1].last_changed)),t));a>new Date&&(a=new Date);const i=[],r=[],s=this.names||{};e.forEach(e=>{let n,o=null,l=null,c=t;const d=s[e.entity_id]||e.name,p=[];e.data.forEach(e=>{let t=e.state;void 0!==t&&""!==t||(t=null),new Date(e.last_changed)>a||(null!==o&&t!==o?(n=new Date(e.last_changed),p.push([c,n,l,o]),o=t,l=e.state_localize,c=n):null===o&&(o=t,l=e.state_localize,c=new Date(e.last_changed)))}),null!==o&&p.push([c,a,l,o]),r.push({data:p}),i.push(d)});const n={type:"timeline",options:{tooltips:{callbacks:{label:(e,t)=>{const a=t.datasets[e.datasetIndex].data[e.index],i=Object(u.a)(a[0],this.hass.language),r=Object(u.a)(a[1],this.hass.language);return[a[2],i,r]}}},scales:{xAxes:[{ticks:{major:{fontStyle:"bold"}}}],yAxes:[{afterSetDimensions:e=>{e.maxWidth=.18*e.chart.width},position:this._computeRTL?"right":"left"}]}},data:{labels:i,datasets:r},colors:{staticColors:{on:1,off:0,unavailable:"#a0a0a0",unknown:"#606060",idle:2},staticColorIndex:3}};this.chartData=n}_computeRTL(e){return Object(h.a)(e)}});customElements.define("state-history-charts",class extends(Object(p.a)(r.a)){static get template(){return i.a`
      <style>
        :host {
          display: block;
          /* height of single timeline chart = 58px */
          min-height: 58px;
        }
        .info {
          text-align: center;
          line-height: 58px;
          color: var(--secondary-text-color);
        }
      </style>
      <template
        is="dom-if"
        class="info"
        if="[[_computeIsLoading(isLoadingData)]]"
      >
        <div class="info">
          [[localize('ui.components.history_charts.loading_history')]]
        </div>
      </template>

      <template
        is="dom-if"
        class="info"
        if="[[_computeIsEmpty(isLoadingData, historyData)]]"
      >
        <div class="info">
          [[localize('ui.components.history_charts.no_history_found')]]
        </div>
      </template>

      <template is="dom-if" if="[[historyData.timeline.length]]">
        <state-history-chart-timeline
          hass="[[hass]]"
          data="[[historyData.timeline]]"
          end-time="[[_computeEndTime(endTime, upToNow, historyData)]]"
          no-single="[[noSingle]]"
          names="[[names]]"
        ></state-history-chart-timeline>
      </template>

      <template is="dom-repeat" items="[[historyData.line]]">
        <state-history-chart-line
          hass="[[hass]]"
          unit="[[item.unit]]"
          data="[[item.data]]"
          identifier="[[item.identifier]]"
          is-single-device="[[_computeIsSingleLineChart(item.data, noSingle)]]"
          end-time="[[_computeEndTime(endTime, upToNow, historyData)]]"
          names="[[names]]"
        ></state-history-chart-line>
      </template>
    `}static get properties(){return{hass:Object,historyData:{type:Object,value:null},names:Object,isLoadingData:Boolean,endTime:{type:Object},upToNow:Boolean,noSingle:Boolean}}_computeIsSingleLineChart(e,t){return!t&&e&&1===e.length}_computeIsEmpty(e,t){const a=!t||!t.timeline||!t.line||0===t.timeline.length&&0===t.line.length;return!e&&a}_computeIsLoading(e){return e&&!this.historyData}_computeEndTime(e,t){return t?new Date:e}})},243:function(e,t,a){"use strict";var i=a(11),r=a(19),s=a(24),n=a(110),o=a(219);const l={},c={},d=(e,t,a,i,r,s)=>{const n=t,c=l[n];if(c&&Date.now()-c.created<6e4&&c.language===s)return c.data;const d=Object(o.c)(e,t,a,i).then(t=>Object(o.a)(e,t,r,s),e=>{throw delete l[t],e});return l[n]={created:Date.now(),language:s,data:d},d};const p=(e,t,a,i,r)=>{const s=a.cacheKey,n=new Date,l=new Date(n);l.setHours(l.getHours()-a.hoursToShow);let d=l,p=!1,m=c[s];if(m&&d>=m.startTime&&d<=m.endTime&&m.language===r){if(d=m.endTime,p=!0,n<=m.endTime)return m.prom}else m=c[s]=function(e,t,a){return{prom:Promise.resolve({line:[],timeline:[]}),language:e,startTime:t,endTime:a,data:{line:[],timeline:[]}}}(r,l,n);const f=m.prom;return m.prom=(async()=>{let a;try{a=(await Promise.all([f,Object(o.c)(e,t,d,n,p)]))[1]}catch(e){throw delete c[s],e}const g=Object(o.a)(e,a,i,r);return p?(u(g.line,m.data.line),h(g.timeline,m.data.timeline),b(l,m.data)):m.data=g,m.data})(),m.startTime=l,m.endTime=n,m.prom},u=(e,t)=>{e.forEach(e=>{const a=e.unit,i=t.find(e=>e.unit===a);i?e.data.forEach(e=>{const t=i.data.find(t=>e.entity_id===t.entity_id);t?t.states=t.states.concat(e.states):i.data.push(e)}):t.push(e)})},h=(e,t)=>{e.forEach(e=>{const a=t.find(t=>t.entity_id===e.entity_id);a?a.data=a.data.concat(e.data):t.push(e)})},m=(e,t)=>{if(0===t.length)return t;const a=t.findIndex(t=>new Date(t.last_changed)>e);if(0===a)return t;const i=-1===a?t.length-1:a-1;return t[i].last_changed=e,t.slice(i)},b=(e,t)=>{t.line.forEach(t=>{t.data.forEach(t=>{t.states=m(e,t.states)})}),t.timeline.forEach(t=>{t.data=m(e,t.data)})};customElements.define("ha-state-history-data",class extends(Object(n.a)(s.a)){static get properties(){return{hass:{type:Object,observer:"hassChanged"},filterType:String,cacheConfig:Object,startTime:Date,endTime:Date,entityId:String,isLoading:{type:Boolean,value:!0,readOnly:!0,notify:!0},data:{type:Object,value:null,readOnly:!0,notify:!0}}}static get observers(){return["filterChangedDebouncer(filterType, entityId, startTime, endTime, cacheConfig, localize)"]}connectedCallback(){super.connectedCallback(),this.filterChangedDebouncer(this.filterType,this.entityId,this.startTime,this.endTime,this.cacheConfig,this.localize)}disconnectedCallback(){this._refreshTimeoutId&&(window.clearInterval(this._refreshTimeoutId),this._refreshTimeoutId=null),super.disconnectedCallback()}hassChanged(e,t){t||this._madeFirstCall||this.filterChangedDebouncer(this.filterType,this.entityId,this.startTime,this.endTime,this.cacheConfig,this.localize)}filterChangedDebouncer(...e){this._debounceFilterChanged=r.a.debounce(this._debounceFilterChanged,i.d.after(0),()=>{this.filterChanged(...e)})}filterChanged(e,t,a,i,r,s){if(!this.hass)return;if(r&&!r.cacheKey)return;if(!s)return;this._madeFirstCall=!0;const n=this.hass.language;let l;if("date"===e){if(!a||!i)return;l=Object(o.b)(this.hass,a,i).then(e=>Object(o.a)(this.hass,e,s,n))}else{if("recent-entity"!==e)return;if(!t)return;l=r?this.getRecentWithCacheRefresh(t,r,s,n):d(this.hass,t,a,i,s,n)}this._setIsLoading(!0),l.then(e=>{this._setData(e),this._setIsLoading(!1)})}getRecentWithCacheRefresh(e,t,a,i){return this._refreshTimeoutId&&(window.clearInterval(this._refreshTimeoutId),this._refreshTimeoutId=null),t.refresh&&(this._refreshTimeoutId=window.setInterval(()=>{p(this.hass,e,t,a,i).then(e=>{this._setData(Object.assign({},e))})},1e3*t.refresh)),p(this.hass,e,t,a,i)}})},244:function(e,t,a){"use strict";function i(e){let t=function(e){const t=e.split(":").map(Number);return 3600*t[0]+60*t[1]+t[2]}(e.attributes.remaining);if("active"===e.state){const a=(new Date).getTime(),i=new Date(e.last_changed).getTime();t=Math.max(t-(a-i)/1e3,0)}return t}a.d(t,"a",function(){return i})},247:function(e,t,a){"use strict";function i(e,t,a){const i=e;let r;i.lastChild&&i.lastChild.tagName===t?r=i.lastChild:(i.lastChild&&i.removeChild(i.lastChild),r=document.createElement(t.toLowerCase())),r.setProperties?r.setProperties(a):Object.keys(a).forEach(e=>{r[e]=a[e]}),null===r.parentNode&&i.appendChild(r)}a.d(t,"a",function(){return i})},253:function(e,t,a){"use strict";a.d(t,"a",function(){return s});const i=[60,60,24,7],r=["second","minute","hour","day"];function s(e,t,a={}){let s=((a.compareTime||new Date).getTime()-e.getTime())/1e3;const n=s>=0?"past":"future";let o;s=Math.abs(s);for(let e=0;e<i.length;e++){if(s<i[e]){s=Math.floor(s),o=t(`ui.components.relative_time.duration.${r[e]}`,"count",s);break}s/=i[e]}return void 0===o&&(o=t("ui.components.relative_time.duration.week","count",s=Math.floor(s))),!1===a.includeTense?o:t(`ui.components.relative_time.${n}`,"time",o)}},254:function(e,t,a){"use strict";var i=a(5),r=a(64);a(167);customElements.define("ha-label-badge",class extends i.a{constructor(...e){super(...e),this.value=void 0,this.icon=void 0,this.label=void 0,this.description=void 0,this.image=void 0}static get properties(){return{value:{},icon:{},label:{},description:{},image:{}}}render(){return i.e`
      <div class="badge-container">
        <div class="label-badge" id="badge">
          <div
            class="${Object(r.a)({value:!0,big:Boolean(this.value&&this.value.length>4)})}"
          >
            ${!this.icon||this.value||this.image?"":i.e`
                  <ha-icon .icon="${this.icon}"></ha-icon>
                `}
            ${this.value&&!this.image?i.e`
                  <span>${this.value}</span>
                `:""}
          </div>
          ${this.label?i.e`
                <div
                  class="${Object(r.a)({label:!0,big:this.label.length>5})}"
                >
                  <span>${this.label}</span>
                </div>
              `:""}
        </div>
        ${this.description?i.e`
              <div class="title">${this.description}</div>
            `:""}
      </div>
    `}static get styles(){return[i.c`
        .badge-container {
          display: inline-block;
          text-align: center;
          vertical-align: top;
        }
        .label-badge {
          position: relative;
          display: block;
          margin: 0 auto;
          width: var(--ha-label-badge-size, 2.5em);
          text-align: center;
          height: var(--ha-label-badge-size, 2.5em);
          line-height: var(--ha-label-badge-size, 2.5em);
          font-size: var(--ha-label-badge-font-size, 1.5em);
          border-radius: 50%;
          border: 0.1em solid var(--ha-label-badge-color, var(--primary-color));
          color: var(--label-badge-text-color, rgb(76, 76, 76));

          white-space: nowrap;
          background-color: var(--label-badge-background-color, white);
          background-size: cover;
          transition: border 0.3s ease-in-out;
        }
        .label-badge .value {
          font-size: 90%;
          overflow: hidden;
          text-overflow: ellipsis;
        }
        .label-badge .value.big {
          font-size: 70%;
        }
        .label-badge .label {
          position: absolute;
          bottom: -1em;
          /* Make the label as wide as container+border. (parent_borderwidth / font-size) */
          left: -0.2em;
          right: -0.2em;
          line-height: 1em;
          font-size: 0.5em;
        }
        .label-badge .label span {
          box-sizing: border-box;
          max-width: 100%;
          display: inline-block;
          background-color: var(--ha-label-badge-color, var(--primary-color));
          color: var(--ha-label-badge-label-color, white);
          border-radius: 1em;
          padding: 9% 16% 8% 16%; /* mostly apitalized text, not much descenders => bit more top margin */
          font-weight: 500;
          overflow: hidden;
          text-transform: uppercase;
          text-overflow: ellipsis;
          transition: background-color 0.3s ease-in-out;
          text-transform: var(--ha-label-badge-label-text-transform, uppercase);
        }
        .label-badge .label.big span {
          font-size: 90%;
          padding: 10% 12% 7% 12%; /* push smaller text a bit down to center vertically */
        }
        .badge-container .title {
          margin-top: 1em;
          font-size: var(--ha-label-badge-title-font-size, 0.9em);
          width: var(--ha-label-badge-title-width, 5em);
          font-weight: var(--ha-label-badge-title-font-weight, 400);
          overflow: hidden;
          text-overflow: ellipsis;
          line-height: normal;
        }
      `]}updated(e){super.updated(e),e.has("image")&&(this.shadowRoot.getElementById("badge").style.backgroundImage=this.image?`url(${this.image})`:"")}})},255:function(e,t,a){"use strict";a(164),a(104);var i=a(3),r=a(24),s=a(215);customElements.define("ha-cover-tilt-controls",class extends r.a{static get template(){return i.a`
      <style include="iron-flex"></style>
      <style>
        :host {
          white-space: nowrap;
        }
        [invisible] {
          visibility: hidden !important;
        }
      </style>
      <paper-icon-button
        icon="hass:arrow-top-right"
        on-click="onOpenTiltTap"
        title="Open tilt"
        invisible$="[[!entityObj.supportsOpenTilt]]"
        disabled="[[computeOpenDisabled(stateObj, entityObj)]]"
      ></paper-icon-button>
      <paper-icon-button
        icon="hass:stop"
        on-click="onStopTiltTap"
        invisible$="[[!entityObj.supportsStopTilt]]"
        title="Stop tilt"
      ></paper-icon-button>
      <paper-icon-button
        icon="hass:arrow-bottom-left"
        on-click="onCloseTiltTap"
        title="Close tilt"
        invisible$="[[!entityObj.supportsCloseTilt]]"
        disabled="[[computeClosedDisabled(stateObj, entityObj)]]"
      ></paper-icon-button>
    `}static get properties(){return{hass:{type:Object},stateObj:{type:Object},entityObj:{type:Object,computed:"computeEntityObj(hass, stateObj)"}}}computeEntityObj(e,t){return new s.a(e,t)}computeOpenDisabled(e,t){var a=!0===e.attributes.assumed_state;return t.isFullyOpenTilt&&!a}computeClosedDisabled(e,t){var a=!0===e.attributes.assumed_state;return t.isFullyClosedTilt&&!a}onOpenTiltTap(e){e.stopPropagation(),this.entityObj.openCoverTilt()}onCloseTiltTap(e){e.stopPropagation(),this.entityObj.closeCoverTilt()}onStopTiltTap(e){e.stopPropagation(),this.entityObj.stopCoverTilt()}})},256:function(e,t,a){"use strict";a.d(t,"a",function(){return i});const i=async(e,t,a,i,r,...s)=>{let n=i[e];n||(n=i[e]={});const o=n[r];if(o)return o;const l=a(i,r,...s);return n[r]=l,l.then(()=>setTimeout(()=>{n[r]=void 0},t),()=>{n[r]=void 0}),l}},259:function(e,t,a){"use strict";a(2),a(40),a(99),a(104),a(54),a(76);var i=a(3);const r=i.a`<iron-iconset-svg name="paper-tabs" size="24">
<svg><defs>
<g id="chevron-left"><path d="M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z"></path></g>
<g id="chevron-right"><path d="M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z"></path></g>
</defs></svg>
</iron-iconset-svg>`;document.head.appendChild(r.content);a(228);var s=a(115),n=a(231),o=a(88),l=a(4),c=a(0);Object(l.a)({_template:i.a`
    <style>
      :host {
        @apply --layout;
        @apply --layout-center;

        height: 48px;
        font-size: 14px;
        font-weight: 500;
        overflow: hidden;
        -moz-user-select: none;
        -ms-user-select: none;
        -webkit-user-select: none;
        user-select: none;

        /* NOTE: Both values are needed, since some phones require the value to be \`transparent\`. */
        -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
        -webkit-tap-highlight-color: transparent;

        @apply --paper-tabs;
      }

      :host(:dir(rtl)) {
        @apply --layout-horizontal-reverse;
      }

      #tabsContainer {
        position: relative;
        height: 100%;
        white-space: nowrap;
        overflow: hidden;
        @apply --layout-flex-auto;
        @apply --paper-tabs-container;
      }

      #tabsContent {
        height: 100%;
        -moz-flex-basis: auto;
        -ms-flex-basis: auto;
        flex-basis: auto;
        @apply --paper-tabs-content;
      }

      #tabsContent.scrollable {
        position: absolute;
        white-space: nowrap;
      }

      #tabsContent:not(.scrollable),
      #tabsContent.scrollable.fit-container {
        @apply --layout-horizontal;
      }

      #tabsContent.scrollable.fit-container {
        min-width: 100%;
      }

      #tabsContent.scrollable.fit-container > ::slotted(*) {
        /* IE - prevent tabs from compressing when they should scroll. */
        -ms-flex: 1 0 auto;
        -webkit-flex: 1 0 auto;
        flex: 1 0 auto;
      }

      .hidden {
        display: none;
      }

      .not-visible {
        opacity: 0;
        cursor: default;
      }

      paper-icon-button {
        width: 48px;
        height: 48px;
        padding: 12px;
        margin: 0 4px;
      }

      #selectionBar {
        position: absolute;
        height: 0;
        bottom: 0;
        left: 0;
        right: 0;
        border-bottom: 2px solid var(--paper-tabs-selection-bar-color, var(--paper-yellow-a100));
          -webkit-transform: scale(0);
        transform: scale(0);
          -webkit-transform-origin: left center;
        transform-origin: left center;
          transition: -webkit-transform;
        transition: transform;

        @apply --paper-tabs-selection-bar;
      }

      #selectionBar.align-bottom {
        top: 0;
        bottom: auto;
      }

      #selectionBar.expand {
        transition-duration: 0.15s;
        transition-timing-function: cubic-bezier(0.4, 0.0, 1, 1);
      }

      #selectionBar.contract {
        transition-duration: 0.18s;
        transition-timing-function: cubic-bezier(0.0, 0.0, 0.2, 1);
      }

      #tabsContent > ::slotted(:not(#selectionBar)) {
        height: 100%;
      }
    </style>

    <paper-icon-button icon="paper-tabs:chevron-left" class\$="[[_computeScrollButtonClass(_leftHidden, scrollable, hideScrollButtons)]]" on-up="_onScrollButtonUp" on-down="_onLeftScrollButtonDown" tabindex="-1"></paper-icon-button>

    <div id="tabsContainer" on-track="_scroll" on-down="_down">
      <div id="tabsContent" class\$="[[_computeTabsContentClass(scrollable, fitContainer)]]">
        <div id="selectionBar" class\$="[[_computeSelectionBarClass(noBar, alignBottom)]]" on-transitionend="_onBarTransitionEnd"></div>
        <slot></slot>
      </div>
    </div>

    <paper-icon-button icon="paper-tabs:chevron-right" class\$="[[_computeScrollButtonClass(_rightHidden, scrollable, hideScrollButtons)]]" on-up="_onScrollButtonUp" on-down="_onRightScrollButtonDown" tabindex="-1"></paper-icon-button>
`,is:"paper-tabs",behaviors:[o.a,n.a],properties:{noink:{type:Boolean,value:!1,observer:"_noinkChanged"},noBar:{type:Boolean,value:!1},noSlide:{type:Boolean,value:!1},scrollable:{type:Boolean,value:!1},fitContainer:{type:Boolean,value:!1},disableDrag:{type:Boolean,value:!1},hideScrollButtons:{type:Boolean,value:!1},alignBottom:{type:Boolean,value:!1},selectable:{type:String,value:"paper-tab"},autoselect:{type:Boolean,value:!1},autoselectDelay:{type:Number,value:0},_step:{type:Number,value:10},_holdDelay:{type:Number,value:1},_leftHidden:{type:Boolean,value:!1},_rightHidden:{type:Boolean,value:!1},_previousTab:{type:Object}},hostAttributes:{role:"tablist"},listeners:{"iron-resize":"_onTabSizingChanged","iron-items-changed":"_onTabSizingChanged","iron-select":"_onIronSelect","iron-deselect":"_onIronDeselect"},keyBindings:{"left:keyup right:keyup":"_onArrowKeyup"},created:function(){this._holdJob=null,this._pendingActivationItem=void 0,this._pendingActivationTimeout=void 0,this._bindDelayedActivationHandler=this._delayedActivationHandler.bind(this),this.addEventListener("blur",this._onBlurCapture.bind(this),!0)},ready:function(){this.setScrollDirection("y",this.$.tabsContainer)},detached:function(){this._cancelPendingActivation()},_noinkChanged:function(e){Object(c.b)(this).querySelectorAll("paper-tab").forEach(e?this._setNoinkAttribute:this._removeNoinkAttribute)},_setNoinkAttribute:function(e){e.setAttribute("noink","")},_removeNoinkAttribute:function(e){e.removeAttribute("noink")},_computeScrollButtonClass:function(e,t,a){return!t||a?"hidden":e?"not-visible":""},_computeTabsContentClass:function(e,t){return e?"scrollable"+(t?" fit-container":""):" fit-container"},_computeSelectionBarClass:function(e,t){return e?"hidden":t?"align-bottom":""},_onTabSizingChanged:function(){this.debounce("_onTabSizingChanged",function(){this._scroll(),this._tabChanged(this.selectedItem)},10)},_onIronSelect:function(e){this._tabChanged(e.detail.item,this._previousTab),this._previousTab=e.detail.item,this.cancelDebouncer("tab-changed")},_onIronDeselect:function(e){this.debounce("tab-changed",function(){this._tabChanged(null,this._previousTab),this._previousTab=null},1)},_activateHandler:function(){this._cancelPendingActivation(),s.b._activateHandler.apply(this,arguments)},_scheduleActivation:function(e,t){this._pendingActivationItem=e,this._pendingActivationTimeout=this.async(this._bindDelayedActivationHandler,t)},_delayedActivationHandler:function(){var e=this._pendingActivationItem;this._pendingActivationItem=void 0,this._pendingActivationTimeout=void 0,e.fire(this.activateEvent,null,{bubbles:!0,cancelable:!0})},_cancelPendingActivation:function(){void 0!==this._pendingActivationTimeout&&(this.cancelAsync(this._pendingActivationTimeout),this._pendingActivationItem=void 0,this._pendingActivationTimeout=void 0)},_onArrowKeyup:function(e){this.autoselect&&this._scheduleActivation(this.focusedItem,this.autoselectDelay)},_onBlurCapture:function(e){e.target===this._pendingActivationItem&&this._cancelPendingActivation()},get _tabContainerScrollSize(){return Math.max(0,this.$.tabsContainer.scrollWidth-this.$.tabsContainer.offsetWidth)},_scroll:function(e,t){if(this.scrollable){var a=t&&-t.ddx||0;this._affectScroll(a)}},_down:function(e){this.async(function(){this._defaultFocusAsync&&(this.cancelAsync(this._defaultFocusAsync),this._defaultFocusAsync=null)},1)},_affectScroll:function(e){this.$.tabsContainer.scrollLeft+=e;var t=this.$.tabsContainer.scrollLeft;this._leftHidden=0===t,this._rightHidden=t===this._tabContainerScrollSize},_onLeftScrollButtonDown:function(){this._scrollToLeft(),this._holdJob=setInterval(this._scrollToLeft.bind(this),this._holdDelay)},_onRightScrollButtonDown:function(){this._scrollToRight(),this._holdJob=setInterval(this._scrollToRight.bind(this),this._holdDelay)},_onScrollButtonUp:function(){clearInterval(this._holdJob),this._holdJob=null},_scrollToLeft:function(){this._affectScroll(-this._step)},_scrollToRight:function(){this._affectScroll(this._step)},_tabChanged:function(e,t){if(!e)return this.$.selectionBar.classList.remove("expand"),this.$.selectionBar.classList.remove("contract"),void this._positionBar(0,0);var a=this.$.tabsContent.getBoundingClientRect(),i=a.width,r=e.getBoundingClientRect(),s=r.left-a.left;if(this._pos={width:this._calcPercent(r.width,i),left:this._calcPercent(s,i)},this.noSlide||null==t)return this.$.selectionBar.classList.remove("expand"),this.$.selectionBar.classList.remove("contract"),void this._positionBar(this._pos.width,this._pos.left);var n=t.getBoundingClientRect(),o=this.items.indexOf(t),l=this.items.indexOf(e);this.$.selectionBar.classList.add("expand");var c=o<l;this._isRTL&&(c=!c),c?this._positionBar(this._calcPercent(r.left+r.width-n.left,i)-5,this._left):this._positionBar(this._calcPercent(n.left+n.width-r.left,i)-5,this._calcPercent(s,i)+5),this.scrollable&&this._scrollToSelectedIfNeeded(r.width,s)},_scrollToSelectedIfNeeded:function(e,t){var a=t-this.$.tabsContainer.scrollLeft;a<0?this.$.tabsContainer.scrollLeft+=a:(a+=e-this.$.tabsContainer.offsetWidth)>0&&(this.$.tabsContainer.scrollLeft+=a)},_calcPercent:function(e,t){return 100*e/t},_positionBar:function(e,t){e=e||0,t=t||0,this._width=e,this._left=t,this.transform("translateX("+t+"%) scaleX("+e/100+")",this.$.selectionBar)},_onBarTransitionEnd:function(e){var t=this.$.selectionBar.classList;t.contains("expand")?(t.remove("expand"),t.add("contract"),this._positionBar(this._pos.width,this._pos.left)):t.contains("contract")&&t.remove("contract")}})},265:function(e,t,a){"use strict";a(104);var i=a(3),r=a(24),s=a(84),n=a(201),o=a(53);customElements.define("ha-start-voice-button",class extends(Object(s.a)(r.a)){static get template(){return i.a`
      <paper-icon-button
        icon="hass:microphone"
        hidden$="[[!canListen]]"
        on-click="handleListenClick"
      ></paper-icon-button>
    `}static get properties(){return{hass:{type:Object,value:null},canListen:{type:Boolean,computed:"computeCanListen(hass)",notify:!0}}}computeCanListen(e){return"webkitSpeechRecognition"in window&&Object(n.a)(e,"conversation")}handleListenClick(){Object(o.a)(this,"show-dialog",{dialogImport:()=>a.e(135).then(a.bind(null,344)),dialogTag:"ha-voice-command-dialog"})}})},266:function(e,t,a){"use strict";var i=a(5),r=a(64),s=a(165),n=a(162),o=a(166),l=a(184),c=a(244),d=a(236),p=a(53);a(254);customElements.define("ha-state-label-badge",class extends i.a{constructor(...e){super(...e),this.hass=void 0,this.state=void 0,this._connected=void 0,this._updateRemaining=void 0,this._timerTimeRemaining=void 0}connectedCallback(){super.connectedCallback(),this._connected=!0,this.startInterval(this.state)}disconnectedCallback(){super.disconnectedCallback(),this._connected=!1,this.clearInterval()}render(){const e=this.state;if(!e)return i.e`
        ${this.renderStyle()}
        <ha-label-badge label="not found"></ha-label-badge>
      `;const t=Object(s.a)(e);return i.e`
      ${this.renderStyle()}
      <ha-label-badge
        class="${Object(r.a)({[t]:!0,"has-unit_of_measurement":"unit_of_measurement"in e.attributes})}"
        .value="${this._computeValue(t,e)}"
        .icon="${this._computeIcon(t,e)}"
        .image="${e.attributes.entity_picture}"
        .label="${this._computeLabel(t,e,this._timerTimeRemaining)}"
        .description="${Object(n.a)(e)}"
      ></ha-label-badge>
    `}static get properties(){return{hass:{},state:{},_timerTimeRemaining:{}}}firstUpdated(e){super.firstUpdated(e),this.addEventListener("click",e=>{e.stopPropagation(),this.state&&Object(p.a)(this,"hass-more-info",{entityId:this.state.entity_id})})}updated(e){super.updated(e),this._connected&&e.has("state")&&this.startInterval(this.state)}_computeValue(e,t){switch(e){case"binary_sensor":case"device_tracker":case"updater":case"sun":case"alarm_control_panel":case"timer":return null;case"sensor":default:return"unknown"===t.state?"-":this.hass.localize(`component.${e}.state.${t.state}`)||t.state}}_computeIcon(e,t){if("unavailable"===t.state)return null;switch(e){case"alarm_control_panel":return"pending"===t.state?"hass:clock-fast":"armed_away"===t.state?"hass:nature":"armed_home"===t.state?"hass:home-variant":"armed_night"===t.state?"hass:weather-night":"armed_custom_bypass"===t.state?"hass:shield-home":"triggered"===t.state?"hass:alert-circle":Object(o.a)(e,t.state);case"binary_sensor":case"device_tracker":case"updater":case"person":return Object(l.a)(t);case"sun":return"above_horizon"===t.state?Object(o.a)(e):"hass:brightness-3";case"timer":return"active"===t.state?"hass:timer":"hass:timer-off";default:return null}}_computeLabel(e,t,a){return"unavailable"===t.state||["device_tracker","alarm_control_panel","person"].includes(e)?this.hass.localize(`state_badge.${e}.${t.state}`)||this.hass.localize(`state_badge.default.${t.state}`)||t.state:"timer"===e?Object(d.a)(a):t.attributes.unit_of_measurement||null}clearInterval(){this._updateRemaining&&(clearInterval(this._updateRemaining),this._updateRemaining=void 0)}startInterval(e){this.clearInterval(),e&&"timer"===Object(s.a)(e)&&(this.calculateTimerRemaining(e),"active"===e.state&&(this._updateRemaining=window.setInterval(()=>this.calculateTimerRemaining(this.state),1e3)))}calculateTimerRemaining(e){this._timerTimeRemaining=Object(c.a)(e)}renderStyle(){return i.e`
      <style>
        :host {
          cursor: pointer;
        }

        ha-label-badge {
          --ha-label-badge-color: var(--label-badge-red, #df4c1e);
        }
        ha-label-badge.has-unit_of_measurement {
          --ha-label-badge-label-text-transform: none;
        }

        ha-label-badge.binary_sensor,
        ha-label-badge.updater {
          --ha-label-badge-color: var(--label-badge-blue, #039be5);
        }

        .red {
          --ha-label-badge-color: var(--label-badge-red, #df4c1e);
        }

        .blue {
          --ha-label-badge-color: var(--label-badge-blue, #039be5);
        }

        .green {
          --ha-label-badge-color: var(--label-badge-green, #0da035);
        }

        .yellow {
          --ha-label-badge-color: var(--label-badge-yellow, #f4b400);
        }

        .grey {
          --ha-label-badge-color: var(
            --label-badge-grey,
            var(--paper-grey-500)
          );
        }
      </style>
    `}})},267:function(e,t,a){"use strict";var i=a(3),r=a(24),s=a(110);customElements.define("ha-climate-state",class extends(Object(s.a)(r.a)){static get template(){return i.a`
      <style>
        :host {
          display: flex;
          flex-direction: column;
          justify-content: center;
          white-space: nowrap;
        }

        .target {
          color: var(--primary-text-color);
        }

        .current {
          color: var(--secondary-text-color);
        }

        .state-label {
          font-weight: bold;
          text-transform: capitalize;
        }
      </style>

      <div class="target">
        <template is="dom-if" if="[[_hasKnownState(stateObj.state)]]">
          <span class="state-label"> [[_localizeState(stateObj.state)]] </span>
        </template>
        [[computeTarget(hass, stateObj)]]
      </div>

      <template is="dom-if" if="[[currentStatus]]">
        <div class="current">
          [[localize('ui.card.climate.currently')]]: [[currentStatus]]
        </div>
      </template>
    `}static get properties(){return{hass:Object,stateObj:Object,currentStatus:{type:String,computed:"computeCurrentStatus(hass, stateObj)"}}}computeCurrentStatus(e,t){return e&&t?null!=t.attributes.current_temperature?`${t.attributes.current_temperature} ${e.config.unit_system.temperature}`:null!=t.attributes.current_humidity?`${t.attributes.current_humidity} %`:null:null}computeTarget(e,t){return e&&t?null!=t.attributes.target_temp_low&&null!=t.attributes.target_temp_high?`${t.attributes.target_temp_low} - ${t.attributes.target_temp_high} ${e.config.unit_system.temperature}`:null!=t.attributes.temperature?`${t.attributes.temperature} ${e.config.unit_system.temperature}`:null!=t.attributes.target_humidity_low&&null!=t.attributes.target_humidity_high?`${t.attributes.target_humidity_low} - ${t.attributes.target_humidity_high} %`:null!=t.attributes.humidity?`${t.attributes.humidity} %`:"":null}_hasKnownState(e){return"unknown"!==e}_localizeState(e){return this.localize(`state.climate.${e}`)||e}})},268:function(e,t,a){"use strict";a(104);var i=a(3),r=a(24),s=a(215);customElements.define("ha-cover-controls",class extends r.a{static get template(){return i.a`
      <style>
        .state {
          white-space: nowrap;
        }
        [invisible] {
          visibility: hidden !important;
        }
      </style>

      <div class="state">
        <paper-icon-button
          icon="hass:arrow-up"
          on-click="onOpenTap"
          invisible$="[[!entityObj.supportsOpen]]"
          disabled="[[computeOpenDisabled(stateObj, entityObj)]]"
        ></paper-icon-button>
        <paper-icon-button
          icon="hass:stop"
          on-click="onStopTap"
          invisible$="[[!entityObj.supportsStop]]"
        ></paper-icon-button>
        <paper-icon-button
          icon="hass:arrow-down"
          on-click="onCloseTap"
          invisible$="[[!entityObj.supportsClose]]"
          disabled="[[computeClosedDisabled(stateObj, entityObj)]]"
        ></paper-icon-button>
      </div>
    `}static get properties(){return{hass:{type:Object},stateObj:{type:Object},entityObj:{type:Object,computed:"computeEntityObj(hass, stateObj)"}}}computeEntityObj(e,t){return new s.a(e,t)}computeOpenDisabled(e,t){var a=!0===e.attributes.assumed_state;return(t.isFullyOpen||t.isOpening)&&!a}computeClosedDisabled(e,t){var a=!0===e.attributes.assumed_state;return(t.isFullyClosed||t.isClosing)&&!a}onOpenTap(e){e.stopPropagation(),this.entityObj.openCover()}onCloseTap(e){e.stopPropagation(),this.entityObj.closeCover()}onStopTap(e){e.stopPropagation(),this.entityObj.stopCover()}})},269:function(e,t,a){"use strict";a(144);const i=customElements.get("paper-slider");let r;customElements.define("ha-slider",class extends i{static get template(){return r||(r=i.template.cloneNode(!0)).content.querySelector("style").appendChild(document.createTextNode('\n          :host([dir="rtl"]) #sliderContainer.pin.expand > .slider-knob > .slider-knob-inner::after {\n            -webkit-transform: scale(1) translate(0, -17px) scaleX(-1) !important;\n            transform: scale(1) translate(0, -17px) scaleX(-1) !important;\n            }\n        ')),r}_calcStep(e){if(!this.step)return parseFloat(e);const t=Math.round((e-this.min)/this.step),a=this.step.toString(),i=a.indexOf(".");if(-1!==i){const e=10**(a.length-i-1);return Math.round((t*this.step+this.min)*e)/e}return t*this.step+this.min}})},270:function(e,t,a){"use strict";function i(e,t){const a={};return t.attributes.entity_id.forEach(t=>{const i=e[t];i&&(a[i.entity_id]=i)}),a}a.d(t,"a",function(){return i})},273:function(e,t,a){"use strict";var i=a(165),r=a(207);function s(e,t){const a=Object(i.a)(t);return"group"===a?"on"===t.state||"off"===t.state:"climate"===a?Object(r.a)(t,4096):function(e,t){const a=e.services[t];return!!a&&("lock"===t?"lock"in a:"cover"===t?"open_cover"in a:"turn_on"in a)}(e,a)}a.d(t,"a",function(){return s})},282:function(e,t,a){"use strict";a.d(t,"d",function(){return r}),a.d(t,"c",function(){return s}),a.d(t,"b",function(){return n}),a.d(t,"a",function(){return o}),a.d(t,"e",function(){return l});var i=a(256);const r=1,s=32,n=16384,o=["off","idle"],l=(e,t)=>Object(i.a)("_media_playerTmb",9e3,c,e,t),c=(e,t)=>e.callWS({type:"media_player_thumbnail",entity_id:t})},287:function(e,t,a){"use strict";var i=a(24),r=(a(164),a(3)),s=(a(232),a(177),a(162)),n=a(100);customElements.define("state-info",class extends i.a{static get template(){return r.a`
      ${this.styleTemplate} ${this.stateBadgeTemplate} ${this.infoTemplate}
    `}static get styleTemplate(){return r.a`
      <style>
        :host {
          @apply --paper-font-body1;
          min-width: 120px;
          white-space: nowrap;
        }

        state-badge {
          float: left;
        }

        :host([rtl]) state-badge {
          float: right;
        }

        .info {
          margin-left: 56px;
        }

        :host([rtl]) .info {
          margin-right: 56px;
          margin-left: 0;
          text-align: right;
        }

        .name {
          @apply --paper-font-common-nowrap;
          color: var(--primary-text-color);
          line-height: 40px;
        }

        .name[in-dialog],
        :host([secondary-line]) .name {
          line-height: 20px;
        }

        .time-ago,
        .extra-info,
        .extra-info > * {
          @apply --paper-font-common-nowrap;
          color: var(--secondary-text-color);
        }
      </style>
    `}static get stateBadgeTemplate(){return r.a`
      <state-badge state-obj="[[stateObj]]"></state-badge>
    `}static get infoTemplate(){return r.a`
      <div class="info">
        <div class="name" in-dialog$="[[inDialog]]">
          [[computeStateName(stateObj)]]
        </div>

        <template is="dom-if" if="[[inDialog]]">
          <div class="time-ago">
            <ha-relative-time
              hass="[[hass]]"
              datetime="[[stateObj.last_changed]]"
            ></ha-relative-time>
          </div>
        </template>
        <template is="dom-if" if="[[!inDialog]]">
          <div class="extra-info"><slot> </slot></div>
        </template>
      </div>
    `}static get properties(){return{detailed:{type:Boolean,value:!1},hass:Object,stateObj:Object,inDialog:Boolean,rtl:{type:Boolean,reflectToAttribute:!0,computed:"computeRTL(hass)"}}}computeStateName(e){return Object(s.a)(e)}computeRTL(e){return Object(n.a)(e)}});a(267);customElements.define("state-card-climate",class extends i.a{static get template(){return r.a`
      <style include="iron-flex iron-flex-alignment"></style>
      <style>
        :host {
          @apply --paper-font-body1;
          line-height: 1.5;
        }

        ha-climate-state {
          margin-left: 16px;
          text-align: right;
        }
      </style>

      <div class="horizontal justified layout">
        ${this.stateInfoTemplate}
        <ha-climate-state
          hass="[[hass]]"
          state-obj="[[stateObj]]"
        ></ha-climate-state>
      </div>
    `}static get stateInfoTemplate(){return r.a`
      <state-info
        hass="[[hass]]"
        state-obj="[[stateObj]]"
        in-dialog="[[inDialog]]"
      ></state-info>
    `}static get properties(){return{hass:Object,stateObj:Object,inDialog:{type:Boolean,value:!1}}}});a(73);var o=a(110);customElements.define("state-card-configurator",class extends(Object(o.a)(i.a)){static get template(){return r.a`
      <style include="iron-flex iron-flex-alignment"></style>
      <style>
        mwc-button {
          top: 3px;
          height: 37px;
          margin-right: -0.57em;
        }
      </style>

      <div class="horizontal justified layout">
        ${this.stateInfoTemplate}
        <mwc-button hidden$="[[inDialog]]"
          >[[_localizeState(stateObj.state)]]</mwc-button
        >
      </div>

      <!-- pre load the image so the dialog is rendered the proper size -->
      <template is="dom-if" if="[[stateObj.attributes.description_image]]">
        <img hidden="" src="[[stateObj.attributes.description_image]]" />
      </template>
    `}static get stateInfoTemplate(){return r.a`
      <state-info
        hass="[[hass]]"
        state-obj="[[stateObj]]"
        in-dialog="[[inDialog]]"
      ></state-info>
    `}static get properties(){return{hass:Object,stateObj:Object,inDialog:{type:Boolean,value:!1}}}_localizeState(e){return this.localize(`state.configurator.${e}`)}});a(268),a(255);var l=a(215);customElements.define("state-card-cover",class extends i.a{static get template(){return r.a`
      <style include="iron-flex iron-flex-alignment"></style>
      <style>
        :host {
          line-height: 1.5;
        }
      </style>

      <div class="horizontal justified layout">
        ${this.stateInfoTemplate}
        <div class="horizontal layout">
          <ha-cover-controls
            hidden$="[[entityObj.isTiltOnly]]"
            hass="[[hass]]"
            state-obj="[[stateObj]]"
          ></ha-cover-controls>
          <ha-cover-tilt-controls
            hidden$="[[!entityObj.isTiltOnly]]"
            hass="[[hass]]"
            state-obj="[[stateObj]]"
          ></ha-cover-tilt-controls>
        </div>
      </div>
    `}static get stateInfoTemplate(){return r.a`
      <state-info
        hass="[[hass]]"
        state-obj="[[stateObj]]"
        in-dialog="[[inDialog]]"
      ></state-info>
    `}static get properties(){return{hass:Object,stateObj:Object,inDialog:{type:Boolean,value:!1},entityObj:{type:Object,computed:"computeEntityObj(hass, stateObj)"}}}computeEntityObj(e,t){return new l.a(e,t)}});var c=a(204),d=a(238);customElements.define("state-card-display",class extends(Object(o.a)(i.a)){static get template(){return r.a`
      <style>
        :host {
          @apply --layout-horizontal;
          @apply --layout-justified;
          @apply --layout-baseline;
        }

        :host([rtl]) {
          direction: rtl;
          text-align: right;
        }

        state-info {
          flex: 1 1 auto;
          min-width: 0;
        }
        .state {
          @apply --paper-font-body1;
          color: var(--primary-text-color);
          margin-left: 16px;
          text-align: right;
          max-width: 40%;
          flex: 0 0 auto;
        }
        :host([rtl]) .state {
          margin-right: 16px;
          margin-left: 0;
          text-align: left;
        }

        .state.has-unit_of_measurement {
          white-space: nowrap;
        }
      </style>

      ${this.stateInfoTemplate}
      <div class$="[[computeClassNames(stateObj)]]">
        [[computeStateDisplay(localize, stateObj, language)]]
      </div>
    `}static get stateInfoTemplate(){return r.a`
      <state-info
        hass="[[hass]]"
        state-obj="[[stateObj]]"
        in-dialog="[[inDialog]]"
      ></state-info>
    `}static get properties(){return{hass:Object,stateObj:Object,inDialog:{type:Boolean,value:!1},rtl:{type:Boolean,reflectToAttribute:!0,computed:"_computeRTL(hass)"}}}computeStateDisplay(e,t,a){return Object(c.a)(e,t,a)}computeClassNames(e){return["state",Object(d.a)(e,["unit_of_measurement"])].join(" ")}_computeRTL(e){return Object(n.a)(e)}});var p=a(88),u=(a(83),a(65));a(269);customElements.define("state-card-input_number",class extends(Object(u.b)([p.a],i.a)){static get template(){return r.a`
      <style include="iron-flex iron-flex-alignment"></style>
      <style>
        ha-slider {
          margin-left: auto;
        }
        .state {
          @apply --paper-font-body1;
          color: var(--primary-text-color);

          text-align: right;
          line-height: 40px;
        }
        .sliderstate {
          min-width: 45px;
        }
        ha-slider[hidden] {
          display: none !important;
        }
        paper-input {
          text-align: right;
          margin-left: auto;
        }
      </style>

      <div class="horizontal justified layout" id="input_number_card">
        ${this.stateInfoTemplate}
        <ha-slider
          min="[[min]]"
          max="[[max]]"
          value="{{value}}"
          step="[[step]]"
          hidden="[[hiddenslider]]"
          pin=""
          on-change="selectedValueChanged"
          on-click="stopPropagation"
          id="slider"
          ignore-bar-touch=""
        >
        </ha-slider>
        <paper-input
          no-label-float=""
          auto-validate=""
          pattern="[0-9]+([\\.][0-9]+)?"
          step="[[step]]"
          min="[[min]]"
          max="[[max]]"
          value="{{value}}"
          type="number"
          on-change="selectedValueChanged"
          on-click="stopPropagation"
          hidden="[[hiddenbox]]"
        >
        </paper-input>
        <div class="state" hidden="[[hiddenbox]]">
          [[stateObj.attributes.unit_of_measurement]]
        </div>
        <div
          id="sliderstate"
          class="state sliderstate"
          hidden="[[hiddenslider]]"
        >
          [[value]] [[stateObj.attributes.unit_of_measurement]]
        </div>
      </div>
    `}static get stateInfoTemplate(){return r.a`
      <state-info
        hass="[[hass]]"
        state-obj="[[stateObj]]"
        in-dialog="[[inDialog]]"
      ></state-info>
    `}ready(){super.ready(),"function"==typeof ResizeObserver?new ResizeObserver(e=>{e.forEach(()=>{this.hiddenState()})}).observe(this.$.input_number_card):this.addEventListener("iron-resize",this.hiddenState)}static get properties(){return{hass:Object,hiddenbox:{type:Boolean,value:!0},hiddenslider:{type:Boolean,value:!0},inDialog:{type:Boolean,value:!1},stateObj:{type:Object,observer:"stateObjectChanged"},min:{type:Number,value:0},max:{type:Number,value:100},maxlength:{type:Number,value:3},step:Number,value:Number,mode:String}}hiddenState(){if("slider"!==this.mode)return;const e=this.$.slider.offsetWidth;e<100?this.$.sliderstate.hidden=!0:e>=145&&(this.$.sliderstate.hidden=!1)}stateObjectChanged(e){const t=this.mode;this.setProperties({min:Number(e.attributes.min),max:Number(e.attributes.max),step:Number(e.attributes.step),value:Number(e.state),mode:String(e.attributes.mode),maxlength:String(e.attributes.max).length,hiddenbox:"box"!==e.attributes.mode,hiddenslider:"slider"!==e.attributes.mode}),"slider"===this.mode&&"slider"!==t&&this.hiddenState()}selectedValueChanged(){this.value!==Number(this.stateObj.state)&&this.hass.callService("input_number","set_value",{value:this.value,entity_id:this.stateObj.entity_id})}stopPropagation(e){e.stopPropagation()}});a(133),a(130),a(132);customElements.define("state-card-input_select",class extends i.a{static get template(){return r.a`
      <style>
        :host {
          display: block;
        }

        state-badge {
          float: left;
          margin-top: 10px;
        }

        paper-dropdown-menu {
          display: block;
          margin-left: 53px;
        }

        paper-item {
          cursor: pointer;
        }
      </style>

      ${this.stateBadgeTemplate}
      <paper-dropdown-menu
        on-click="stopPropagation"
        selected-item-label="{{selectedOption}}"
        label="[[_computeStateName(stateObj)]]"
      >
        <paper-listbox
          slot="dropdown-content"
          selected="[[computeSelected(stateObj)]]"
        >
          <template is="dom-repeat" items="[[stateObj.attributes.options]]">
            <paper-item>[[item]]</paper-item>
          </template>
        </paper-listbox>
      </paper-dropdown-menu>
    `}static get stateBadgeTemplate(){return r.a`
      <state-badge state-obj="[[stateObj]]"></state-badge>
    `}static get properties(){return{hass:Object,stateObj:Object,inDialog:{type:Boolean,value:!1},selectedOption:{type:String,observer:"selectedOptionChanged"}}}_computeStateName(e){return Object(s.a)(e)}computeSelected(e){return e.attributes.options.indexOf(e.state)}selectedOptionChanged(e){""!==e&&e!==this.stateObj.state&&this.hass.callService("input_select","select_option",{option:e,entity_id:this.stateObj.entity_id})}stopPropagation(e){e.stopPropagation()}});customElements.define("state-card-input_text",class extends i.a{static get template(){return r.a`
      <style include="iron-flex iron-flex-alignment"></style>
      <style>
        paper-input {
          margin-left: 16px;
        }
      </style>

      <div class="horizontal justified layout">
        ${this.stateInfoTemplate}
        <paper-input
          no-label-float=""
          minlength="[[stateObj.attributes.min]]"
          maxlength="[[stateObj.attributes.max]]"
          value="{{value}}"
          auto-validate="[[stateObj.attributes.pattern]]"
          pattern="[[stateObj.attributes.pattern]]"
          type="[[stateObj.attributes.mode]]"
          on-change="selectedValueChanged"
          on-click="stopPropagation"
          placeholder="(empty value)"
        >
        </paper-input>
      </div>
    `}static get stateInfoTemplate(){return r.a`
      <state-info
        hass="[[hass]]"
        state-obj="[[stateObj]]"
        in-dialog="[[inDialog]]"
      ></state-info>
    `}static get properties(){return{hass:Object,inDialog:{type:Boolean,value:!1},stateObj:{type:Object,observer:"stateObjectChanged"},pattern:String,value:String}}stateObjectChanged(e){this.value=e.state}selectedValueChanged(){this.value!==this.stateObj.state&&this.hass.callService("input_text","set_value",{value:this.value,entity_id:this.stateObj.entity_id})}stopPropagation(e){e.stopPropagation()}});customElements.define("state-card-lock",class extends(Object(o.a)(i.a)){static get template(){return r.a`
      <style include="iron-flex iron-flex-alignment"></style>
      <style>
        mwc-button {
          top: 3px;
          height: 37px;
          margin-right: -0.57em;
        }
      </style>

      <div class="horizontal justified layout">
        ${this.stateInfoTemplate}
        <mwc-button
          on-click="_callService"
          data-service="unlock"
          hidden$="[[!isLocked]]"
          >[[localize('ui.card.lock.unlock')]]</mwc-button
        >
        <mwc-button
          on-click="_callService"
          data-service="lock"
          hidden$="[[isLocked]]"
          >[[localize('ui.card.lock.lock')]]</mwc-button
        >
      </div>
    `}static get stateInfoTemplate(){return r.a`
      <state-info
        hass="[[hass]]"
        state-obj="[[stateObj]]"
        in-dialog="[[inDialog]]"
      ></state-info>
    `}static get properties(){return{hass:Object,stateObj:{type:Object,observer:"_stateObjChanged"},inDialog:{type:Boolean,value:!1},isLocked:Boolean}}_stateObjChanged(e){e&&(this.isLocked="locked"===e.state)}_callService(e){e.stopPropagation();const t=e.target.dataset.service,a={entity_id:this.stateObj.entity_id};this.hass.callService("lock",t,a)}});var h=a(237);customElements.define("state-card-media_player",class extends(Object(o.a)(i.a)){static get template(){return r.a`
      <style include="iron-flex iron-flex-alignment"></style>
      <style>
        :host {
          line-height: 1.5;
        }

        .state {
          @apply --paper-font-common-nowrap;
          @apply --paper-font-body1;
          margin-left: 16px;
          text-align: right;
        }

        .main-text {
          @apply --paper-font-common-nowrap;
          color: var(--primary-text-color);
          text-transform: capitalize;
        }

        .main-text[take-height] {
          line-height: 40px;
        }

        .secondary-text {
          @apply --paper-font-common-nowrap;
          color: var(--secondary-text-color);
        }
      </style>

      <div class="horizontal justified layout">
        ${this.stateInfoTemplate}
        <div class="state">
          <div class="main-text" take-height$="[[!playerObj.secondaryTitle]]">
            [[computePrimaryText(localize, playerObj)]]
          </div>
          <div class="secondary-text">[[playerObj.secondaryTitle]]</div>
        </div>
      </div>
    `}static get stateInfoTemplate(){return r.a`
      <state-info
        hass="[[hass]]"
        state-obj="[[stateObj]]"
        in-dialog="[[inDialog]]"
      ></state-info>
    `}static get properties(){return{hass:Object,stateObj:Object,inDialog:{type:Boolean,value:!1},playerObj:{type:Object,computed:"computePlayerObj(hass, stateObj)"}}}computePlayerObj(e,t){return new h.a(e,t)}computePrimaryText(e,t){return t.primaryTitle||e(`state.media_player.${t.stateObj.state}`)||e(`state.default.${t.stateObj.state}`)||t.stateObj.state}});customElements.define("state-card-scene",class extends(Object(o.a)(i.a)){static get template(){return r.a`
      <style include="iron-flex iron-flex-alignment"></style>
      <style>
        mwc-button {
          top: 3px;
          height: 37px;
          margin-right: -0.57em;
        }
      </style>

      <div class="horizontal justified layout">
        ${this.stateInfoTemplate}
        <mwc-button on-click="activateScene"
          >[[localize('ui.card.scene.activate')]]</mwc-button
        >
      </div>
    `}static get stateInfoTemplate(){return r.a`
      <state-info
        hass="[[hass]]"
        state-obj="[[stateObj]]"
        in-dialog="[[inDialog]]"
      ></state-info>
    `}static get properties(){return{hass:Object,stateObj:Object,inDialog:{type:Boolean,value:!1}}}activateScene(e){e.stopPropagation(),this.hass.callService("scene","turn_on",{entity_id:this.stateObj.entity_id})}});a(218);customElements.define("state-card-script",class extends(Object(o.a)(i.a)){static get template(){return r.a`
      <style include="iron-flex iron-flex-alignment"></style>
      <style>
        mwc-button {
          top: 3px;
          height: 37px;
          margin-right: -0.57em;
        }

        ha-entity-toggle {
          margin-left: 16px;
        }
      </style>

      <div class="horizontal justified layout">
        ${this.stateInfoTemplate}
        <template is="dom-if" if="[[stateObj.attributes.can_cancel]]">
          <ha-entity-toggle
            state-obj="[[stateObj]]"
            hass="[[hass]]"
          ></ha-entity-toggle>
        </template>
        <template is="dom-if" if="[[!stateObj.attributes.can_cancel]]">
          <mwc-button on-click="fireScript"
            >[[localize('ui.card.script.execute')]]</mwc-button
          >
        </template>
      </div>
    `}static get stateInfoTemplate(){return r.a`
      <state-info
        hass="[[hass]]"
        state-obj="[[stateObj]]"
        in-dialog="[[inDialog]]"
      ></state-info>
    `}static get properties(){return{hass:Object,stateObj:Object,inDialog:{type:Boolean,value:!1}}}fireScript(e){e.stopPropagation(),this.hass.callService("script","turn_on",{entity_id:this.stateObj.entity_id})}});var m=a(244),b=a(236);customElements.define("state-card-timer",class extends i.a{static get template(){return r.a`
      <style include="iron-flex iron-flex-alignment"></style>
      <style>
        .state {
          @apply --paper-font-body1;
          color: var(--primary-text-color);

          margin-left: 16px;
          text-align: right;
          line-height: 40px;
        }
      </style>

      <div class="horizontal justified layout">
        ${this.stateInfoTemplate}
        <div class="state">[[_secondsToDuration(timeRemaining)]]</div>
      </div>
    `}static get stateInfoTemplate(){return r.a`
      <state-info
        hass="[[hass]]"
        state-obj="[[stateObj]]"
        in-dialog="[[inDialog]]"
      ></state-info>
    `}static get properties(){return{hass:Object,stateObj:{type:Object,observer:"stateObjChanged"},timeRemaining:Number,inDialog:{type:Boolean,value:!1}}}connectedCallback(){super.connectedCallback(),this.startInterval(this.stateObj)}disconnectedCallback(){super.disconnectedCallback(),this.clearInterval()}stateObjChanged(e){this.startInterval(e)}clearInterval(){this._updateRemaining&&(clearInterval(this._updateRemaining),this._updateRemaining=null)}startInterval(e){this.clearInterval(),this.calculateRemaining(e),"active"===e.state&&(this._updateRemaining=setInterval(()=>this.calculateRemaining(this.stateObj),1e3))}calculateRemaining(e){this.timeRemaining=Object(m.a)(e)}_secondsToDuration(e){return Object(b.a)(e)}});customElements.define("state-card-toggle",class extends i.a{static get template(){return r.a`
      <style include="iron-flex iron-flex-alignment"></style>
      <style>
        ha-entity-toggle {
          margin: -4px -16px -4px 0;
          padding: 4px 16px;
        }
      </style>

      <div class="horizontal justified layout">
        ${this.stateInfoTemplate}
        <ha-entity-toggle
          state-obj="[[stateObj]]"
          hass="[[hass]]"
        ></ha-entity-toggle>
      </div>
    `}static get stateInfoTemplate(){return r.a`
      <state-info
        hass="[[hass]]"
        state-obj="[[stateObj]]"
        in-dialog="[[inDialog]]"
      ></state-info>
    `}static get properties(){return{hass:Object,stateObj:Object,inDialog:{type:Boolean,value:!1}}}});const f={cleaning:{action:"return_to_base",service:"return_to_base"},docked:{action:"start_cleaning",service:"start"},idle:{action:"start_cleaning",service:"start"},off:{action:"turn_on",service:"turn_on"},on:{action:"turn_off",service:"turn_off"},paused:{action:"resume_cleaning",service:"start"}};customElements.define("ha-vacuum-state",class extends(Object(o.a)(i.a)){static get template(){return r.a`
      <style>
        mwc-button {
          top: 3px;
          height: 37px;
          margin-right: -0.57em;
        }
        mwc-button[disabled] {
          background-color: transparent;
          color: var(--secondary-text-color);
        }
      </style>

      <mwc-button on-click="_callService" disabled="[[!_interceptable]]"
        >[[_computeLabel(stateObj.state, _interceptable)]]</mwc-button
      >
    `}static get properties(){return{hass:Object,stateObj:Object,_interceptable:{type:Boolean,computed:"_computeInterceptable(stateObj.state, stateObj.attributes.supported_features)"}}}_computeInterceptable(e,t){return e in f&&0!==t}_computeLabel(e,t){return t?this.localize(`ui.card.vacuum.actions.${f[e].action}`):this.localize(`state.vacuum.${e}`)}_callService(e){e.stopPropagation();const t=this.stateObj,a=f[t.state].service;this.hass.callService("vacuum",a,{entity_id:t.entity_id})}});customElements.define("state-card-vacuum",class extends i.a{static get template(){return r.a`
      <style include="iron-flex iron-flex-alignment"></style>

      <div class="horizontal justified layout">
        ${this.stateInfoTemplate}
        <ha-vacuum-state
          hass="[[hass]]"
          state-obj="[[stateObj]]"
        ></ha-vacuum-state>
      </div>
    `}static get stateInfoTemplate(){return r.a`
      <state-info
        hass="[[hass]]"
        state-obj="[[stateObj]]"
        in-dialog="[[inDialog]]"
      ></state-info>
    `}static get properties(){return{hass:Object,stateObj:Object,inDialog:{type:Boolean,value:!1}}}});customElements.define("ha-water_heater-state",class extends(Object(o.a)(i.a)){static get template(){return r.a`
      <style>
        :host {
          display: flex;
          flex-direction: column;
          justify-content: center;
          white-space: nowrap;
        }

        .target {
          color: var(--primary-text-color);
        }

        .current {
          color: var(--secondary-text-color);
        }

        .state-label {
          font-weight: bold;
          text-transform: capitalize;
        }
      </style>

      <div class="target">
        <span class="state-label"> [[_localizeState(stateObj.state)]] </span>
        [[computeTarget(hass, stateObj)]]
      </div>

      <template is="dom-if" if="[[currentStatus]]">
        <div class="current">
          [[localize('ui.card.water_heater.currently')]]: [[currentStatus]]
        </div>
      </template>
    `}static get properties(){return{hass:Object,stateObj:Object}}computeTarget(e,t){return e&&t?null!=t.attributes.target_temp_low&&null!=t.attributes.target_temp_high?`${t.attributes.target_temp_low} - ${t.attributes.target_temp_high} ${e.config.unit_system.temperature}`:null!=t.attributes.temperature?`${t.attributes.temperature} ${e.config.unit_system.temperature}`:"":null}_localizeState(e){return this.localize(`state.water_heater.${e}`)||e}});customElements.define("state-card-water_heater",class extends i.a{static get template(){return r.a`
      <style include="iron-flex iron-flex-alignment"></style>
      <style>
        :host {
          @apply --paper-font-body1;
          line-height: 1.5;
        }

        ha-water_heater-state {
          margin-left: 16px;
          text-align: right;
        }
      </style>

      <div class="horizontal justified layout">
        ${this.stateInfoTemplate}
        <ha-water_heater-state
          hass="[[hass]]"
          state-obj="[[stateObj]]"
        ></ha-water_heater-state>
      </div>
    `}static get stateInfoTemplate(){return r.a`
      <state-info
        hass="[[hass]]"
        state-obj="[[stateObj]]"
        in-dialog="[[inDialog]]"
      ></state-info>
    `}static get properties(){return{hass:Object,stateObj:Object,inDialog:{type:Boolean,value:!1}}}});customElements.define("state-card-weblink",class extends i.a{static get template(){return r.a`
      <style>
        :host {
          display: block;
        }
        .name {
          @apply --paper-font-common-nowrap;
          @apply --paper-font-body1;
          color: var(--primary-color);

          text-transform: capitalize;
          line-height: 40px;
          margin-left: 16px;
        }
      </style>

      ${this.stateBadgeTemplate}
      <a href$="[[stateObj.state]]" target="_blank" class="name" id="link"
        >[[_computeStateName(stateObj)]]</a
      >
    `}static get stateBadgeTemplate(){return r.a`
      <state-badge state-obj="[[stateObj]]"></state-badge>
    `}static get properties(){return{stateObj:Object,inDialog:{type:Boolean,value:!1}}}ready(){super.ready(),this.addEventListener("click",e=>this.onTap(e))}_computeStateName(e){return Object(s.a)(e)}onTap(e){e.stopPropagation(),e.preventDefault(),window.open(this.stateObj.state,"_blank")}});var g=a(273),y=a(165),v=a(112);var _=a(247);customElements.define("state-card-content",class extends i.a{static get properties(){return{hass:Object,stateObj:Object,inDialog:{type:Boolean,value:!1}}}static get observers(){return["inputChanged(hass, inDialog, stateObj)"]}inputChanged(e,t,a){let i;a&&e&&(i=a.attributes&&"custom_ui_state_card"in a.attributes?a.attributes.custom_ui_state_card:"state-card-"+function(e,t){if("unavailable"===t.state)return"display";const a=Object(y.a)(t);return v.g.includes(a)?a:Object(g.a)(e,t)&&"hidden"!==t.attributes.control?"toggle":"display"}(e,a),Object(_.a)(this,i.toUpperCase(),{hass:e,stateObj:a,inDialog:t}))}})},301:function(e,t,a){"use strict";a(121);var i=a(109);Object(i.b)("waterfall",{run:function(){this.shadow=this.isOnScreen()&&this.isContentBelow()}})},304:function(e,t,a){"use strict";a(164),a(104),a(143),a(171);var i=a(3),r=a(24),s=a(237),n=a(282),o=a(162),l=a(84),c=a(110);customElements.define("ha-media_player-card",class extends(Object(c.a)(Object(l.a)(r.a))){static get template(){return i.a`
      <style
        include="paper-material-styles iron-flex iron-flex-alignment iron-positioning"
      >
        :host {
          @apply --paper-material-elevation-1;
          display: block;
          position: relative;
          font-size: 0px;
          border-radius: 2px;
        }

        .banner {
          position: relative;
          background-color: white;
          border-top-left-radius: 2px;
          border-top-right-radius: 2px;
        }

        .banner:before {
          display: block;
          content: "";
          width: 100%;
          /* removed .25% from 16:9 ratio to fix YT black bars */
          padding-top: 56%;
          transition: padding-top 0.8s;
        }

        .banner.no-cover {
          background-position: center center;
          background-image: url(/static/images/card_media_player_bg.png);
          background-repeat: no-repeat;
          background-color: var(--primary-color);
        }

        .banner.content-type-music:before {
          padding-top: 100%;
        }

        .banner.no-cover:before {
          padding-top: 88px;
        }

        .banner > .cover {
          position: absolute;
          top: 0;
          left: 0;
          right: 0;
          bottom: 0;

          border-top-left-radius: 2px;
          border-top-right-radius: 2px;

          background-position: center center;
          background-size: cover;
          transition: opacity 0.8s;
          opacity: 1;
        }

        .banner.is-off > .cover {
          opacity: 0;
        }

        .banner > .caption {
          @apply --paper-font-caption;

          position: absolute;
          left: 0;
          right: 0;
          bottom: 0;

          background-color: rgba(0, 0, 0, var(--dark-secondary-opacity));

          padding: 8px 16px;

          font-size: 14px;
          font-weight: 500;
          color: white;

          transition: background-color 0.5s;
        }

        .banner.is-off > .caption {
          background-color: initial;
        }

        .banner > .caption .title {
          @apply --paper-font-common-nowrap;
          font-size: 1.2em;
          margin: 8px 0 4px;
        }

        .progress {
          width: 100%;
          height: var(--paper-progress-height, 4px);
          margin-top: calc(-1 * var(--paper-progress-height, 4px));
          --paper-progress-active-color: var(--accent-color);
          --paper-progress-container-color: rgba(200, 200, 200, 0.5);
        }

        .controls {
          position: relative;
          @apply --paper-font-body1;
          padding: 8px;
          border-bottom-left-radius: 2px;
          border-bottom-right-radius: 2px;
          background-color: var(--paper-card-background-color, white);
        }

        .controls paper-icon-button {
          width: 44px;
          height: 44px;
        }

        paper-icon-button {
          opacity: var(--dark-primary-opacity);
        }

        paper-icon-button[disabled] {
          opacity: var(--dark-disabled-opacity);
        }

        paper-icon-button.primary {
          width: 56px !important;
          height: 56px !important;
          background-color: var(--primary-color);
          color: white;
          border-radius: 50%;
          padding: 8px;
          transition: background-color 0.5s;
        }

        paper-icon-button.primary[disabled] {
          background-color: rgba(0, 0, 0, var(--dark-disabled-opacity));
        }

        [invisible] {
          visibility: hidden !important;
        }
      </style>

      <div
        class$="[[computeBannerClasses(playerObj, _coverShowing, _coverLoadError)]]"
      >
        <div class="cover" id="cover"></div>

        <div class="caption">
          [[_computeStateName(stateObj)]]
          <div class="title">[[computePrimaryText(localize, playerObj)]]</div>
          [[playerObj.secondaryTitle]]<br />
        </div>
      </div>

      <paper-progress
        max="[[stateObj.attributes.media_duration]]"
        value="[[playbackPosition]]"
        hidden$="[[computeHideProgress(playerObj)]]"
        class="progress"
      ></paper-progress>

      <div class="controls layout horizontal justified">
        <paper-icon-button
          icon="hass:power"
          on-click="handleTogglePower"
          invisible$="[[computeHidePowerButton(playerObj)]]"
          class="self-center secondary"
        ></paper-icon-button>

        <div>
          <paper-icon-button
            icon="hass:skip-previous"
            invisible$="[[!playerObj.supportsPreviousTrack]]"
            disabled="[[playerObj.isOff]]"
            on-click="handlePrevious"
          ></paper-icon-button>
          <paper-icon-button
            class="primary"
            icon="[[computePlaybackControlIcon(playerObj)]]"
            invisible$="[[!computePlaybackControlIcon(playerObj)]]"
            disabled="[[playerObj.isOff]]"
            on-click="handlePlaybackControl"
          ></paper-icon-button>
          <paper-icon-button
            icon="hass:skip-next"
            invisible$="[[!playerObj.supportsNextTrack]]"
            disabled="[[playerObj.isOff]]"
            on-click="handleNext"
          ></paper-icon-button>
        </div>

        <paper-icon-button
          icon="hass:dots-vertical"
          on-click="handleOpenMoreInfo"
          class="self-center secondary"
        ></paper-icon-button>
      </div>
    `}static get properties(){return{hass:Object,stateObj:Object,playerObj:{type:Object,computed:"computePlayerObj(hass, stateObj)",observer:"playerObjChanged"},playbackControlIcon:{type:String,computed:"computePlaybackControlIcon(playerObj)"},playbackPosition:Number,_coverShowing:{type:Boolean,value:!1},_coverLoadError:{type:Boolean,value:!1}}}async playerObjChanged(e,t){e.isPlaying&&e.showProgress?this._positionTracking||(this._positionTracking=setInterval(()=>this.updatePlaybackPosition(),1e3)):this._positionTracking&&(clearInterval(this._positionTracking),this._positionTracking=null),e.showProgress&&this.updatePlaybackPosition();const a=e.stateObj.attributes.entity_picture,i=t&&t.stateObj.attributes.entity_picture;if(a===i||a){if(a!==i)try{const{content_type:t,content:a}=await Object(n.e)(this.hass,e.stateObj.entity_id);this._coverShowing=!0,this._coverLoadError=!1,this.$.cover.style.backgroundImage=`url(data:${t};base64,${a})`}catch(e){this._coverShowing=!1,this._coverLoadError=!0,this.$.cover.style.backgroundImage=""}}else this.$.cover.style.backgroundImage=""}updatePlaybackPosition(){this.playbackPosition=this.playerObj.currentProgress}computeBannerClasses(e,t,a){var i="banner";return e.isOff||e.isIdle?i+=" is-off no-cover":e.stateObj.attributes.entity_picture&&!a&&t?"music"===e.stateObj.attributes.media_content_type&&(i+=" content-type-music"):i+=" no-cover",i}computeHideProgress(e){return!e.showProgress}computeHidePowerButton(e){return e.isOff?!e.supportsTurnOn:!e.supportsTurnOff}computePlayerObj(e,t){return new s.a(e,t)}computePrimaryText(e,t){return t.primaryTitle||e(`state.media_player.${t.stateObj.state}`)||e(`state.default.${t.stateObj.state}`)||t.stateObj.state}computePlaybackControlIcon(e){return e.isPlaying?e.supportsPause?"hass:pause":"hass:stop":e.hasMediaControl||e.isOff||e.isIdle?e.hasMediaControl&&e.supportsPause&&!e.isPaused?"hass:play-pause":e.supportsPlay?"hass:play":null:""}_computeStateName(e){return Object(o.a)(e)}handleNext(e){e.stopPropagation(),this.playerObj.nextTrack()}handleOpenMoreInfo(e){e.stopPropagation(),this.fire("hass-more-info",{entityId:this.stateObj.entity_id})}handlePlaybackControl(e){e.stopPropagation(),this.playerObj.mediaPlayPause()}handlePrevious(e){e.stopPropagation(),this.playerObj.previousTrack()}handleTogglePower(e){e.stopPropagation(),this.playerObj.togglePower()}})},305:function(e,t,a){"use strict";var i=a(3),r=a(24),s=a(162),n=(a(181),a(167),a(84)),o=a(110),l=a(100);customElements.define("ha-weather-card",class extends(Object(o.a)(Object(n.a)(r.a))){static get template(){return i.a`
      <style>
        :host {
          cursor: pointer;
        }

        .content {
          padding: 0 20px 20px;
        }

        ha-icon {
          color: var(--paper-item-icon-color);
        }

        .header {
          font-family: var(--paper-font-headline_-_font-family);
          -webkit-font-smoothing: var(
            --paper-font-headline_-_-webkit-font-smoothing
          );
          font-size: var(--paper-font-headline_-_font-size);
          font-weight: var(--paper-font-headline_-_font-weight);
          letter-spacing: var(--paper-font-headline_-_letter-spacing);
          line-height: var(--paper-font-headline_-_line-height);
          text-rendering: var(
            --paper-font-common-expensive-kerning_-_text-rendering
          );
          opacity: var(--dark-primary-opacity);
          padding: 24px 16px 16px;
          display: flex;
          align-items: baseline;
        }

        .name {
          margin-left: 16px;
          font-size: 16px;
          color: var(--secondary-text-color);
        }

        :host([rtl]) .name {
          margin-left: 0px;
          margin-right: 16px;
        }

        .now {
          display: flex;
          justify-content: space-between;
          align-items: center;
          flex-wrap: wrap;
        }

        .main {
          display: flex;
          align-items: center;
          margin-right: 32px;
        }

        :host([rtl]) .main {
          margin-right: 0px;
        }

        .main ha-icon {
          --iron-icon-height: 72px;
          --iron-icon-width: 72px;
          margin-right: 8px;
        }

        :host([rtl]) .main ha-icon {
          margin-right: 0px;
        }

        .main .temp {
          font-size: 52px;
          line-height: 1em;
          position: relative;
        }

        :host([rtl]) .main .temp {
          direction: ltr;
          margin-right: 28px;
        }

        .main .temp span {
          font-size: 24px;
          line-height: 1em;
          position: absolute;
          top: 4px;
        }

        .measurand {
          display: inline-block;
        }

        :host([rtl]) .measurand {
          direction: ltr;
        }

        .forecast {
          margin-top: 16px;
          display: flex;
          justify-content: space-between;
        }

        .forecast div {
          flex: 0 0 auto;
          text-align: center;
        }

        .forecast .icon {
          margin: 4px 0;
          text-align: center;
        }

        :host([rtl]) .forecast .temp {
          direction: ltr;
        }

        .weekday {
          font-weight: bold;
        }

        .attributes,
        .templow,
        .precipitation {
          color: var(--secondary-text-color);
        }

        :host([rtl]) .precipitation {
          direction: ltr;
        }
      </style>
      <ha-card>
        <div class="header">
          [[computeState(stateObj.state, localize)]]
          <div class="name">[[computeName(stateObj)]]</div>
        </div>
        <div class="content">
          <div class="now">
            <div class="main">
              <template is="dom-if" if="[[showWeatherIcon(stateObj.state)]]">
                <ha-icon icon="[[getWeatherIcon(stateObj.state)]]"></ha-icon>
              </template>
              <div class="temp">
                [[stateObj.attributes.temperature]]<span
                  >[[getUnit('temperature')]]</span
                >
              </div>
            </div>
            <div class="attributes">
              <template
                is="dom-if"
                if="[[_showValue(stateObj.attributes.pressure)]]"
              >
                <div>
                  [[localize('ui.card.weather.attributes.air_pressure')]]:
                  <span class="measurand">
                    [[stateObj.attributes.pressure]] [[getUnit('air_pressure')]]
                  </span>
                </div>
              </template>
              <template
                is="dom-if"
                if="[[_showValue(stateObj.attributes.humidity)]]"
              >
                <div>
                  [[localize('ui.card.weather.attributes.humidity')]]:
                  <span class="measurand"
                    >[[stateObj.attributes.humidity]] %</span
                  >
                </div>
              </template>
              <template
                is="dom-if"
                if="[[_showValue(stateObj.attributes.wind_speed)]]"
              >
                <div>
                  [[localize('ui.card.weather.attributes.wind_speed')]]:
                  <span class="measurand">
                    [[getWindSpeed(stateObj.attributes.wind_speed)]]
                  </span>
                  [[getWindBearing(stateObj.attributes.wind_bearing, localize)]]
                </div>
              </template>
            </div>
          </div>
          <template is="dom-if" if="[[forecast]]">
            <div class="forecast">
              <template is="dom-repeat" items="[[forecast]]">
                <div>
                  <div class="weekday">
                    [[computeDate(item.datetime)]]<br />
                    <template is="dom-if" if="[[!_showValue(item.templow)]]">
                      [[computeTime(item.datetime)]]
                    </template>
                  </div>
                  <template is="dom-if" if="[[_showValue(item.condition)]]">
                    <div class="icon">
                      <ha-icon
                        icon="[[getWeatherIcon(item.condition)]]"
                      ></ha-icon>
                    </div>
                  </template>
                  <div class="temp">
                    [[item.temperature]] [[getUnit('temperature')]]
                  </div>
                  <template is="dom-if" if="[[_showValue(item.templow)]]">
                    <div class="templow">
                      [[item.templow]] [[getUnit('temperature')]]
                    </div>
                  </template>
                  <template is="dom-if" if="[[_showValue(item.precipitation)]]">
                    <div class="precipitation">
                      [[item.precipitation]] [[getUnit('precipitation')]]
                    </div>
                  </template>
                </div>
              </template>
            </div>
          </template>
        </div>
      </ha-card>
    `}static get properties(){return{hass:Object,config:Object,stateObj:Object,forecast:{type:Array,computed:"computeForecast(stateObj.attributes.forecast)"},rtl:{type:Boolean,reflectToAttribute:!0,computed:"_computeRTL(hass)"}}}constructor(){super(),this.cardinalDirections=["N","NNE","NE","ENE","E","ESE","SE","SSE","S","SSW","SW","WSW","W","WNW","NW","NNW","N"],this.weatherIcons={"clear-night":"hass:weather-night",cloudy:"hass:weather-cloudy",fog:"hass:weather-fog",hail:"hass:weather-hail",lightning:"hass:weather-lightning","lightning-rainy":"hass:weather-lightning-rainy",partlycloudy:"hass:weather-partlycloudy",pouring:"hass:weather-pouring",rainy:"hass:weather-rainy",snowy:"hass:weather-snowy","snowy-rainy":"hass:weather-snowy-rainy",sunny:"hass:weather-sunny",windy:"hass:weather-windy","windy-variant":"hass:weather-windy-variant"}}ready(){this.addEventListener("click",this._onClick),super.ready()}_onClick(){this.fire("hass-more-info",{entityId:this.stateObj.entity_id})}computeForecast(e){return e&&e.slice(0,5)}getUnit(e){const t=this.hass.config.unit_system.length||"";switch(e){case"air_pressure":return"km"===t?"hPa":"inHg";case"length":return t;case"precipitation":return"km"===t?"mm":"in";default:return this.hass.config.unit_system[e]||""}}computeState(e,t){return t(`state.weather.${e}`)||e}computeName(e){return this.config&&this.config.name||Object(s.a)(e)}showWeatherIcon(e){return e in this.weatherIcons}getWeatherIcon(e){return this.weatherIcons[e]}windBearingToText(e){const t=parseInt(e);return isFinite(t)?this.cardinalDirections[((t+11.25)/22.5|0)%16]:e}getWindSpeed(e){return`${e} ${this.getUnit("length")}/h`}getWindBearing(e,t){if(null!=e){const a=this.windBearingToText(e);return`(${t(`ui.card.weather.cardinal_direction.${a.toLowerCase()}`)||a})`}return""}_showValue(e){return null!=e}computeDate(e){return new Date(e).toLocaleDateString(this.hass.language,{weekday:"short"})}computeTime(e){return new Date(e).toLocaleTimeString(this.hass.language,{hour:"numeric"})}_computeRTL(e){return Object(l.a)(e)}})},306:function(e,t,a){"use strict";a.d(t,"a",function(){return r});var i=a(112);function r(e){const t=[];return Object.keys(e).forEach(a=>{const i=e[a];i.attributes.view&&t.push(i)}),t.sort((e,t)=>e.entity_id===i.c?-1:t.entity_id===i.c?1:e.attributes.order-t.attributes.order),t}},307:function(e,t,a){"use strict";a.d(t,"a",function(){return s});var i=a(168),r=a(270);function s(e,t){const a={};return t.attributes.entity_id.forEach(t=>{const s=e[t];if(s&&!s.attributes.hidden&&(a[s.entity_id]=s,"group"===Object(i.a)(s.entity_id))){const t=Object(r.a)(e,s);Object.keys(t).forEach(e=>{const i=t[e];i.attributes.hidden||(a[e]=i)})}}),a}},308:function(e,t,a){"use strict";a.d(t,"a",function(){return r});var i=a(168);function r(e){const t=[],a={};return Object.keys(e).forEach(r=>{const s=e[r];"group"===Object(i.a)(r)?t.push(s):a[r]=s}),t.forEach(e=>e.attributes.entity_id.forEach(e=>{delete a[e]})),{groups:t,ungrouped:a}}},309:function(e,t,a){"use strict";a.d(t,"a",function(){return s});var i=a(165),r=a(112);function s(e){const t=Object(i.a)(e);return r.h.includes(t)?t:r.d.includes(t)?"hidden":"default"}},310:function(e,t,a){"use strict";a(163);var i=a(3),r=a(24),s=(a(242),a(243),a(162)),n=a(84);customElements.define("ha-history_graph-card",class extends(Object(n.a)(r.a)){static get template(){return i.a`
      <style>
        paper-card:not([dialog]) .content {
          padding: 0 16px 16px;
        }
        paper-card[dialog] {
          padding-top: 16px;
          background-color: transparent;
        }
        paper-card {
          width: 100%;
          /* prevent new stacking context, chart tooltip needs to overflow */
          position: static;
        }
        .header {
          @apply --paper-font-headline;
          line-height: 40px;
          color: var(--primary-text-color);
          padding: 20px 16px 12px;
          @apply --paper-font-common-nowrap;
        }
        paper-card[dialog] .header {
          display: none;
        }
      </style>
      <ha-state-history-data
        hass="[[hass]]"
        filter-type="recent-entity"
        entity-id="[[computeHistoryEntities(stateObj)]]"
        data="{{stateHistory}}"
        is-loading="{{stateHistoryLoading}}"
        cache-config="[[cacheConfig]]"
      ></ha-state-history-data>
      <paper-card
        dialog$="[[inDialog]]"
        on-click="cardTapped"
        elevation="[[computeElevation(inDialog)]]"
      >
        <div class="header">[[computeTitle(stateObj)]]</div>
        <div class="content">
          <state-history-charts
            hass="[[hass]]"
            history-data="[[stateHistory]]"
            is-loading-data="[[stateHistoryLoading]]"
            up-to-now
            no-single
          >
          </state-history-charts>
        </div>
      </paper-card>
    `}static get properties(){return{hass:Object,stateObj:{type:Object,observer:"stateObjObserver"},inDialog:{type:Boolean,value:!1},stateHistory:Object,stateHistoryLoading:Boolean,cacheConfig:{type:Object,value:{refresh:0,cacheKey:null,hoursToShow:24}}}}stateObjObserver(e){e&&(this.cacheConfig.cacheKey===e.entity_id&&this.cacheConfig.refresh===(e.attributes.refresh||0)&&this.cacheConfig.hoursToShow===(e.attributes.hours_to_show||24)||(this.cacheConfig=Object.assign({},{refresh:e.attributes.refresh||0,cacheKey:e.entity_id,hoursToShow:e.attributes.hours_to_show||24})))}computeTitle(e){return Object(s.a)(e)}computeContentClass(e){return e?"":"content"}computeHistoryEntities(e){return e.attributes.entity_id}computeElevation(e){return e?0:1}cardTapped(e){window.matchMedia("(min-width: 610px) and (min-height: 550px)").matches&&(e.stopPropagation(),this.fire("hass-more-info",{entityId:this.stateObj.entity_id}))}})},468:function(e,t,a){"use strict";a.r(t);var i=a(3),r=a(24),s=(a(138),a(301),a(134),a(146),a(164),a(2),a(88)),n=a(77),o=a(4);Object(o.a)({_template:i.a`
    <style>
      :host {
        display: block;
      }

      :host > ::slotted(:not(slot):not(.iron-selected)) {
        display: none !important;
      }
    </style>

    <slot></slot>
`,is:"iron-pages",behaviors:[s.a,n.a],properties:{activateEvent:{type:String,value:null}},observers:["_selectedPageChanged(selected)"],_selectedPageChanged:function(e,t){this.async(this.notifyResize)}});a(228),a(259);var l=a(11),c=a(19);a(266);customElements.define("ha-badges-card",class extends r.a{static get template(){return i.a`
      <style>
        ha-state-label-badge {
          display: inline-block;
          margin-bottom: var(--ha-state-label-badge-margin-bottom, 16px);
        }
      </style>
      <template is="dom-repeat" items="[[states]]">
        <ha-state-label-badge
          hass="[[hass]]"
          state="[[item]]"
        ></ha-state-label-badge>
      </template>
    `}static get properties(){return{hass:Object,states:Array}}});a(171);var d=a(162),p=a(84),u=a(110);const h=1e4;customElements.define("ha-camera-card",class extends(Object(u.a)(Object(p.a)(r.a))){static get template(){return i.a`
      <style include="paper-material-styles">
        :host {
          @apply --paper-material-elevation-1;
          display: block;
          position: relative;
          font-size: 0px;
          border-radius: 2px;
          cursor: pointer;
          min-height: 48px;
          line-height: 0;
        }
        .camera-feed {
          width: 100%;
          height: auto;
          border-radius: 2px;
        }
        .caption {
          @apply --paper-font-common-nowrap;
          position: absolute;
          left: 0px;
          right: 0px;
          bottom: 0px;
          border-bottom-left-radius: 2px;
          border-bottom-right-radius: 2px;

          background-color: rgba(0, 0, 0, 0.3);
          padding: 16px;

          font-size: 16px;
          font-weight: 500;
          line-height: 16px;
          color: white;
        }
      </style>

      <template is="dom-if" if="[[cameraFeedSrc]]">
        <img
          src="[[cameraFeedSrc]]"
          class="camera-feed"
          alt="[[_computeStateName(stateObj)]]"
        />
      </template>
      <div class="caption">
        [[_computeStateName(stateObj)]]
        <template is="dom-if" if="[[!imageLoaded]]">
          ([[localize('ui.card.camera.not_available')]])
        </template>
      </div>
    `}static get properties(){return{hass:Object,stateObj:{type:Object,observer:"updateCameraFeedSrc"},cameraFeedSrc:{type:String,value:""},imageLoaded:{type:Boolean,value:!0}}}ready(){super.ready(),this.addEventListener("click",()=>this.cardTapped())}connectedCallback(){super.connectedCallback(),this.timer=setInterval(()=>this.updateCameraFeedSrc(),h)}disconnectedCallback(){super.disconnectedCallback(),clearInterval(this.timer)}cardTapped(){this.fire("hass-more-info",{entityId:this.stateObj.entity_id})}async updateCameraFeedSrc(){try{const{content_type:e,content:t}=await this.hass.callWS({type:"camera_thumbnail",entity_id:this.stateObj.entity_id});this.setProperties({imageLoaded:!0,cameraFeedSrc:`data:${e};base64, ${t}`})}catch(e){this.imageLoaded=!1}}_computeStateName(e){return Object(d.a)(e)}});a(218),a(181),a(287);var m=a(165),b=a(309),f=a(273);customElements.define("ha-entities-card",class extends(Object(u.a)(Object(p.a)(r.a))){static get template(){return i.a`
      <style include="iron-flex"></style>
      <style>
        ha-card {
          padding: 16px;
        }
        .states {
          margin: -4px 0;
        }
        .state {
          padding: 4px 0;
        }
        .header {
          @apply --paper-font-headline;
          /* overwriting line-height +8 because entity-toggle can be 40px height,
           compensating this with reduced padding */
          line-height: 40px;
          color: var(--primary-text-color);
          padding: 4px 0 12px;
        }
        .header .name {
          @apply --paper-font-common-nowrap;
        }
        ha-entity-toggle {
          margin-left: 16px;
        }
        .more-info {
          cursor: pointer;
        }
      </style>

      <ha-card>
        <template is="dom-if" if="[[title]]">
          <div
            class$="[[computeTitleClass(groupEntity)]]"
            on-click="entityTapped"
          >
            <div class="flex name">[[title]]</div>
            <template is="dom-if" if="[[showGroupToggle(groupEntity, states)]]">
              <ha-entity-toggle
                hass="[[hass]]"
                state-obj="[[groupEntity]]"
              ></ha-entity-toggle>
            </template>
          </div>
        </template>
        <div class="states">
          <template
            is="dom-repeat"
            items="[[states]]"
            on-dom-change="addTapEvents"
          >
            <div class$="[[computeStateClass(item)]]">
              <state-card-content
                hass="[[hass]]"
                class="state-card"
                state-obj="[[item]]"
              ></state-card-content>
            </div>
          </template>
        </div>
      </ha-card>
    `}static get properties(){return{hass:Object,states:Array,groupEntity:Object,title:{type:String,computed:"computeTitle(states, groupEntity, localize)"}}}constructor(){super(),this.entityTapped=this.entityTapped.bind(this)}computeTitle(e,t,a){if(t)return Object(d.a)(t).trim();const i=Object(m.a)(e[0]);return a&&a(`domain.${i}`)||i.replace(/_/g," ")}computeTitleClass(e){let t="header horizontal layout center ";return e&&(t+="more-info"),t}computeStateClass(e){return"hidden"!==Object(b.a)(e)?"state more-info":"state"}addTapEvents(){this.root.querySelectorAll(".state").forEach(e=>{e.classList.contains("more-info")?e.addEventListener("click",this.entityTapped):e.removeEventListener("click",this.entityTapped)})}entityTapped(e){const t=this.root.querySelector("dom-repeat").itemForElement(e.target);let a;(t||this.groupEntity)&&(e.stopPropagation(),a=t?t.entity_id:this.groupEntity.entity_id,this.fire("hass-more-info",{entityId:a}))}showGroupToggle(e,t){if(!e||!t||"hidden"===e.attributes.control||"on"!==e.state&&"off"!==e.state)return!1;let a=0;for(let e=0;e<t.length&&!(Object(f.a)(this.hass,t[e])&&++a>1);e++);return a>1}});a(310),a(304),a(73),a(225);var g=a(180);customElements.define("ha-persistent_notification-card",class extends(Object(u.a)(r.a)){static get template(){return i.a`
      <style>
        :host {
          @apply --paper-font-body1;
        }
        ha-markdown {
          display: block;
          padding: 0 16px;
          -ms-user-select: initial;
          -webkit-user-select: initial;
          -moz-user-select: initial;
        }
        ha-markdown p:first-child {
          margin-top: 0;
        }
        ha-markdown p:last-child {
          margin-bottom: 0;
        }
        ha-markdown a {
          color: var(--primary-color);
        }
        ha-markdown img {
          max-width: 100%;
        }
        mwc-button {
          margin: 8px;
        }
      </style>

      <ha-card header="[[computeTitle(stateObj)]]">
        <ha-markdown content="[[stateObj.attributes.message]]"></ha-markdown>
        <mwc-button on-click="dismissTap"
          >[[localize('ui.card.persistent_notification.dismiss')]]</mwc-button
        >
      </ha-card>
    `}static get properties(){return{hass:Object,stateObj:Object}}computeTitle(e){return e.attributes.title||Object(d.a)(e)}dismissTap(e){e.preventDefault(),this.hass.callService("persistent_notification","dismiss",{notification_id:Object(g.a)(this.stateObj.entity_id)})}});a(167);customElements.define("ha-plant-card",class extends(Object(p.a)(r.a)){static get template(){return i.a`
      <style>
        .banner {
          display: flex;
          align-items: flex-end;
          background-repeat: no-repeat;
          background-size: cover;
          background-position: center;
          padding-top: 12px;
        }
        .has-plant-image .banner {
          padding-top: 30%;
        }
        .header {
          @apply --paper-font-headline;
          line-height: 40px;
          padding: 8px 16px;
        }
        .has-plant-image .header {
          font-size: 16px;
          font-weight: 500;
          line-height: 16px;
          padding: 16px;
          color: white;
          width: 100%;
          background: rgba(0, 0, 0, var(--dark-secondary-opacity));
        }
        .content {
          display: flex;
          justify-content: space-between;
          padding: 16px 32px 24px 32px;
        }
        .has-plant-image .content {
          padding-bottom: 16px;
        }
        ha-icon {
          color: var(--paper-item-icon-color);
          margin-bottom: 8px;
        }
        .attributes {
          cursor: pointer;
        }
        .attributes div {
          text-align: center;
        }
        .problem {
          color: var(--google-red-500);
          font-weight: bold;
        }
        .uom {
          color: var(--secondary-text-color);
        }
      </style>

      <ha-card
        class$="[[computeImageClass(stateObj.attributes.entity_picture)]]"
      >
        <div
          class="banner"
          style="background-image:url([[stateObj.attributes.entity_picture]])"
        >
          <div class="header">[[computeTitle(stateObj)]]</div>
        </div>
        <div class="content">
          <template
            is="dom-repeat"
            items="[[computeAttributes(stateObj.attributes)]]"
          >
            <div class="attributes" on-click="attributeClicked">
              <div>
                <ha-icon
                  icon="[[computeIcon(item, stateObj.attributes.battery)]]"
                ></ha-icon>
              </div>
              <div
                class$="[[computeAttributeClass(stateObj.attributes.problem, item)]]"
              >
                [[computeValue(stateObj.attributes, item)]]
              </div>
              <div class="uom">
                [[computeUom(stateObj.attributes.unit_of_measurement_dict,
                item)]]
              </div>
            </div>
          </template>
        </div>
      </ha-card>
    `}static get properties(){return{hass:Object,stateObj:Object,config:Object}}constructor(){super(),this.sensors={moisture:"hass:water",temperature:"hass:thermometer",brightness:"hass:white-balance-sunny",conductivity:"hass:emoticon-poop",battery:"hass:battery"}}computeTitle(e){return this.config&&this.config.name||Object(d.a)(e)}computeAttributes(e){return Object.keys(this.sensors).filter(t=>t in e)}computeIcon(e,t){const a=this.sensors[e];if("battery"===e){if(t<=5)return`${a}-alert`;if(t<95)return`${a}-${10*Math.round(t/10-.01)}`}return a}computeValue(e,t){return e[t]}computeUom(e,t){return e[t]||""}computeAttributeClass(e,t){return-1===e.indexOf(t)?"":"problem"}computeImageClass(e){return e?"has-plant-image":""}attributeClicked(e){this.fire("hass-more-info",{entityId:this.stateObj.attributes.sensors[e.model.item]})}});a(305);var y=a(247);customElements.define("ha-card-chooser",class extends r.a{static get properties(){return{cardData:{type:Object,observer:"cardDataChanged"}}}_updateCard(e){Object(y.a)(this,"HA-"+e.cardType.toUpperCase()+"-CARD",e)}createObserver(){this._updatesAllowed=!1,this.observer=new IntersectionObserver(e=>{if(e.length)if(e[0].isIntersecting)this.style.height="",this._detachedChild&&(this.appendChild(this._detachedChild),this._detachedChild=null),this._updateCard(this.cardData),this._updatesAllowed=!0;else{const e=this.offsetHeight;this.style.height=`${e||48}px`,this.lastChild&&(this._detachedChild=this.lastChild,this.removeChild(this.lastChild)),this._updatesAllowed=!1}}),this.observer.observe(this)}cardDataChanged(e){if(e)return window.IntersectionObserver&&"entities"!==e.cardType?(this.observer||this.createObserver(),void(this._updatesAllowed&&this._updateCard(e))):(this.observer&&(this.observer.unobserve(this),this.observer=null),this.style.height="",void this._updateCard(e))}});a(254);customElements.define("ha-demo-badge",class extends r.a{static get template(){return i.a`
      <style>
        :host {
          --ha-label-badge-color: #dac90d;
        }
      </style>

      <ha-label-badge
        icon="hass:emoticon"
        label="Demo"
        description=""
      ></ha-label-badge>
    `}});var v=a(308),_=a(270);const w={camera:4,history_graph:4,media_player:3,persistent_notification:0,plant:3,weather:4},x={configurator:-20,persistent_notification:-15,updater:0,sun:1,person:2,device_tracker:3,alarm_control_panel:4,timer:5,sensor:6,binary_sensor:7,mailbox:8},k=e=>e in x?x[e]:100,O=(e,t)=>e.priority-t.priority,j=(e,t)=>{const a=(e.attributes.friendly_name||e.entity_id).toLowerCase(),i=(t.attributes.friendly_name||t.entity_id).toLowerCase();return a<i?-1:a>i?1:0},C=(e,t)=>{Object.keys(e).map(t=>e[t]).sort(O).forEach(e=>{e.states.sort(j),t(e)})};customElements.define("ha-cards",class extends r.a{static get template(){return i.a`
      <style include="iron-flex iron-flex-factors"></style>
      <style>
        :host {
          display: block;
          padding: 4px 4px 0;
          transform: translateZ(0);
          position: relative;
        }

        .badges {
          font-size: 85%;
          text-align: center;
          padding-top: 16px;
        }

        .column {
          max-width: 500px;
          overflow-x: hidden;
        }

        ha-card-chooser {
          display: block;
          margin: 4px 4px 8px;
        }

        @media (max-width: 500px) {
          :host {
            padding-left: 0;
            padding-right: 0;
          }

          ha-card-chooser {
            margin-left: 0;
            margin-right: 0;
          }
        }

        @media (max-width: 599px) {
          .column {
            max-width: 600px;
          }
        }
      </style>

      <div id="main">
        <template is="dom-if" if="[[cards.badges.length]]">
          <div class="badges">
            <template is="dom-if" if="[[cards.demo]]">
              <ha-demo-badge></ha-demo-badge>
            </template>

            <ha-badges-card
              states="[[cards.badges]]"
              hass="[[hass]]"
            ></ha-badges-card>
          </div>
        </template>

        <div class="horizontal layout center-justified">
          <template is="dom-repeat" items="[[cards.columns]]" as="column">
            <div class="column flex-1">
              <template is="dom-repeat" items="[[column]]" as="card">
                <ha-card-chooser card-data="[[card]]"></ha-card-chooser>
              </template>
            </div>
          </template>
        </div>
      </div>
    `}static get properties(){return{hass:Object,columns:{type:Number,value:2},states:Object,viewVisible:{type:Boolean,value:!1},orderedGroupEntities:Array,cards:Object}}static get observers(){return["updateCards(columns, states, viewVisible, orderedGroupEntities)"]}updateCards(e,t,a,i){a?(!this.$.main.parentNode&&this.$.main._parentNode&&this.$.main._parentNode.appendChild(this.$.main),this._debouncer=c.a.debounce(this._debouncer,l.d.after(10),()=>{this.viewVisible&&(this.cards=this.computeCards(e,t,i))})):this.$.main.parentNode&&(this.$.main._parentNode=this.$.main.parentNode,this.$.main.parentNode.removeChild(this.$.main))}emptyCards(){return{demo:!1,badges:[],columns:[]}}computeCards(e,t,a){const i=this.hass,r=this.emptyCards(),s=[];for(let t=0;t<e;t++)r.columns.push([]),s.push(0);function n(e,t,a){if(0===t.length)return;const n=[],o=[];let l=0;t.forEach(e=>{const t=Object(m.a)(e);t in w&&!e.attributes.custom_ui_state_card?(n.push(e),l+=w[t]):(o.push(e),l++)});const c=function(e){let t=0;for(let e=0;e<s.length;e++){if(s[e]<5){t=e;break}s[e]<s[t]&&(t=e)}return s[t]+=e,t}(l+=o.length>0);o.length>0&&r.columns[c].push({hass:i,cardType:"entities",states:o,groupEntity:a||!1}),n.forEach(e=>{r.columns[c].push({hass:i,cardType:Object(m.a)(e),stateObj:e})})}const o=Object(v.a)(t);a?o.groups.sort((e,t)=>a[e.entity_id]-a[t.entity_id]):o.groups.sort((e,t)=>e.attributes.order-t.attributes.order);const l={},c={},d={};return Object.keys(o.ungrouped).forEach(e=>{const t=o.ungrouped[e],a=Object(m.a)(t);if("a"===a)return void(r.demo=!0);const i=k(a);let s;a in(s=i<0?c:i<10?l:d)||(s[a]={domain:a,priority:i,states:[]}),s[a].states.push(t)}),a?(Object.keys(l).map(e=>l[e]).forEach(e=>{r.badges.push.apply(r.badges,e.states)}),r.badges.sort((e,t)=>a[e.entity_id]-a[t.entity_id])):C(l,e=>{r.badges.push.apply(r.badges,e.states)}),C(c,e=>{n(e.domain,e.states)}),o.groups.forEach(e=>{const a=Object(_.a)(t,e);n(e.entity_id,Object.keys(a).map(e=>a[e]),e)}),C(d,e=>{n(e.domain,e.states)}),r.columns=r.columns.filter(e=>e.length>0),r}});a(179),a(265),a(217);var T=a(306),S=a(307);var E=a(198);const D="group.default_view",P=["persistent_notification","configurator"];customElements.define("ha-panel-states",class extends(Object(p.a)(Object(E.a)(r.a))){static get template(){return i.a`
      <style include="iron-flex iron-positioning ha-style">
        :host {
          -ms-user-select: none;
          -webkit-user-select: none;
          -moz-user-select: none;
        }

        ha-app-layout {
          min-height: 100%;
          background-color: var(--secondary-background-color, #e5e5e5);
        }

        iron-pages {
          height: 100%;
        }

        paper-tabs {
          margin-left: 12px;
          --paper-tabs-selection-bar-color: var(--text-primary-color, #fff);
          text-transform: uppercase;
        }
      </style>
      <app-route
        route="{{route}}"
        pattern="/:view"
        data="{{routeData}}"
        active="{{routeMatch}}"
      ></app-route>
      <ha-app-layout id="layout">
        <app-header effects="waterfall" condenses="" fixed="" slot="header">
          <app-toolbar>
            <ha-menu-button></ha-menu-button>
            <div main-title="">
              [[computeTitle(views, defaultView, locationName)]]
            </div>
            <ha-start-voice-button hass="[[hass]]"></ha-start-voice-button>
          </app-toolbar>

          <div sticky="" hidden$="[[areTabsHidden(views, showTabs)]]">
            <paper-tabs
              scrollable=""
              selected="[[currentView]]"
              attr-for-selected="data-entity"
              on-iron-activate="handleViewSelected"
            >
              <paper-tab data-entity="" on-click="scrollToTop">
                <template is="dom-if" if="[[!defaultView]]">
                  Home
                </template>
                <template is="dom-if" if="[[defaultView]]">
                  <template is="dom-if" if="[[defaultView.attributes.icon]]">
                    <ha-icon
                      title$="[[_computeStateName(defaultView)]]"
                      icon="[[defaultView.attributes.icon]]"
                    ></ha-icon>
                  </template>
                  <template is="dom-if" if="[[!defaultView.attributes.icon]]">
                    [[_computeStateName(defaultView)]]
                  </template>
                </template>
              </paper-tab>
              <template is="dom-repeat" items="[[views]]">
                <paper-tab
                  data-entity$="[[item.entity_id]]"
                  on-click="scrollToTop"
                >
                  <template is="dom-if" if="[[item.attributes.icon]]">
                    <ha-icon
                      title$="[[_computeStateName(item)]]"
                      icon="[[item.attributes.icon]]"
                    ></ha-icon>
                  </template>
                  <template is="dom-if" if="[[!item.attributes.icon]]">
                    [[_computeStateName(item)]]
                  </template>
                </paper-tab>
              </template>
            </paper-tabs>
          </div>
        </app-header>

        <iron-pages
          attr-for-selected="data-view"
          selected="[[currentView]]"
          selected-attribute="view-visible"
        >
          <ha-cards
            data-view=""
            states="[[viewStates]]"
            columns="[[_columns]]"
            hass="[[hass]]"
            panel-visible="[[panelVisible]]"
            ordered-group-entities="[[orderedGroupEntities]]"
          ></ha-cards>

          <template is="dom-repeat" items="[[views]]">
            <ha-cards
              data-view$="[[item.entity_id]]"
              states="[[viewStates]]"
              columns="[[_columns]]"
              hass="[[hass]]"
              panel-visible="[[panelVisible]]"
              ordered-group-entities="[[orderedGroupEntities]]"
            ></ha-cards>
          </template>
        </iron-pages>
      </ha-app-layout>
    `}static get properties(){return{hass:{type:Object,value:null,observer:"hassChanged"},narrow:{type:Boolean,value:!1},panelVisible:{type:Boolean,value:!1},route:Object,routeData:Object,routeMatch:Boolean,_columns:{type:Number,value:1},locationName:{type:String,value:"",computed:"_computeLocationName(hass)"},currentView:{type:String,computed:"_computeCurrentView(hass, routeMatch, routeData)"},views:{type:Array},defaultView:{type:Object},viewStates:{type:Object,computed:"computeViewStates(currentView, hass, defaultView)"},orderedGroupEntities:{type:Array,computed:"computeOrderedGroupEntities(currentView, hass, defaultView)"},showTabs:{type:Boolean,value:!0}}}static get observers(){return["_updateColumns(narrow, hass.dockedSidebar)"]}ready(){this._updateColumns=this._updateColumns.bind(this),this.mqls=[300,600,900,1200].map(e=>matchMedia(`(min-width: ${e}px)`)),super.ready()}connectedCallback(){super.connectedCallback(),this.mqls.forEach(e=>e.addListener(this._updateColumns))}disconnectedCallback(){super.disconnectedCallback(),this.mqls.forEach(e=>e.removeListener(this._updateColumns))}_updateColumns(){const e=this.mqls.reduce((e,t)=>e+t.matches,0);this._columns=Math.max(1,e-(!this.narrow&&this.hass.dockedSidebar))}areTabsHidden(e,t){return!e||!e.length||!t}scrollToTop(){var e=this.$.layout.header.scrollTarget,t=Math.random(),a=Date.now(),i=e.scrollTop,r=0-i;this._currentAnimationId=t,function s(){var n,o=Date.now()-a;o>200?e.scrollTop=0:this._currentAnimationId===t&&(e.scrollTop=(n=o,-r*(n/=200)*(n-2)+i),requestAnimationFrame(s.bind(this)))}.call(this)}handleViewSelected(e){const t=e.detail.item.getAttribute("data-entity")||null;if(t!==this.currentView){let e="/states";t&&(e+="/"+t),this.navigate(e)}}_computeCurrentView(e,t,a){return t&&e.states[a.view]&&e.states[a.view].attributes.view?a.view:""}computeTitle(e,t,a){return e&&e.length>0&&!t&&"Home"===a||!a?"Home Assistant":a}_computeStateName(e){return Object(d.a)(e)}_computeLocationName(e){return function(e){return e&&e.config.location_name}(e)}hassChanged(e){if(!e)return;const t=Object(T.a)(e.states);let a=null;t.length>0&&t[0].entity_id===D&&(a=t.shift()),this.setProperties({views:t,defaultView:a})}isView(e,t){return(e||t)&&this.hass.states[e||D]}_defaultViewFilter(e,t){return!e.states[t].attributes.hidden}_computeDefaultViewStates(e,t){const a={};return t.filter(this._defaultViewFilter.bind(null,e)).forEach(t=>{a[t]=e.states[t]}),a}computeViewStates(e,t,a){const i=Object.keys(t.states);if(!this.isView(e,a))return this._computeDefaultViewStates(t,i);let r;return r=e?Object(S.a)(t.states,t.states[e]):Object(S.a)(t.states,t.states[D]),i.forEach(e=>{const a=t.states[e];P.includes(Object(m.a)(a))&&(r[e]=a)}),r}computeOrderedGroupEntities(e,t,a){if(!this.isView(e,a))return null;for(var i={},r=t.states[e||D].attributes.entity_id,s=0;s<r.length;s++)i[r[s]]=s;return i}})},735:function(e,t,a){"use strict";a.r(t);var i=a(3),r=a(24);a(468);customElements.define("ha-panel-kiosk",class extends r.a{static get template(){return i.a`
      <ha-panel-states
        id="kiosk-states"
        hass="[[hass]]"
        show-menu
        route="[[route]]"
        panel-visible
      ></ha-panel-states>
    `}static get properties(){return{hass:Object,route:Object}}})}}]);
//# sourceMappingURL=799e89c754967444d303.chunk.js.map