diff --git a/.vscode/tasks.json b/.vscode/tasks.json new file mode 100644 index 00000000..ee855146 --- /dev/null +++ b/.vscode/tasks.json @@ -0,0 +1,12 @@ +{ + "version": "2.0.0", + "tasks": [ + { + "type": "npm", + "script": "start", + "problemMatcher": [], + "label": "npm: start", + "detail": "rollup -c --watch" + } + ] +} \ No newline at end of file diff --git a/package.json b/package.json index 46bafe52..19dd9c8b 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "boilerplate-card", - "version": "1.1.9", + "version": "1.2.0", "description": "Lovelace boilerplate-card", "keywords": [ "home-assistant", @@ -24,7 +24,7 @@ "@babel/core": "^7.6.4", "@babel/plugin-proposal-class-properties": "^7.5.5", "@babel/plugin-proposal-decorators": "^7.4.0", - "@rollup/plugin-json": "^4.0.0", + "@rollup/plugin-json": "^4.1.0", "@typescript-eslint/eslint-plugin": "^2.6.0", "@typescript-eslint/parser": "^2.6.0", "eslint": "^6.6.0", @@ -44,9 +44,9 @@ "typescript": "^3.6.4" }, "scripts": { - "start": "rollup -c --watch", + "start": "rollup -c rollup.config.dev.js --watch", "build": "npm run lint && npm run rollup", "lint": "eslint src/*.ts", "rollup": "rollup -c" } -} +} \ No newline at end of file diff --git a/rollup.config.dev.js b/rollup.config.dev.js new file mode 100644 index 00000000..6a680247 --- /dev/null +++ b/rollup.config.dev.js @@ -0,0 +1,32 @@ +import resolve from "rollup-plugin-node-resolve"; +import typescript from "rollup-plugin-typescript2"; +import babel from "rollup-plugin-babel"; +import serve from "rollup-plugin-serve"; +import { terser } from "rollup-plugin-terser"; +import json from '@rollup/plugin-json'; + +export default { + input: ["src/boilerplate-card.ts"], + output: { + dir: "./dist", + format: "es", + }, + plugins: [ + resolve(), + typescript(), + json(), + babel({ + exclude: "node_modules/**", + }), + terser(), + serve({ + contentBase: "./dist", + host: "0.0.0.0", + port: 5000, + allowCrossOrigin: true, + headers: { + "Access-Control-Allow-Origin": "*", + }, + }), + ], +}; diff --git a/src/boilerplate-card.ts b/src/boilerplate-card.ts index a7869de8..169f8034 100644 --- a/src/boilerplate-card.ts +++ b/src/boilerplate-card.ts @@ -45,7 +45,7 @@ export class BoilerplateCard extends LitElement { // TODO Add any properities that should cause your element to re-render here @property() public hass!: HomeAssistant; - @property() private _config!: BoilerplateCardConfig; + @property() private config!: BoilerplateCardConfig; public setConfig(config: BoilerplateCardConfig): void { // TODO Check for required fields and that they are of the proper format @@ -57,39 +57,43 @@ export class BoilerplateCard extends LitElement { getLovelace().setEditMode(true); } - this._config = { + this.config = { name: 'Boilerplate', ...config, }; } protected shouldUpdate(changedProps: PropertyValues): boolean { + if (!this.config) { + return false; + } + return hasConfigOrEntityChanged(this, changedProps, false); } protected render(): TemplateResult | void { // TODO Check for stateObj or other necessary things and render a warning if missing - if (this._config.show_warning) { + if (this.config.show_warning) { return this.showWarning(localize('common.show_warning')); } return html` `; } private _handleAction(ev: ActionHandlerEvent): void { - if (this.hass && this._config && ev.detail.action) { - handleAction(this, this.hass, this._config, ev.detail.action); + if (this.hass && this.config && ev.detail.action) { + handleAction(this, this.hass, this.config, ev.detail.action); } } @@ -104,7 +108,7 @@ export class BoilerplateCard extends LitElement { errorCard.setConfig({ type: 'error', error, - origConfig: this._config, + origConfig: this.config, }); return html` diff --git a/src/const.ts b/src/const.ts index 4c9062ba..38e11f46 100644 --- a/src/const.ts +++ b/src/const.ts @@ -1 +1 @@ -export const CARD_VERSION = '1.1.7'; +export const CARD_VERSION = '1.2.0'; diff --git a/src/editor.ts b/src/editor.ts index e5f568bd..f69eefb7 100644 --- a/src/editor.ts +++ b/src/editor.ts @@ -49,9 +49,21 @@ export class BoilerplateCardEditor extends LitElement implements LovelaceCardEdi @property() public hass?: HomeAssistant; @property() private _config?: BoilerplateCardConfig; @property() private _toggle?: boolean; + @property() private _helpers?: any; + private _initialized = false; public setConfig(config: BoilerplateCardConfig): void { this._config = config; + + this.loadCardHelpers(); + } + + protected shouldUpdate(): boolean { + if (!this._initialized) { + this._initialize(); + } + + return true; } get _name(): string { @@ -111,10 +123,13 @@ export class BoilerplateCardEditor extends LitElement implements LovelaceCardEdi } protected render(): TemplateResult | void { - if (!this.hass) { + if (!this.hass || !this._helpers) { return html``; } + // The climate more-info has ha-switch and paper-dropdown-menu elements that are lazy loaded unless explicitly done here + this._helpers.importMoreInfoControl('climate'); + // You can restrict on domain type const entities = Object.keys(this.hass.states).filter(eid => eid.substr(0, eid.indexOf('.')) === 'sun'); @@ -218,20 +233,20 @@ export class BoilerplateCardEditor extends LitElement implements LovelaceCardEdi @value-changed=${this._valueChanged} >
- Show Warning? - Show Error? + + + + + + ` : ''} @@ -239,6 +254,17 @@ export class BoilerplateCardEditor extends LitElement implements LovelaceCardEdi `; } + private _initialize(): void { + if (this.hass === undefined) return; + if (this._config === undefined) return; + if (this._helpers === undefined) return; + this._initialized = true; + } + + private async loadCardHelpers(): Promise { + this._helpers = await (window as any).loadCardHelpers(); + } + private _toggleAction(ev): void { this._toggleThing(ev, options.actions.options); } @@ -301,8 +327,9 @@ export class BoilerplateCardEditor extends LitElement implements LovelaceCardEdi .values { padding-left: 16px; background: var(--secondary-background-color); + display: grid; } - ha-switch { + ha-formfield { padding-bottom: 8px; } `; diff --git a/src/localize/languages/en.json b/src/localize/languages/en.json index d5440f55..edfac264 100644 --- a/src/localize/languages/en.json +++ b/src/localize/languages/en.json @@ -4,4 +4,4 @@ "invalid_configuration": "Invalid configuration", "show_warning": "Show Warning" } -} +} \ No newline at end of file