c.4204ca09.js 9.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191
  1. import{a as e,h as t,e as o,$ as r,aM as i,r as a,n as s,o as n,aL as d,d as c}from"./main-ad130be7.js";import"./c.2d5ed670.js";import"./c.9b92f489.js";import"./c.82eccc94.js";import"./c.4feb0cb8.js";import"./c.0ca5587f.js";import"./c.5d3ce9d6.js";e([s("ha-icon-overflow-menu")],(function(e,t){return{F:class extends t{constructor(...t){super(...t),e(this)}},d:[{kind:"field",decorators:[o({attribute:!1})],key:"hass",value:void 0},{kind:"field",decorators:[o({type:Array})],key:"items",value:()=>[]},{kind:"field",decorators:[o({type:Boolean})],key:"narrow",value:()=>!1},{kind:"method",key:"render",value:function(){return r`
  2. ${this.narrow?r` <!-- Collapsed representation for small screens -->
  3. <ha-button-menu
  4. @click=${this._handleIconOverflowMenuOpened}
  5. @closed=${this._handleIconOverflowMenuClosed}
  6. class="ha-icon-overflow-menu-overflow"
  7. corner="BOTTOM_START"
  8. absolute
  9. >
  10. <ha-icon-button
  11. .label=${this.hass.localize("ui.common.overflow_menu")}
  12. .path=${i}
  13. slot="trigger"
  14. ></ha-icon-button>
  15. ${this.items.map((e=>r`
  16. <mwc-list-item
  17. graphic="icon"
  18. .disabled=${e.disabled}
  19. @click=${e.action}
  20. >
  21. <div slot="graphic">
  22. <ha-svg-icon .path=${e.path}></ha-svg-icon>
  23. </div>
  24. ${e.label}
  25. </mwc-list-item>
  26. `))}
  27. </ha-button-menu>`:r`
  28. <!-- Icon representation for big screens -->
  29. ${this.items.map((e=>e.narrowOnly?"":r`<div>
  30. ${e.tooltip?r`<paper-tooltip animation-delay="0" position="left">
  31. ${e.tooltip}
  32. </paper-tooltip>`:""}
  33. <ha-icon-button
  34. @click=${e.action}
  35. .label=${e.label}
  36. .path=${e.path}
  37. .disabled=${e.disabled}
  38. ></ha-icon-button>
  39. </div> `))}
  40. `}
  41. `}},{kind:"method",key:"_handleIconOverflowMenuOpened",value:function(){const e=this.closest(".mdc-data-table__row");e&&(e.style.zIndex="1")}},{kind:"method",key:"_handleIconOverflowMenuClosed",value:function(){const e=this.closest(".mdc-data-table__row");e&&(e.style.zIndex="")}},{kind:"get",static:!0,key:"styles",value:function(){return a`
  42. :host {
  43. display: flex;
  44. justify-content: flex-end;
  45. }
  46. `}}]}}),t);const l=e=>t=>({kind:"method",placement:"prototype",key:t.key,descriptor:{set(e){this[`__${String(t.key)}`]=e},get(){return this[`__${String(t.key)}`]},enumerable:!0,configurable:!0},finisher(o){const r=o.prototype.connectedCallback;o.prototype.connectedCallback=function(){if(r.call(this),this[t.key]){const o=this.renderRoot.querySelector(e);if(!o)return;o.scrollTop=this[t.key]}}}});e([s("hacs-repository-card")],(function(e,t){return{F:class extends t{constructor(...t){super(...t),e(this)}},d:[{kind:"field",decorators:[o({attribute:!1})],key:"hass",value:void 0},{kind:"field",decorators:[o({attribute:!1})],key:"hacs",value:void 0},{kind:"field",decorators:[o({attribute:!1})],key:"repository",value:void 0},{kind:"field",decorators:[o({type:Boolean})],key:"narrow",value:void 0},{kind:"get",key:"_borderClass",value:function(){const e={};return this.hacs.addedToLovelace(this.hacs,this.repository)&&"pending-restart"!==this.repository.status?this.repository.pending_upgrade?e["status-update"]=!0:this.repository.new&&!this.repository.installed&&(e["status-new"]=!0):e["status-issue"]=!0,0!==Object.keys(e).length&&(e["status-border"]=!0),e}},{kind:"get",key:"_headerClass",value:function(){const e={};return this.hacs.addedToLovelace(this.hacs,this.repository)&&"pending-restart"!==this.repository.status?this.repository.pending_upgrade?e["update-header"]=!0:this.repository.new&&!this.repository.installed?e["new-header"]=!0:e["default-header"]=!0:e["issue-header"]=!0,e}},{kind:"get",key:"_headerTitle",value:function(){return this.hacs.addedToLovelace(this.hacs,this.repository)?"pending-restart"===this.repository.status?this.hacs.localize("repository_card.pending_restart"):this.repository.pending_upgrade?this.hacs.localize("repository_card.pending_update"):this.repository.new&&!this.repository.installed?this.hacs.localize("repository_card.new_repository"):"":this.hacs.localize("repository_card.not_loaded")}},{kind:"method",key:"render",value:function(){return r`
  47. <a href="/hacs/repository/${this.repository.id}">
  48. <ha-card class=${n(this._borderClass)} ?narrow=${this.narrow} outlined>
  49. <div class="card-content">
  50. <div class="group-header">
  51. <div class="status-header ${n(this._headerClass)}">${this._headerTitle}</div>
  52. <div class="title pointer">
  53. <h1>${this.repository.name}</h1>
  54. ${"integration"!==this.repository.category?r` <ha-chip>
  55. ${this.hacs.localize(`common.${this.repository.category}`)}
  56. </ha-chip>`:""}
  57. </div>
  58. </div>
  59. <div class="description">${this.repository.description}</div>
  60. </div>
  61. <div class="card-actions">
  62. ${this.repository.new&&!this.repository.installed?r`<div>
  63. <mwc-button class="status-new" @click=${this._setNotNew}>
  64. ${this.hacs.localize("repository_card.dismiss")}
  65. </mwc-button>
  66. </div>`:this.repository.pending_upgrade&&this.hacs.addedToLovelace(this.hacs,this.repository)?r`<div>
  67. <mwc-button class="update-header" @click=${this._updateRepository} raised>
  68. ${this.hacs.localize("common.update")}
  69. </mwc-button>
  70. </div> `:""}
  71. </div>
  72. </ha-card>
  73. </a>
  74. `}},{kind:"method",key:"_updateRepository",value:function(e){e.preventDefault(),this.dispatchEvent(new CustomEvent("hacs-dialog",{detail:{type:"update",repository:this.repository.id},bubbles:!0,composed:!0}))}},{kind:"method",key:"_setNotNew",value:async function(e){e.preventDefault(),await d(this.hass,{repository:String(this.repository.id)})}},{kind:"get",static:!0,key:"styles",value:function(){return[c,a`
  75. ha-card {
  76. display: flex;
  77. flex-direction: column;
  78. height: 195px;
  79. width: 480px;
  80. }
  81. .title {
  82. display: flex;
  83. justify-content: space-between;
  84. }
  85. .card-content {
  86. padding: 0 0 3px 0;
  87. height: 100%;
  88. }
  89. .card-actions {
  90. border-top: none;
  91. bottom: 0;
  92. display: flex;
  93. flex-direction: row-reverse;
  94. justify-content: space-between;
  95. align-items: center;
  96. padding: 5px;
  97. }
  98. .group-header {
  99. height: auto;
  100. align-content: center;
  101. }
  102. .group-header h1 {
  103. margin: 0;
  104. padding: 8px 16px;
  105. font-size: 22px;
  106. }
  107. h1 {
  108. margin-top: 0;
  109. min-height: 24px;
  110. }
  111. a {
  112. all: unset;
  113. cursor: pointer;
  114. }
  115. .description {
  116. opacity: var(--dark-primary-opacity);
  117. font-size: 14px;
  118. padding: 8px 16px;
  119. max-height: 52px;
  120. overflow: hidden;
  121. }
  122. .status-new {
  123. border-color: var(--hcv-color-new);
  124. --mdc-theme-primary: var(--hcv-color-new);
  125. }
  126. .status-update {
  127. border-color: var(--hcv-color-update);
  128. }
  129. .status-issue {
  130. border-color: var(--hcv-color-error);
  131. }
  132. .new-header {
  133. background-color: var(--hcv-color-new);
  134. color: var(--hcv-text-color-on-background);
  135. }
  136. .issue-header {
  137. background-color: var(--hcv-color-error);
  138. color: var(--hcv-text-color-on-background);
  139. }
  140. .update-header {
  141. background-color: var(--hcv-color-update);
  142. color: var(--hcv-text-color-on-background);
  143. }
  144. .default-header {
  145. padding: 2px 0 !important;
  146. }
  147. mwc-button.update-header {
  148. --mdc-theme-primary: var(--hcv-color-update);
  149. --mdc-theme-on-primary: var(--hcv-text-color-on-background);
  150. }
  151. .status-border {
  152. border-style: solid;
  153. border-width: min(var(--ha-card-border-width, 1px), 10px);
  154. }
  155. .status-header {
  156. top: 0;
  157. padding: 6px 1px;
  158. margin: -1px;
  159. width: 100%;
  160. font-weight: 500;
  161. text-align: center;
  162. left: 0;
  163. border-top-left-radius: var(--ha-card-border-radius, 4px);
  164. border-top-right-radius: var(--ha-card-border-radius, 4px);
  165. }
  166. ha-card[narrow] {
  167. width: calc(100% - 24px);
  168. margin: 11px;
  169. }
  170. ha-chip {
  171. padding: 4px;
  172. margin-top: 3px;
  173. }
  174. `]}}]}}),t);export{l as r};