@turquoisehealth/pit-viper 2.122.0 → 2.122.1-dev.0

package/pv-components/dist/web/components/pv-distribution-bar/pv-distribution-bar.js

@@ -0,0 +1,177 @@
+import { defineComponent as _, computed as y, createElementBlock as h, openBlock as m, Fragment as E, renderList as g, normalizeStyle as w, normalizeClass as A, defineCustomElement as C } from "vue";
+const P = {
+  class: "pv-flex",
+  style: { "--flex-gap": "4px", height: "24px" }
+}, S = /* @__PURE__ */ _({
+  __name: "PvDistributionBar",
+  props: {
+    values: { type: Array }
+  },
+  setup(t) {
+    const e = t, n = y(() => e.values?.reduce((i, c) => i + c, 0) ?? 0), u = (i, c) => {
+      const r = c === 0, a = c === (e.values?.length ?? 0) - 1, s = (o) => o ? "12px" : "0";
+      return {
+        width: `${i / n.value * 100}%`,
+        height: "100%",
+        borderRadius: `${s(r)} ${s(a)} ${s(a)} ${s(r)}`
+      };
+    }, l = (i) => {
+      switch (i) {
+        case 0:
+          return "pv-data-surface-visualization-1";
+        case 1:
+          return "pv-data-surface-visualization-2";
+        case 2:
+          return "pv-data-surface-visualization-3";
+        case 3:
+          return "pv-data-surface-visualization-4";
+        case 4:
+          return "pv-data-surface-visualization-5";
+        case 5:
+          return "pv-data-surface-visualization-6";
+        case 6:
+          return "pv-data-surface-visualization-7";
+        default:
+          return "pv-data-surface-visualization-1";
+      }
+    };
+    return (i, c) => (m(), h("div", P, [
+      (m(!0), h(
+        E,
+        null,
+        g(t.values, (r, a) => (m(), h(
+          "div",
+          {
+            key: r,
+            class: A([l(a)]),
+            style: w(u(r, a))
+          },
+          null,
+          6
+          /* CLASS, STYLE */
+        ))),
+        128
+        /* KEYED_FRAGMENT */
+      ))
+    ]));
+  }
+}), $ = /* @__PURE__ */ new Set(["PvIcon", "PvPopoverMenu", "PvPopover"]);
+function I(t) {
+  return !$.has(t);
+}
+function b(t, e) {
+  const n = document.querySelector('link[href*="' + e + '"]');
+  if (!t.shadowRoot)
+    return !1;
+  if (n && t.shadowRoot) {
+    const u = n.href;
+    if (t.shadowRoot.querySelector(`link[href="${u}"]`))
+      return;
+    const l = document.createElement("link");
+    return l.rel = "stylesheet", l.href = u, t.shadowRoot.prepend(l), !0;
+  }
+  return !1;
+}
+function j(t) {
+  if (!b(t, "pit-viper-v2")) {
+    if (b(t, "pit-viper")) {
+      b(t, "pit-viper-v2-scoped");
+      return;
+    }
+    console.warn(
+      "No global styles found for Pit Viper components. Make sure to include pit-viper.css or pit-viper-v2.css in your project."
+    );
+  }
+}
+const O = (t) => ({ shadowRoot: I(t) });
+function k(t, e) {
+  return e === null ? !1 : e === "" || e === "true" ? !0 : (e === "false" || console.warn(
+    `Invalid boolean attribute value for "${t}": "${e}". Expected "true", "false", or empty string.`
+  ), !1);
+}
+function z(t, e) {
+  const n = Number(e);
+  return isNaN(n) && console.warn(`Invalid number attribute value for "${t}": "${e}". Expected a valid number.`), n;
+}
+function N(t) {
+  const e = /* @__PURE__ */ new Set(), n = /* @__PURE__ */ new Set(), u = /* @__PURE__ */ new Set(), i = (t.__vccOpts || t).props;
+  return i && typeof i == "object" && Object.entries(i).forEach(([c, r]) => {
+    r === Boolean || r && r.type === Boolean ? e.add(c) : r === Number || r && r.type === Number ? n.add(c) : (r === Object || r === Array || r && (r.type === Object || r.type === Array)) && u.add(c);
+  }), { booleanProps: e, numberProps: n, jsonProps: u };
+}
+function v(t, e) {
+  try {
+    return JSON.parse(e);
+  } catch (n) {
+    return console.warn(
+      `Invalid JSON attribute value for "${t}": "${e}". Error: ${n instanceof Error ? n.message : String(n)}`
+    ), null;
+  }
+}
+function B(t) {
+  const e = t.__name || t.name;
+  if (!e)
+    throw new Error("Component must have a __name or name property");
+  const n = C(t, O(e)), { booleanProps: u, numberProps: l, jsonProps: i } = N(t);
+  class c extends n {
+    _hiddenInput = null;
+    constructor() {
+      super(), this._parseAttributes();
+    }
+    disconnectedCallback() {
+      this._hiddenInput?.remove(), super.disconnectedCallback?.();
+    }
+    /**
+     * Update the hidden input value
+     * Call this from the Vue component to sync form value
+     */
+    setHiddenInputValue(a) {
+      this._hiddenInput && (this._hiddenInput.value = a ?? "");
+    }
+    _parseAttributes() {
+      u.forEach((s) => {
+        const o = this.getAttribute(s);
+        this[s] = k(s, o);
+      }), l.forEach((s) => {
+        const o = this.getAttribute(s);
+        o !== null && (this[s] = z(s, o));
+      }), i.forEach((s) => {
+        const o = this.getAttribute(s);
+        if (o !== null) {
+          const p = v(s, o);
+          p !== null && (this[s] = p);
+        }
+      });
+      const a = this.getAttribute("data-json-props");
+      a && a.split(",").map((o) => o.trim()).filter(Boolean).forEach((o) => {
+        const p = o.replace(/-([a-z])/g, (f) => f[1].toUpperCase());
+        let d = this.getAttribute(o);
+        if (d === null) {
+          const f = p.replace(/([A-Z])/g, "-$1").toLowerCase();
+          d = this.getAttribute(f);
+        }
+        if (d !== null && !this[p]) {
+          const f = v(p, d);
+          f !== null && (this[p] = f);
+        }
+      });
+    }
+    connectedCallback() {
+      this._parseAttributes(), super.connectedCallback?.(), j(this);
+      const a = this.getAttribute("name");
+      a && (this._hiddenInput = document.createElement("input"), this._hiddenInput.type = "hidden", this._hiddenInput.name = a, this.after(this._hiddenInput));
+    }
+  }
+  return c;
+}
+function x(t) {
+  return t.replace(/([A-Z])/g, "-$1").toLowerCase().replace(/^-/, "");
+}
+function D(t) {
+  const e = t.__name || t.name;
+  if (!e)
+    throw new Error("Component must have a __name or name property");
+  const n = x(e), u = B(t);
+  customElements.get(n) || customElements.define(n, u);
+}
+D(S);