UNPKG

@larva.io/webcomponents

Version:

Fentrica SmartUnits WebComponents package

200 lines (195 loc) 7.57 kB
/*! * (C) Fentrica http://fentrica.com - Seee LICENSE.md */ import { p as proxyCustomElement, H, c as createEvent, h } from './p-AOwgnAK2.js'; import { d as defineCustomElement$a } from './p-B7x5gzZv.js'; import { d as defineCustomElement$9 } from './p-BiG3U7GV.js'; import { d as defineCustomElement$8 } from './p-CihB8b9m.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 doorCss = "slot-fb[hidden],slot[hidden]{display:initial !important}"; const Door = /*@__PURE__*/ proxyCustomElement(class Door 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 /** * Component main icon */ this.icon = 'door'; /** * The color to use from your application's color palette. * Detrouble options are: `"primary"`, `"secondary"`, `"tertiary"`, `"success"`, `"warning"`, `"danger"`, `"light"`, `"medium"`, and `"dark"`. */ this.color = 'primary'; /** * Disable quck actions */ this.disableQuickActions = false; /** * Allow node indication color automatic change based on feedback/node value. Defaults to false */ this.allowIndicationAutoColoring = false; /** * Is logging for this component enabled (lar-log subcomponent loaded) */ this.log = false; /** * Node size */ this.nodeSize = 'default'; /////// LarvaNode base properties and events - end this.doorType = 'buzz'; this.loading = true; // state for indicating buzzer door open state this.buzzingState = false; } /** * Larva input message */ async input(data) { this.isOpen = data.state || false; if (this.buzzingState && !this.isOpen) { this.buzzingState = false; } if (data.doorType) { this.doorType = data.doorType; } this.loading = false; } /** * Larva error input */ async error(data) { if (this.node) { this.node.error(data); } this.loading = false; } componentDidLoad() { const el = this.el.shadowRoot || this.el; this.node = el.querySelector('lar-node'); this.loading = true; this.output.emit({ command: 'fullstate' }); } handleChange() { if (this.loading || this.buzzingState) { return this.node.error('invalid door state'); } this.loading = true; const cmd = { command: this.doorType === 'buzz' ? 'buzz' : this.isOpen ? 'lock' : 'unlock' }; if (this.doorType === 'buzz') { this.buzzingState = true; } return this.output.emit(cmd); } render() { const componentProps = { onClick: () => this.handleChange(), value: this.doorType === 'buzz' ? 'door.buzzOpen' : this.isOpen ? 'door.lock' : 'door.unlock', disabled: this.loading || this.buzzingState === true, color: this.colorInputs || this.color }; return [ h("lar-node", { key: 'a907470c8d97f1493f682d8f0a96ae2b4a598526', value: this.isOpen ? 'door.unlocked' : 'door.locked', colorIconSmall: this.allowIndicationAutoColoring && !this.loading ? (this.isOpen ? 'danger' : 'success') : this.colorIconSmall, hideTitles: this.hideTitles, iconSmall: this.isOpen ? 'unlock' : 'lock', 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: "lar-door-content", componentProps: componentProps }, this.disableQuickActions === false && h("lar-button-push", { key: '25441a3caad4de63b15922b2ac169a72ccba6828', size: "small", slot: "titles", color: this.colorInputs || this.color, disabled: this.loading || this.buzzingState === true, onClick: () => this.handleChange() }), h("slot", { key: 'aba75ec2e0b898ca72f0870e0614e80f7c72fad3' })) ]; } get el() { return this; } static get style() { return doorCss; } }, [257, "lar-door", { "icon": [1025], "color": [1025], "colorModal": [1025, "color-modal"], "colorInputs": [1025, "color-inputs"], "colorIconSmall": [1, "color-icon-small"], "disableQuickActions": [4, "disable-quick-actions"], "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"], "doorType": [32], "loading": [32], "isOpen": [32], "buzzingState": [32], "input": [64], "error": [64] }]); function defineCustomElement$1() { if (typeof customElements === "undefined") { return; } const components = ["lar-door", "lar-backdrop", "lar-button", "lar-button-push", "lar-icon", "lar-modal", "lar-node", "lar-node-titles", "lar-notify", "lar-translate"]; components.forEach(tagName => { switch (tagName) { case "lar-door": if (!customElements.get(tagName)) { customElements.define(tagName, Door); } break; case "lar-backdrop": if (!customElements.get(tagName)) { defineCustomElement$a(); } break; case "lar-button": if (!customElements.get(tagName)) { defineCustomElement$9(); } break; case "lar-button-push": 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 LarDoor = Door; const defineCustomElement = defineCustomElement$1; export { LarDoor, defineCustomElement }; //# sourceMappingURL=lar-door.js.map //# sourceMappingURL=lar-door.js.map