+!function(e){var t={};function i(n){if(t[n])return t[n].exports;var o=t[n]={i:n,l:!1,exports:{}};return e[n].call(o.exports,o,o.exports,i),o.l=!0,o.exports}i.m=e,i.c=t,i.d=function(e,t,n){i.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},i.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},i.t=function(e,t){if(1&t&&(e=i(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(i.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)i.d(n,o,function(t){return e[t]}.bind(null,o));return n},i.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return i.d(t,"a",t),t},i.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},i.p="",i(i.s=0)}([function(e,t,i){"use strict";i.r(t);const n=Object.getPrototypeOf(customElements.get("home-assistant-main")),o=n.prototype.html,s=n.prototype.css;function r(e,t,i=null){if((e=new Event(e,{bubbles:!0,cancelable:!1,composed:!0})).detail=t||{},i)i.dispatchEvent(e);else{var n=document.querySelector("home-assistant");(n=(n=(n=(n=(n=(n=(n=(n=(n=(n=(n=n&&n.shadowRoot)&&n.querySelector("home-assistant-main"))&&n.shadowRoot)&&n.querySelector("app-drawer-layout partial-panel-resolver"))&&n.shadowRoot||n)&&n.querySelector("ha-panel-lovelace"))&&n.shadowRoot)&&n.querySelector("hui-root"))&&n.shadowRoot)&&n.querySelector("ha-app-layout #view"))&&n.firstElementChild)&&n.dispatchEvent(e)}}const a="custom:";function c(e,t){const i=document.createElement("hui-error-card");return i.setConfig({type:"error",error:e,config:t}),i}function l(e,t){if(!t||"object"!=typeof t||!t.type)return c(`No ${e} type configured`,t);let i=t.type;if(i=i.startsWith(a)?i.substr(a.length):`hui-${i}-${e}`,customElements.get(i))return function(e,t){const i=document.createElement(e);try{i.setConfig(t)}catch(e){return c(e,t)}return i}(i,t);const n=c(`Custom element doesn't exist: ${i}.`,t);n.style.display="None";const o=setTimeout(()=>{n.style.display=""},2e3);return customElements.whenDefined(i).then(()=>{clearTimeout(o),r("ll-rebuild",{},n)}),n}customElements.define("fold-entity-row",class extends n{static get properties(){return{hass:{},open:Boolean}}setConfig(e){this._config=Object.assign({},{open:!1,padding:20,group_config:{}},e),this.open=this._config.open,this._head=this._renderRow(this._config.head,!0);let t=this._config.items;this._config.entities&&(t=this._config.entities),"string"==typeof this._config.head&&this._config.head.startsWith("group.")&&(t=document.querySelector("home-assistant").hass.states[this._config.head].attributes.entity_id),t&&(this._entities=t.map(e=>this._renderRow(e)))}_renderRow(e,t=!1){e="string"==typeof e?{entity:e}:e,t||(e=Object.assign({},this._config.group_config,e));const i=function(e){const t=new Set(["call-service","divider","section","weblink"]);if(!e||"object"!=typeof e||!e.entity&&!e.type)return c("Invalid configuration given.",e);const i=e.type||"default";if(t.has(i)||i.startsWith(a))return l("row",e);const n=e.entity.split(".",1)[0];return Object.assign(e,{type:{alert:"toggle",automation:"toggle",climate:"climate",cover:"cover",fan:"toggle",group:"group",input_boolean:"toggle",input_number:"input-number",input_select:"input-select",input_text:"input-text",light:"toggle",lock:"lock",media_player:"media-player",remote:"toggle",scene:"scene",script:"script",sensor:"sensor",timer:"timer",switch:"toggle",vacuum:"toggle",water_heater:"climate",input_datetime:"input-datetime"}[n]||"text"}),l("entity-row",e)}(e);return e.entity&&!["input_number","input_select","input_text","input_datetime","scene","weblink"].includes(e.entity.split(".",1)[0])?(i.classList.add("state-card-dialog"),i.addEventListener("click",()=>{r("hass-more-info",{entityId:e.entity},this)})):t&&i.addEventListener("click",()=>this.open=!this.open),t&&"section"===e.type&&i.updateComplete.then(()=>{i.shadowRoot.querySelector(".divider").style.marginRight="-56px"}),i}render(){return this._head.hass=this.hass,this._entities&&this._entities.forEach(e=>e.hass=this.hass),o`
+
+
${this._head}
-
-
+
+
${this._entities}
- `;
- }
+ `}static get styles(){return s`
+ #head {
+ display: flex;
+ }
+ #entity {
+ flex: 1 1 auto;
+ width: 0px;
+ }
+ #toggle {
+ flex 0 1 40px;
+ display: flex;
+ align-items: center;
+ }
+ #items {
+ padding: 0;
+ margin: 0;
+ overflow: hidden;
+ max-height: 0;
+ }
+ #items[open] {
+ overflow: none;
+ max-height: none;
+ }
+ ha-icon {
+ width: 40px;
+ }
+ .state-card-dialog {
+ cursor: pointer;
+ }
- _renderStyle() {
- return cardTools.LitHtml`
-
- `;
- }
-
-
- firstUpdated() {
- this.hass = this._hass;
- }
-
- _toggle()
- {
- this._closed = !this._closed;
- }
-
- _renderElement(conf, options) {
- conf = (typeof conf === "string") ? {entity: conf} : conf;
- conf = Object.assign(conf, options);
- const element = cardTools.createEntityRow(conf);
- if(this._hass) element.hass = this._hass;
-
- const DOMAINS_HIDE_MORE_INFO = [
- "input_number",
- "input_select",
- "input_text",
- "scene",
- "weblink",
- ];
- if (conf.entity && !DOMAINS_HIDE_MORE_INFO.includes(conf.entity.split(".")[0])) {
- element.classList.add("state-card-dialog");
- element.addEventListener("click", () => {
- cardTools.moreInfo(conf.entity);
- });
- }
- return element;
- }
-
- _renderHead(conf) {
- const element = this._renderElement(conf);
-
- // Stretch the line above section rows
- if (conf.type && conf.type === "section") {
- element.updateComplete.then(() => {
- const divider = element.shadowRoot.querySelector(".divider");
- divider.style.marginRight = "-53px";
- });
- }
- return element;
- }
-
- _renderItem(conf, options) {
- const element = this._renderElement(conf, options);
- return cardTools.LitHtml`
${element}
`;
- }
-
- setConfig(config) {
- if(!this._config) {
- if(!cardTools) throw new Error(`Can't find card-tools. See https://github.com/thomasloven/lovelace-card-tools`);
- cardTools.checkVersion(0.1);
- this._config = config;
- this._closed = !config.open;
-
- this._head = this._renderHead(config.head);
- }
-
- const head = (typeof config.head === "string") ? config.head : config.head.entity;
- let items = config.items
- if (config.entities)
- items = config.entities;
- if (head && head.split('.')[0] === "group")
- items = cardTools.hass.states[head].attributes.entity_id;
-
- if(items)
- this._entities = items.map((e) => this._renderItem(e, config.group_config));
- this.requestUpdate();
- }
-
- set hass(hass) {
- this._hass = hass;
- this._head.hass = hass;
- this.shadowRoot.querySelectorAll("#items > div > *").forEach((e) => e.hass = hass);
- }
-}
-
-customElements.define('fold-entity-row', FoldEntityRow);
-});
-
-window.setTimeout(() => {
- if(customElements.get('card-tools')) return;
- customElements.define('fold-entity-row', class extends HTMLElement{
- setConfig() { throw new Error("Can't find card-tools. See https://github.com/thomasloven/lovelace-card-tools");}
- });
-}, 2000);
+ `}})}]);
\ No newline at end of file
diff --git a/src/main.js b/src/main.js
new file mode 100644
index 0000000..8252998
--- /dev/null
+++ b/src/main.js
@@ -0,0 +1,135 @@
+import { LitElement, html, css } from "/card-tools/lit-element.js";
+import { fireEvent } from "/card-tools/event.js";
+import { createEntityRow } from "/card-tools/lovelace-element.js";
+import { hass } from "/card-tools/hass.js";
+
+class FoldEntityRow extends LitElement {
+ static get properties() {
+ return {
+ hass: {},
+ open: Boolean,
+ };
+ }
+
+ setConfig(config) {
+ const defaults = {
+ open: false,
+ padding: 20,
+ group_config: {},
+ };
+
+ this._config = Object.assign({}, defaults, config);
+ this.open = this._config.open;
+
+ this._head = this._renderRow(this._config.head, true);
+
+ let items = this._config.items;
+ if (this._config.entities)
+ items = this._config.entities;
+ if (typeof this._config.head === "string" && this._config.head.startsWith("group."))
+ items = hass().states[this._config.head].attributes.entity_id;
+ if (items)
+ this._entities = items.map((e) => this._renderRow(e));
+ }
+
+ _renderRow(conf, head=false) {
+ conf = (typeof conf === "string") ? {entity: conf} : conf;
+
+ if (!head) {
+ conf = Object.assign({}, this._config.group_config, conf);
+ }
+
+ const DOMAINS_HIDE_MORE_INFO = [
+ "input_number",
+ "input_select",
+ "input_text",
+ "input_datetime",
+ "scene",
+ "weblink",
+ ];
+
+ const el = createEntityRow(conf);
+ if (conf.entity && !DOMAINS_HIDE_MORE_INFO.includes(conf.entity.split(".",1)[0])) {
+ el.classList.add("state-card-dialog");
+ el.addEventListener("click", () => {
+ fireEvent("hass-more-info", {entityId: conf.entity}, this);
+ });
+ } else if (head) {
+ el.addEventListener("click", () => this.open = !this.open);
+ }
+
+ if (head && conf.type === "section")
+ el.updateComplete.then(() => {
+ const divider = el.shadowRoot.querySelector(".divider");
+ divider.style.marginRight = "-56px";
+ });
+
+ return el;
+ }
+
+ render() {
+ this._head.hass = this.hass;
+ if (this._entities)
+ this._entities.forEach((e) => e.hass = this.hass);
+ return html`
+
+
+ ${this._head}
+
+
+
+
+
+
+ ${this._entities}
+
+ `;
+ }
+
+ static get styles() {
+ return css`
+ #head {
+ display: flex;
+ }
+ #entity {
+ flex: 1 1 auto;
+ width: 0px;
+ }
+ #toggle {
+ flex 0 1 40px;
+ display: flex;
+ align-items: center;
+ }
+ #items {
+ padding: 0;
+ margin: 0;
+ overflow: hidden;
+ max-height: 0;
+ }
+ #items[open] {
+ overflow: none;
+ max-height: none;
+ }
+ ha-icon {
+ width: 40px;
+ }
+ .state-card-dialog {
+ cursor: pointer;
+ }
+
+ `;
+ }
+
+}
+
+customElements.define('fold-entity-row', FoldEntityRow);
