mirror of
https://github.com/home-assistant/frontend.git
synced 2025-07-13 20:36:35 +00:00
Introduce Lit Element (#1738)
This commit is contained in:
parent
c90e13d35e
commit
1b70b6e88c
@ -34,6 +34,7 @@
|
||||
"@polymer/iron-media-query": "^3.0.1",
|
||||
"@polymer/iron-pages": "^3.0.1",
|
||||
"@polymer/iron-resizable-behavior": "^3.0.1",
|
||||
"@polymer/lit-element": "^0.6.1",
|
||||
"@polymer/neon-animation": "^3.0.1",
|
||||
"@polymer/paper-button": "^3.0.1",
|
||||
"@polymer/paper-card": "^3.0.1",
|
||||
|
@ -1,70 +1,67 @@
|
||||
import { html } from '@polymer/polymer/lib/utils/html-tag.js';
|
||||
import { PolymerElement } from '@polymer/polymer/polymer-element.js';
|
||||
|
||||
import { LitElement, html } from '@polymer/lit-element';
|
||||
|
||||
import './ha-progress-button.js';
|
||||
import EventsMixin from '../../mixins/events-mixin.js';
|
||||
import fireEvent from '../../common/dom/fire_event.js';
|
||||
|
||||
/*
|
||||
* @appliesMixin EventsMixin
|
||||
*/
|
||||
class HaCallApiButton extends EventsMixin(PolymerElement) {
|
||||
static get template() {
|
||||
class HaCallApiButton extends LitElement {
|
||||
render() {
|
||||
return html`
|
||||
<ha-progress-button id="progress" progress="[[progress]]" on-click="buttonTapped" disabled="[[disabled]]"><slot></slot></ha-progress-button>
|
||||
`;
|
||||
<ha-progress-button
|
||||
.progress="${this.progress}"
|
||||
@click="${this._buttonTapped}"
|
||||
?disabled="${this.disabled}"
|
||||
><slot></slot></ha-progress-button>
|
||||
`;
|
||||
}
|
||||
|
||||
constructor() {
|
||||
super();
|
||||
this.method = 'POST';
|
||||
this.data = {};
|
||||
this.disabled = false;
|
||||
this.progress = false;
|
||||
// Can be removed once this is merged:
|
||||
// https://github.com/Polymer/lit-element/pull/244
|
||||
this._buttonTapped = this._buttonTapped.bind(this);
|
||||
}
|
||||
|
||||
static get properties() {
|
||||
return {
|
||||
hass: Object,
|
||||
|
||||
progress: {
|
||||
type: Boolean,
|
||||
value: false,
|
||||
},
|
||||
|
||||
hass: { },
|
||||
progress: Boolean,
|
||||
path: String,
|
||||
|
||||
method: {
|
||||
type: String,
|
||||
value: 'POST',
|
||||
},
|
||||
|
||||
data: {
|
||||
type: Object,
|
||||
value: {},
|
||||
},
|
||||
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
value: false,
|
||||
},
|
||||
method: String,
|
||||
data: { },
|
||||
disabled: Boolean
|
||||
};
|
||||
}
|
||||
|
||||
buttonTapped() {
|
||||
get progressButton() {
|
||||
return this.renderRoot.querySelector('ha-progress-button');
|
||||
}
|
||||
|
||||
async _buttonTapped() {
|
||||
this.progress = true;
|
||||
const eventData = {
|
||||
method: this.method,
|
||||
path: this.path,
|
||||
data: this.data,
|
||||
data: this.data
|
||||
};
|
||||
|
||||
this.hass.callApi(this.method, this.path, this.data)
|
||||
.then((resp) => {
|
||||
this.progress = false;
|
||||
this.$.progress.actionSuccess();
|
||||
eventData.success = true;
|
||||
eventData.response = resp;
|
||||
}, (resp) => {
|
||||
this.progress = false;
|
||||
this.$.progress.actionError();
|
||||
eventData.success = false;
|
||||
eventData.response = resp;
|
||||
}).then(() => {
|
||||
this.fire('hass-api-called', eventData);
|
||||
});
|
||||
try {
|
||||
const resp = await this.hass.callApi(this.method, this.path, this.data);
|
||||
this.progress = false;
|
||||
this.progressButton.actionSuccess();
|
||||
eventData.success = true;
|
||||
eventData.response = resp;
|
||||
} catch (err) {
|
||||
this.progress = false;
|
||||
this.progressButton.actionError();
|
||||
eventData.success = false;
|
||||
eventData.response = err;
|
||||
}
|
||||
|
||||
fireEvent(this, 'hass-api-called', eventData);
|
||||
}
|
||||
}
|
||||
|
||||
|
10
yarn.lock
10
yarn.lock
@ -835,6 +835,12 @@
|
||||
"@polymer/iron-meta" "^3.0.0-pre.26"
|
||||
"@polymer/polymer" "^3.0.0"
|
||||
|
||||
"@polymer/lit-element@^0.6.1":
|
||||
version "0.6.1"
|
||||
resolved "https://registry.yarnpkg.com/@polymer/lit-element/-/lit-element-0.6.1.tgz#56772f8fb0c6d3d73a20a6d17f3bc82ec648664b"
|
||||
dependencies:
|
||||
lit-html "^0.11.4"
|
||||
|
||||
"@polymer/neon-animation@^3.0.0-pre.26", "@polymer/neon-animation@^3.0.1":
|
||||
version "3.0.1"
|
||||
resolved "https://registry.yarnpkg.com/@polymer/neon-animation/-/neon-animation-3.0.1.tgz#6658e4b524abc057477772a7473292493d366c24"
|
||||
@ -7829,6 +7835,10 @@ liftoff@^2.1.0:
|
||||
rechoir "^0.6.2"
|
||||
resolve "^1.1.7"
|
||||
|
||||
lit-html@^0.11.4:
|
||||
version "0.11.4"
|
||||
resolved "https://registry.yarnpkg.com/lit-html/-/lit-html-0.11.4.tgz#fa397d2b2f2d0523ebc136e5a1699aa4e9346152"
|
||||
|
||||
load-json-file@^1.0.0:
|
||||
version "1.1.0"
|
||||
resolved "https://registry.yarnpkg.com/load-json-file/-/load-json-file-1.1.0.tgz#956905708d58b4bab4c2261b04f59f31c99374c0"
|
||||
|
Loading…
x
Reference in New Issue
Block a user