ednl-liftstatus-web-components/dist/components/ls-indicator2.js

The EDNL LiftStatus web components

import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
import { g as getStore } from './store.js';
import { s as sensorInfo } from './sensorInfo.js';

const lsIndicatorCss = ":host{display:block;font-family:var(--ls-font-family);width:150px;height:96px;position:absolute}.label{font-size:var(--ls-text-base);line-height:var(--ls-line-base)}.backdrop,.indicator{font-family:\"Digital\";font-size:5rem;line-height:80px;width:75px;letter-spacing:0.05rem;position:absolute;bottom:0;color:var(--ls-primary-color)}.backdrop{opacity:0.1}.indicator{text-align:right;left:0}";

const LsIndicator = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
  constructor() {
    super();
    this.__registerHost();
    this.__attachShadow();
    this.processSensorUpdate = (sensorData) => {
      let sensorValues = sensorData.values;
      // The sensor values of 501 and 514 and 515 are zero based, but we need to show them one based
      this.sensorData =
        sensorValues[this.sensorId] === ""
          ? sensorValues[this.sensorId]
          : sensorValues[this.sensorId] + 1;
    };
    this.sensorId = undefined;
    this.dataLabel = undefined;
    this.sensorData = undefined;
    this.idKey = undefined;
  }
  async componentWillLoad() {
    this.store = await getStore(this.idKey);
    this.processSensorUpdate(this.store.state.currentSensorData);
    this.store.onChange("currentSensorData", (sensorData) => {
      this.processSensorUpdate(sensorData);
    });
    this.dataLabel = sensorInfo.getShortLabel(this.sensorId);
  }
  render() {
    if (this.sensorId === null) {
      console.group("%cError%c [LsIndicator] No sensor ID supplied", "color: #DC2626; background-color: #FEF2F2; display: inline-block; padding: 0 4px; border-radius: 2px;", "");
      console.log(`Add the ID to the LsIndicator component like so: %c<ls-indicator sensor-id="yourId"></ls-indicator>%c`, "color:#27272A; background-color: #E4E4E7; display: inline-block; padding: 0 4px; border-radius: 2px;", "");
      console.groupEnd();
    }
    return (h(Host, null, h("div", { class: "label" }, this.sensorId === null ? "No ID supplied" : this.dataLabel), h("div", { class: "backdrop" }, "00"), h("div", { class: "indicator" }, this.sensorData || "")));
  }
  static get style() { return lsIndicatorCss; }
}, [1, "ls-indicator", {
    "sensorId": [2, "sensor-id"],
    "idKey": [1, "id-key"],
    "dataLabel": [32],
    "sensorData": [32]
  }]);
function defineCustomElement() {
  if (typeof customElements === "undefined") {
    return;
  }
  const components = ["ls-indicator"];
  components.forEach(tagName => { switch (tagName) {
    case "ls-indicator":
      if (!customElements.get(tagName)) {
        customElements.define(tagName, LsIndicator);
      }
      break;
  } });
}

export { LsIndicator as L, defineCustomElement as d };

//# sourceMappingURL=ls-indicator2.js.map