@larva.io/webcomponents
Version:
Fentrica SmartUnits WebComponents package
80 lines (75 loc) • 5.53 kB
JavaScript
/*!
* (C) Fentrica http://fentrica.com - Seee LICENSE.md
*/
'use strict';
var index = require('./index-B0SElCD3.js');
var modalController = require('./modal-controller-BsEk6ujH.js');
require('./helpers-DNl8-cDE.js');
require('./theme-3s-LQhJl.js');
const areaCss = "slot-fb[hidden],slot[hidden]{display:initial !important}.details{padding:3rem 0 0 0}.details lar-button-group{-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}.actions{min-height:60px}lar-list-item{background-color:var(--lar-background-color-step-100, rgb(25.5, 25.5, 25.5)) !important;color:var(--lar-text-color, #fff) !important}.spacer{margin-top:1.5rem;margin-bottom:1.5rem}.circle{background-color:var(--lar-background-color-step-200, #333333) !important;border-radius:50%;display:inline-block;padding:0.5rem;width:2rem;height:2rem;margin-right:1rem}.circle lar-icon{display:block;width:100%;height:100%}.zone-list h4{margin:0;padding:0}.zone-list h4 lar-badge{margin-top:0.2rem;margin-right:0.3rem;font-weight:normal}.zone-selectors{text-align:center;margin-bottom:1rem}.zone-selectors lar-button{margin:0.2rem}.zone-list lar-badge{margin-top:0.3rem}lar-button.zone-group{--lar-button-font-size-small:.95rem;--lar-button-padding-top-small:.4rem;--lar-button-padding-bottom-small:.4rem;--lar-button-padding-left-small:.4rem;--lar-button-padding-right-small:.4rem}.center{text-align:center}";
const AreaContent = class {
constructor(hostRef) {
index.registerInstance(this, hostRef);
this.arm = index.createEvent(this, "arm");
this.disarm = index.createEvent(this, "disarm");
this.output = index.createEvent(this, "output");
this.armed = false;
this.zoneopened = false;
this.hastroubles = false;
this.alarm = false;
this.loading = true;
}
async showModal(title, subTitle, component) {
this.modal = await modalController.createModal({
mainTitle: title,
subTitle,
color: this.colorModal || this.color,
animation: 'bottom',
iconSmall: this.loading ? 'loading' : '',
colorHeaderInputs: this.color,
icon: this.icon,
headerSize: 'small',
onLarmodaldiddismiss: () => {
this.modal = undefined;
this.modalComponent = undefined;
},
component,
componentProps: {
zones: this.zones,
troubles: this.troubles,
onOutput: (evt) => this.output.emit(evt.detail),
color: this.color,
}
});
await this.modal.present();
this.modalComponent = await this.modal.getComponent();
}
async disconnectedCallback() {
var _a;
return (_a = this.modal) === null || _a === void 0 ? void 0 : _a.dismiss();
}
render() {
if (this.modalComponent) {
this.modalComponent.element.setAttribute('zones', this.zones);
this.modalComponent.element.setAttribute('troubles', this.troubles);
this.modalComponent.element.setAttribute('color', this.color);
}
return [
index.h("div", { key: 'c723ffaffe3e0f7728aad82032a7aeda1e261a10', class: "actions" }, (this.armed || this.alarm)
?
index.h("lar-button", { onClick: () => this.disarm.emit(), color: this.color, disabled: this.loading }, index.h("lar-icon", { icon: "unlock" }), " ", index.h("lar-translate", { t: "area.disarm" }))
:
index.h("lar-button-group", null, index.h("lar-button", { disabled: this.zoneopened || this.loading, onClick: () => this.hastroubles ? this.showModal('area.overrideAndBypass', 'area.selectZonesToBypass', 'lar-area-bypass') : this.arm.emit(), color: this.color }, index.h("lar-icon", { icon: "lock" }), " ", index.h("lar-translate", { t: "area.arm" })), index.h("lar-button", { disabled: this.loading, onClick: () => this.showModal('area.partialarm', 'area.selectZonesToBypass', 'lar-area-bypass'), color: this.color === 'dark' ? 'light' : 'dark' }, index.h("lar-icon", { icon: "halflock" }), " ", index.h("lar-translate", { t: "area.partialarm" })))),
index.h("div", { key: '5d7b55566d25b648acd76d22faaf439fc562e05f', class: "details" }, index.h("lar-button-group", { key: 'e5b19daa536f58ff794ebe7786acb50352afc1da' }, this.hastroubles
&&
index.h("lar-button", { key: 'd1e4ffae39af91381d9ac83060f5ac8473310bff', color: "warning", size: "small", expand: "block", outline: true, onClick: () => this.showModal('area.troubles', '', 'lar-area-troubles') }, index.h("lar-icon", { key: '3fad9ce6e0c6a02029e116d23cecf2951dc4cf96', icon: "warning" }), "\u00A0", index.h("lar-translate", { key: '9a825a5ef5dd8ca817c7fb191d95b79704e3b40d', t: "area.troubles" })), index.h("lar-button", { key: '5f4d787a4d4573bf1961252e08d43e998a8b6351', color: this.color, size: "small", expand: "block", outline: true, onClick: () => this.showModal('area.zonemonitor', '', 'lar-area-zones') }, index.h("lar-translate", { key: '891581ff567c1ef2f3b00ac4db6aa0357cb40cf8', t: "area.zonemonitor" }), "\u00A0", this.zoneopened
?
index.h("lar-icon", { icon: "unlock" })
:
index.h("lar-icon", { icon: "lock" }))))
];
}
};
AreaContent.style = areaCss;
exports.lar_area_content = AreaContent;
//# sourceMappingURL=lar-area-content.entry.cjs.js.map