@mapsindoors/map-template 1.95.1 → 1.95.2

package/dist/mi-metric-card.entry.js

@@ -1,48 +1,61 @@
-import { r as registerInstance, h, H as Host } from './index-7e9696f3.js';
-import { a as isNumber, f as formatNumber } from './utils-ae714467.js';
+import { r as registerInstance, h, H as Host } from './index-BZQHyS7V.js';
+import { f as formatNumber, a as isNumber } from './utils-DNHzysQ6.js';
 
-const metricCardCss = ":host{font-family:Figtree, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Oxygen, Ubuntu, Cantarell, \"Fira Sans\", \"Droid Sans\", \"Helvetica Neue\", Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\";flex-shrink:0;flex-grow:1}:host mi-card{position:relative;overflow:hidden;min-width:312px}:host mi-card .content h1{display:inline-flex;cursor:default;align-items:center;text-transform:uppercase;white-space:nowrap;margin:0;font-size:1rem;font-weight:600;color:#6b7280;margin-bottom:8px}:host mi-card .content h1 svg{fill:#9ca3af;width:16px;height:16px;margin-left:8px}:host mi-card .content section{position:relative}:host mi-card .content section p{margin:0;font-size:3rem;line-height:3rem;font-weight:500;color:#1c1917}:host mi-card .content section p.error{font-size:1rem;font-weight:500;color:#6b7280}:host mi-card .content section p.hidden{visibility:hidden}:host mi-card .content section p.tool-tip{box-sizing:border-box;visibility:hidden;overflow:hidden;position:absolute;top:0px;right:0px;bottom:0px;left:0px;opacity:0;transition:all 100ms;z-index:700;background-color:#ffffff;font-size:0.875rem;font-weight:400;line-height:1rem;margin:0}:host mi-card .content section p.tool-tip.visible{opacity:1;visibility:visible}:host mi-card .content section mi-spinner{display:inline-block;vertical-align:middle;width:100%}";
+const metricCardCss = () => `:host{font-family:Figtree, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";flex-shrink:0;flex-grow:1}:host mi-card{position:relative;overflow:hidden;min-width:312px}:host mi-card .content h1{display:inline-flex;cursor:default;align-items:center;text-transform:uppercase;white-space:nowrap;margin:0;font-size:1rem;font-weight:600;color:#6b7280;margin-bottom:8px}:host mi-card .content h1 svg{fill:#9ca3af;width:16px;height:16px;margin-left:8px}:host mi-card .content section{position:relative}:host mi-card .content section p{margin:0;font-size:3rem;line-height:3rem;font-weight:500;color:#1c1917}:host mi-card .content section p.error{font-size:1rem;font-weight:500;color:#6b7280}:host mi-card .content section p.hidden{visibility:hidden}:host mi-card .content section p.tool-tip{box-sizing:border-box;visibility:hidden;overflow:hidden;position:absolute;top:0px;right:0px;bottom:0px;left:0px;opacity:0;transition:all 100ms;z-index:700;background-color:#ffffff;font-size:0.875rem;font-weight:400;line-height:1rem;margin:0}:host mi-card .content section p.tool-tip.visible{opacity:1;visibility:visible}:host mi-card .content section mi-spinner{display:inline-block;vertical-align:middle;width:100%}`;
 
 const MetricCard = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.showToolTip = false;
-    this.label = '';
-    this.value = '';
-    this.tip = undefined;
-    this.spinner = false;
-    this.error = undefined;
-  }
-  render() {
-    return (h(Host, null, h("mi-card", null, this.renderContent())));
-  }
-  renderToolTip() {
-    if (this.tip > '') {
-      return h("p", { class: { 'tool-tip': true, 'visible': this.tip && this.showToolTip } }, this.tip);
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.showToolTip = false;
+        /**
+         * This is the metric title.
+         * @type {string}
+         * @memberof MetricCard
+         */
+        this.label = '';
+        /**
+         * This is the metric value.
+         * @type {string}
+         * @memberof MetricCard
+         */
+        this.value = '';
+        /**
+         * When present a loading spinner will be displayed until the value or error attribute is set or the spinner attribute is removed
+         * @type {boolean}
+         * @memberof MetricCard
+         */
+        this.spinner = false;
     }
-  }
-  getInfoIcon() {
-    if (this.tip > '') {
-      return h("svg", { xmlns: "http://www.w3.org/2000/svg", height: "24", viewBox: "0 0 24 24", width: "24" }, h("path", { d: "M0 0h24v24H0V0z", fill: "none" }), h("path", { d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 17h-2v-2h2v2zm2.07-7.75l-.9.92c-.5.51-.86.97-1.04 1.69-.08.32-.13.68-.13 1.14h-2v-.5c0-.46.08-.9.22-1.31.2-.58.53-1.1.95-1.52l1.24-1.26c.46-.44.68-1.1.55-1.8-.13-.72-.69-1.33-1.39-1.53-1.11-.31-2.14.32-2.47 1.27-.12.37-.43.65-.82.65h-.3C8.4 9 8 8.44 8.16 7.88c.43-1.47 1.68-2.59 3.23-2.83 1.52-.24 2.97.55 3.87 1.8 1.18 1.63.83 3.38-.19 4.4z" }));
+    render() {
+        return (h(Host, { key: '866f6311805722aa74911b0f2360860ab22d0fff' }, h("mi-card", { key: '6fad0cdf8ee8a281497dc7041188bd2d28615345' }, this.renderContent())));
     }
-  }
-  renderContent() {
-    let value;
-    if (this.value) {
-      value = isNumber(this.value) ? formatNumber(this.value) : this.value;
+    renderToolTip() {
+        if (this.tip > '') {
+            return h("p", { class: { 'tool-tip': true, 'visible': this.tip && this.showToolTip } }, this.tip);
+        }
     }
-    else if (this.error) {
-      value = this.error;
+    getInfoIcon() {
+        if (this.tip > '') {
+            return h("svg", { xmlns: "http://www.w3.org/2000/svg", height: "24", viewBox: "0 0 24 24", width: "24" }, h("path", { d: "M0 0h24v24H0V0z", fill: "none" }), h("path", { d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 17h-2v-2h2v2zm2.07-7.75l-.9.92c-.5.51-.86.97-1.04 1.69-.08.32-.13.68-.13 1.14h-2v-.5c0-.46.08-.9.22-1.31.2-.58.53-1.1.95-1.52l1.24-1.26c.46-.44.68-1.1.55-1.8-.13-.72-.69-1.33-1.39-1.53-1.11-.31-2.14.32-2.47 1.27-.12.37-.43.65-.82.65h-.3C8.4 9 8 8.44 8.16 7.88c.43-1.47 1.68-2.59 3.23-2.83 1.52-.24 2.97.55 3.87 1.8 1.18 1.63.83 3.38-.19 4.4z" }));
+        }
     }
-    else if (this.spinner) {
-      value = h("mi-spinner", null);
+    renderContent() {
+        let value;
+        if (this.value) {
+            value = isNumber(this.value) ? formatNumber(this.value) : this.value;
+        }
+        else if (this.error) {
+            value = this.error;
+        }
+        else if (this.spinner) {
+            value = h("mi-spinner", null);
+        }
+        else {
+            value = ' ';
+        }
+        return h("div", { class: "content" }, h("h1", { onMouseOver: () => this.showToolTip = true, onMouseOut: () => this.showToolTip = false }, this.label, "  ", this.getInfoIcon()), h("section", null, this.renderToolTip(), h("p", { class: { 'error': !!this.error, 'hidden': this.tip && this.showToolTip } }, value)));
     }
-    else {
-      value = ' ';
-    }
-    return h("div", { class: "content" }, h("h1", { onMouseOver: () => this.showToolTip = true, onMouseOut: () => this.showToolTip = false }, this.label, "  ", this.getInfoIcon()), h("section", null, this.renderToolTip(), h("p", { class: { 'error': !!this.error, 'hidden': this.tip && this.showToolTip } }, value)));
-  }
 };
-MetricCard.style = metricCardCss;
+MetricCard.style = metricCardCss();
 
 export { MetricCard as mi_metric_card };