import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
import { a as getStore } from './store.js';
import { s as sensorInfo } from './sensorInfo.js';
import { w as watchStoreLocale } from './locale-state.js';
import { i as isObjectLike, b as baseGetTag } from './isObjectLike.js';

/** `Object#toString` result references. */
var numberTag = '[object Number]';

/**
 * Checks if `value` is classified as a `Number` primitive or object.
 *
 * **Note:** To exclude `Infinity`, `-Infinity`, and `NaN`, which are
 * classified as numbers, use the `_.isFinite` method.
 *
 * @static
 * @memberOf _
 * @since 0.1.0
 * @category Lang
 * @param {*} value The value to check.
 * @returns {boolean} Returns `true` if `value` is a number, else `false`.
 * @example
 *
 * _.isNumber(3);
 * // => true
 *
 * _.isNumber(Number.MIN_VALUE);
 * // => true
 *
 * _.isNumber(Infinity);
 * // => true
 *
 * _.isNumber('3');
 * // => false
 */
function isNumber(value) {
  return typeof value == 'number' ||
    (isObjectLike(value) && baseGetTag(value) == numberTag);
}

const lsIndicatorCss = ":host{display:block;font-family:var(--ls-font-family);width:var(--ls-indicator-width, 150px);height:var(--ls-indicator-height, 96px);position:absolute}.label{font-size:var(--ls-indicator-label-size, var(--ls-text-base));line-height:var(--ls-indicator-label-line-height, var(--ls-line-base))}.backdrop,.indicator{font-family:\"Digital\";font-size:var(--ls-indicator-digit-size, 5rem);line-height:var(--ls-indicator-digit-line-height, 80px);width:var(--ls-indicator-digit-width, 75px);letter-spacing:var(--ls-indicator-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 LsIndicator extends HTMLElement {
    constructor() {
        super();
        this.__registerHost();
        this.__attachShadow();
        this.storeUnsubscribe = null;
        this.processSensorUpdate = (sensorData) => {
            const sensorValue = sensorData.values[this.sensorId];
            // The sensor values of 501 and 514 and 515 are zero based, but we need to show them one based
            this.sensorData = isNumber(sensorValue)
                ? sensorValue + 1
                : sensorValue === "¿"
                    ? "?" // Our font doesn't support the upside down question mark
                    : sensorValue;
        };
    }
    get dataLabel() {
        var _a;
        return sensorInfo.getShortLabel(this.sensorId, (_a = this.store) === null || _a === void 0 ? void 0 : _a.state.locale);
    }
    async componentWillLoad() {
        this.store = await getStore(this.idKey);
        watchStoreLocale(this, this.store);
        this.processSensorUpdate(this.store.state.currentSensorData);
        this.storeUnsubscribe = this.store.onChange("currentSensorData", (sensorData) => {
            this.processSensorUpdate(sensorData);
        });
    }
    disconnectedCallback() {
        if (this.storeUnsubscribe !== null) {
            this.storeUnsubscribe();
            this.storeUnsubscribe = null;
        }
    }
    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, { key: '0f5e1153ca2cfa56abfbf3779c9f5ab051b7ca7a' }, h("div", { key: 'c9f006c0f571734ef61273653d6451e5e69d2ce4', class: "label" }, this.sensorId === null
            ? this.store.t("ui:indicator.no_id")
            : this.dataLabel), h("div", { key: '53eb371432fc0cfac78c1786377f711d31e45eab', class: "backdrop" }, "00"), h("div", { key: 'c7df99375aa4e4a1827bc4ded5106fcb3a2718c9', class: "indicator" }, !this.store.state.error.hasError && (this.sensorData || ""))));
    }
    static get style() { return lsIndicatorCss; }
}, [257, "ls-indicator", {
        "sensorId": [2, "sensor-id"],
        "idKey": [1, "id-key"],
        "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

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