@larva.io/webcomponents
Version:
Fentrica SmartUnits WebComponents package
219 lines (214 loc) • 9.2 kB
JavaScript
/*!
* (C) Fentrica http://fentrica.com - Seee LICENSE.md
*/
import { p as proxyCustomElement, H, c as createEvent, h } from './p-AOwgnAK2.js';
import { i as i18n } from './p-Cga1x4Z-.js';
import { d as defineCustomElement$8 } from './p-B7x5gzZv.js';
import { d as defineCustomElement$7 } from './p-C9VBtzS4.js';
import { d as defineCustomElement$6 } from './p-9A4J2Z7t.js';
import { d as defineCustomElement$5 } from './p-Dsy6MkCW.js';
import { d as defineCustomElement$4 } from './p-CNwVOfNs.js';
import { d as defineCustomElement$3 } from './p-Bk24sn12.js';
import { d as defineCustomElement$2 } from './p-B-fmI6sr.js';
const _2nCommanderDoorCss = "slot-fb[hidden],slot[hidden]{display:initial !important}";
const TwoNCommanderDoor = /*@__PURE__*/ proxyCustomElement(class TwoNCommanderDoor extends H {
constructor(registerHost) {
super();
if (registerHost !== false) {
this.__registerHost();
}
this.__attachShadow();
this.output = createEvent(this, "output");
this.request = createEvent(this, "request");
/////// LarvaNode base properties
this.icon = 'door';
this.color = 'primary';
this.allowIndicationAutoColoring = false;
this.log = false;
this.nodeSize = 'default';
/////// LarvaNode base properties - end
this.loading = true;
this.status = 'Unknown';
this.lockdown = 'Unknown';
this.doorState = 'Unknown';
this.doorSwitchState = 'Unknown';
}
async input(data) {
var _a, _b, _c, _d;
this.loading = false;
this.err = data === null || data === void 0 ? void 0 : data.err;
this.status = (_a = data === null || data === void 0 ? void 0 : data.status) !== null && _a !== void 0 ? _a : 'Unknown';
this.lockdown = (_b = data === null || data === void 0 ? void 0 : data.lockdown) !== null && _b !== void 0 ? _b : 'Unknown';
this.doorState = (_c = data === null || data === void 0 ? void 0 : data.doorState) !== null && _c !== void 0 ? _c : 'Unknown';
this.doorSwitch = data === null || data === void 0 ? void 0 : data.doorSwitch;
this.doorSwitchState = (_d = data === null || data === void 0 ? void 0 : data.doorSwitchState) !== null && _d !== void 0 ? _d : 'Unknown';
}
componentDidLoad() {
const el = this.el.shadowRoot || this.el;
this.node = el.querySelector('lar-node');
this.loading = true;
this.output.emit();
}
handleToggle() {
if (this.doorSwitch === undefined)
return;
// Request: doorSwitchState is 'True' (Unlocked) then send "Off" (Lock), else "On" (Unlock)
const action = this.doorSwitchState === 'True' ? 'Off' : 'On';
this.output.emit({
doorSwitch: action
});
this.loading = true;
}
render() {
const isLockdown = this.lockdown === 'Lockdown' || this.lockdown === 'PartialLockdown';
const isUnlocked = this.doorSwitchState === 'True';
const hasError = !!this.err;
// Icon Logic
let iconSmall = 'door';
if (hasError || isLockdown) {
iconSmall = 'warning';
}
else if (this.doorState !== undefined) {
iconSmall = isUnlocked ? 'unlock' : 'lock';
}
else {
// Feedback based on Door Status if switch not present
if (this.doorState === 'Opened')
iconSmall = 'unlock';
else if (this.doorState === 'Closed')
iconSmall = 'lock';
}
// Value Text Logic
let value = this.status;
if (hasError) {
value = this.err || 'door.error';
}
else if (isLockdown) {
value = i18n.t(`twoNCommanderDoor.lockdown.${this.lockdown}`);
}
else {
if (this.doorState !== 'Unknown' && this.doorSwitchState !== 'Unknown') {
value = i18n.t('twoNCommanderDoor.format', {
doorSwitchState: i18n.t(`twoNCommanderDoor.doorSwitchState.${this.doorSwitchState}`),
doorState: i18n.t(`twoNCommanderDoor.doorState.${this.doorState}`)
});
}
else if (this.doorSwitchState !== 'Unknown') {
value = i18n.t(`twoNCommanderDoor.doorSwitchState.${this.doorSwitchState}`);
}
else if (this.doorState !== 'Unknown') {
value = i18n.t(`twoNCommanderDoor.doorState.${this.doorState}`);
}
}
// Color Logic
let calculatedColor = this.colorIconSmall;
if (this.allowIndicationAutoColoring && !this.loading) {
if (hasError || isLockdown) {
calculatedColor = 'danger';
}
else if (isUnlocked) {
calculatedColor = 'danger';
}
else if (this.status === 'Online') {
calculatedColor = 'success';
}
else {
calculatedColor = 'medium';
}
}
const colorIconSmall = this.allowIndicationAutoColoring ? calculatedColor : this.colorIconSmall;
// Button Props
const showButton = this.doorSwitch !== undefined;
const buttonDisabled = this.loading || hasError || isLockdown || this.status !== 'Online';
// If Unlocked (True) -> Button should Lock -> Label 'Lock', Icon 'Lock'
// If Locked (False/Unknown) -> Button should Unlock -> Label 'Unlock', Icon 'Unlock'
const buttonLabel = isUnlocked ? 'door.lock' : 'door.unlock';
const buttonIcon = isUnlocked ? 'lock' : 'unlock';
const componentProps = showButton ? {
onClick: () => this.handleToggle(),
value: buttonLabel,
icon: buttonIcon,
disabled: buttonDisabled,
color: this.colorInputs || this.color
} : undefined;
return (h("lar-node", { key: 'bfc315c7977bf9ded6c6e01231c8a4bf97a1a62c', value: value, hideTitles: this.hideTitles, iconSmall: iconSmall, colorIconSmall: colorIconSmall, icon: this.icon, color: this.color, supTitle: this.supTitle, mainTitle: this.mainTitle, subTitle: this.subTitle, colorModal: this.colorModal, colorInputs: this.colorInputs, nodeSize: this.nodeSize, log: this.log, loading: this.loading, component: showButton ? "lar-2n-commander-door-content" : undefined, componentProps: componentProps }, h("slot", { key: '9e195d498939920adbf3c81d4d628e37a4e388b1' })));
}
get el() { return this; }
static get style() { return _2nCommanderDoorCss; }
}, [257, "lar-2n-commander-door", {
"icon": [1025],
"color": [1025],
"colorModal": [1025, "color-modal"],
"colorInputs": [1025, "color-inputs"],
"colorIconSmall": [1, "color-icon-small"],
"allowIndicationAutoColoring": [4, "allow-indication-auto-coloring"],
"hideTitles": [4, "hide-titles"],
"supTitle": [1, "sup-title"],
"subTitle": [1, "sub-title"],
"log": [4],
"mainTitle": [1, "main-title"],
"nodeSize": [1, "node-size"],
"options": [8],
"loading": [32],
"err": [32],
"status": [32],
"lockdown": [32],
"doorState": [32],
"doorSwitch": [32],
"doorSwitchState": [32],
"input": [64]
}]);
function defineCustomElement$1() {
if (typeof customElements === "undefined") {
return;
}
const components = ["lar-2n-commander-door", "lar-backdrop", "lar-icon", "lar-modal", "lar-node", "lar-node-titles", "lar-notify", "lar-translate"];
components.forEach(tagName => { switch (tagName) {
case "lar-2n-commander-door":
if (!customElements.get(tagName)) {
customElements.define(tagName, TwoNCommanderDoor);
}
break;
case "lar-backdrop":
if (!customElements.get(tagName)) {
defineCustomElement$8();
}
break;
case "lar-icon":
if (!customElements.get(tagName)) {
defineCustomElement$7();
}
break;
case "lar-modal":
if (!customElements.get(tagName)) {
defineCustomElement$6();
}
break;
case "lar-node":
if (!customElements.get(tagName)) {
defineCustomElement$5();
}
break;
case "lar-node-titles":
if (!customElements.get(tagName)) {
defineCustomElement$4();
}
break;
case "lar-notify":
if (!customElements.get(tagName)) {
defineCustomElement$3();
}
break;
case "lar-translate":
if (!customElements.get(tagName)) {
defineCustomElement$2();
}
break;
} });
}
defineCustomElement$1();
const Lar2nCommanderDoor = TwoNCommanderDoor;
const defineCustomElement = defineCustomElement$1;
export { Lar2nCommanderDoor, defineCustomElement };
//# sourceMappingURL=lar-2n-commander-door.js.map
//# sourceMappingURL=lar-2n-commander-door.js.map