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

package/pv-components/dist/web/components/pv-expandable-content/pv-expandable-content.js

@@ -0,0 +1,304 @@
+import { ref as C, getCurrentInstance as A, defineComponent as b, computed as v, createElementBlock as m, openBlock as c, normalizeClass as g, createElementVNode as w, normalizeStyle as P, createBlock as y, Fragment as k, createCommentVNode as _, toDisplayString as $, createVNode as z, renderSlot as O, defineCustomElement as B } from "vue";
+function j() {
+  const e = C(!1), n = A()?.root || {};
+  return "isCE" in n && n.isCE === !0 && (e.value = !0), e;
+}
+const N = [void 0, 10, 12, 20, 24, 32, 64], T = ["xlink:href"], E = /* @__PURE__ */ b({
+  __name: "PvIcon",
+  props: {
+    name: { type: String },
+    size: { type: null }
+  },
+  setup(e) {
+    const t = e, n = j(), s = C(null), r = v(() => ({
+      "pv-icon": !0,
+      [`pv-icon-${t.size}`]: N.includes(t.size)
+    })), l = v(() => n.value && s.value ? `${s.value}#${t.name}` : `#${t.name}`);
+    return globalThis.__PV_GLOBAL_SPRITE_PATH__ && (s.value = globalThis.__PV_GLOBAL_SPRITE_PATH__), (u, o) => (c(), m(
+      "svg",
+      {
+        "data-testid": "pv-icon",
+        "aria-hidden": "true",
+        class: g(r.value)
+      },
+      [
+        w("use", { "xlink:href": l.value }, null, 8, T)
+      ],
+      2
+      /* CLASS */
+    ));
+  }
+}), L = /* @__PURE__ */ b({
+  __name: "PvSpinner",
+  props: {
+    variant: { default: "primary", type: String },
+    size: { default: "lg", type: String }
+  },
+  setup(e) {
+    const t = {
+      xs: "0.75rem",
+      sm: "1rem",
+      md: "1.25rem",
+      lg: "1.5rem",
+      xl: "2rem"
+    }, n = {
+      primary: "pv-spinner",
+      dark: "pv-spinner-dark",
+      white: "pv-spinner-light"
+    };
+    return (s, r) => (c(), m(
+      "div",
+      {
+        "data-testid": "pv-spinner",
+        class: g(n[e.variant]),
+        style: P({ "--size": t[e.size] })
+      },
+      null,
+      6
+      /* CLASS, STYLE */
+    ));
+  }
+}), M = ["ghost"], x = {
+  md: "pv-button-small",
+  lg: void 0,
+  xl: "pv-button-large"
+}, R = (e) => e == null || !x.hasOwnProperty(e) ? null : x[e] || null, V = ["disabled"], D = {
+  key: 1,
+  "data-testid": "pv-button-label"
+}, W = /* @__PURE__ */ b({
+  __name: "PvButton",
+  props: {
+    variant: { default: "primary", type: String },
+    disabled: { type: Boolean, default: !1 },
+    size: { default: "lg", type: String },
+    loading: { type: Boolean, default: !1 },
+    label: { type: String },
+    leftIcon: { type: String },
+    rightIcon: { type: String },
+    inverse: { type: Boolean, default: !1 }
+  },
+  setup(e) {
+    const t = e, n = v(() => {
+      const s = [];
+      t.inverse && M.includes(t.variant) ? s.push(`pv-button-${t.variant}-inverse`) : s.push(`pv-button-${t.variant}`);
+      const r = R(t.size);
+      return r && s.push(r), s;
+    });
+    return (s, r) => (c(), m("button", {
+      type: "button",
+      class: g(n.value),
+      disabled: e.disabled,
+      "data-testid": "pv-button"
+    }, [
+      e.loading ? (c(), y(L, {
+        key: 0,
+        size: "sm"
+      })) : (c(), m(
+        k,
+        { key: 1 },
+        [
+          e.leftIcon ? (c(), y(E, {
+            key: 0,
+            name: e.leftIcon,
+            "data-testid": "pv-button-left-icon"
+          }, null, 8, ["name"])) : _("v-if", !0),
+          e.label ? (c(), m(
+            "span",
+            D,
+            $(e.label),
+            1
+            /* TEXT */
+          )) : _("v-if", !0),
+          e.rightIcon ? (c(), y(E, {
+            key: 2,
+            name: e.rightIcon,
+            "data-testid": "pv-button-right-icon"
+          }, null, 8, ["name"])) : _("v-if", !0)
+        ],
+        64
+        /* STABLE_FRAGMENT */
+      ))
+    ], 10, V));
+  }
+}), H = /* @__PURE__ */ b({
+  __name: "PvExpandableContent",
+  props: {
+    lines: { default: 4, type: Number },
+    size: { default: "md", type: String },
+    variant: { default: "primary", type: String },
+    defaultOpen: { type: Boolean, default: !1 }
+  },
+  setup(e) {
+    const t = {
+      none: "0",
+      xs: "4px",
+      sm: "8px",
+      md: "12px",
+      lg: "16px"
+    }, n = e, s = C(n.defaultOpen), r = () => {
+      s.value = !s.value;
+    }, l = v(() => ({
+      "--lines": s.value ? "none" : n.lines,
+      "max-height": s.value ? "100vh" : `${n.lines * 1.5}em`
+    }));
+    return (u, o) => (c(), m(
+      "div",
+      {
+        class: g([
+          "pv-inset-square expandable-content",
+          {
+            "pv-surface-accent": e.variant === "ghost"
+          }
+        ]),
+        style: P({ "--inset-size": t[e.size] })
+      },
+      [
+        w(
+          "p",
+          {
+            class: "pv-line-clamp pv-text-body-md pv-stack-8",
+            style: P(l.value)
+          },
+          [
+            O(u.$slots, "default", {}, void 0, !0)
+          ],
+          4
+          /* STYLE */
+        ),
+        z(W, {
+          label: s.value ? "Show Less" : "Show More",
+          variant: "ghost",
+          size: "md",
+          onClick: r,
+          "left-icon": s.value ? "chevron-up" : "chevron-down"
+        }, null, 8, ["label", "left-icon"])
+      ],
+      6
+      /* CLASS, STYLE */
+    ));
+  }
+}), G = ".expandable-content[data-v-2f840307]{border-radius:.5rem}.expandable-content .pv-line-clamp[data-v-2f840307]{transition:max-height .3s ease-in-out}", q = (e, t) => {
+  const n = e.__vccOpts || e;
+  for (const [s, r] of t)
+    n[s] = r;
+  return n;
+}, J = /* @__PURE__ */ q(H, [["styles", [G]], ["__scopeId", "data-v-2f840307"]]), U = /* @__PURE__ */ new Set(["PvIcon", "PvPopoverMenu", "PvPopover"]);
+function Z(e) {
+  return !U.has(e);
+}
+function S(e, t) {
+  const n = document.querySelector('link[href*="' + t + '"]');
+  if (!e.shadowRoot)
+    return !1;
+  if (n && e.shadowRoot) {
+    const s = n.href;
+    if (e.shadowRoot.querySelector(`link[href="${s}"]`))
+      return;
+    const r = document.createElement("link");
+    return r.rel = "stylesheet", r.href = s, e.shadowRoot.prepend(r), !0;
+  }
+  return !1;
+}
+function F(e) {
+  if (!S(e, "pit-viper-v2")) {
+    if (S(e, "pit-viper")) {
+      S(e, "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 K = (e) => ({ shadowRoot: Z(e) });
+function Q(e, t) {
+  return t === null ? !1 : t === "" || t === "true" ? !0 : (t === "false" || console.warn(
+    `Invalid boolean attribute value for "${e}": "${t}". Expected "true", "false", or empty string.`
+  ), !1);
+}
+function X(e, t) {
+  const n = Number(t);
+  return isNaN(n) && console.warn(`Invalid number attribute value for "${e}": "${t}". Expected a valid number.`), n;
+}
+function Y(e) {
+  const t = /* @__PURE__ */ new Set(), n = /* @__PURE__ */ new Set(), s = /* @__PURE__ */ new Set(), l = (e.__vccOpts || e).props;
+  return l && typeof l == "object" && Object.entries(l).forEach(([u, o]) => {
+    o === Boolean || o && o.type === Boolean ? t.add(u) : o === Number || o && o.type === Number ? n.add(u) : (o === Object || o === Array || o && (o.type === Object || o.type === Array)) && s.add(u);
+  }), { booleanProps: t, numberProps: n, jsonProps: s };
+}
+function I(e, t) {
+  try {
+    return JSON.parse(t);
+  } catch (n) {
+    return console.warn(
+      `Invalid JSON attribute value for "${e}": "${t}". Error: ${n instanceof Error ? n.message : String(n)}`
+    ), null;
+  }
+}
+function ee(e) {
+  const t = e.__name || e.name;
+  if (!t)
+    throw new Error("Component must have a __name or name property");
+  const n = B(e, K(t)), { booleanProps: s, numberProps: r, jsonProps: l } = Y(e);
+  class u 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(p) {
+      this._hiddenInput && (this._hiddenInput.value = p ?? "");
+    }
+    _parseAttributes() {
+      s.forEach((a) => {
+        const i = this.getAttribute(a);
+        this[a] = Q(a, i);
+      }), r.forEach((a) => {
+        const i = this.getAttribute(a);
+        i !== null && (this[a] = X(a, i));
+      }), l.forEach((a) => {
+        const i = this.getAttribute(a);
+        if (i !== null) {
+          const d = I(a, i);
+          d !== null && (this[a] = d);
+        }
+      });
+      const p = this.getAttribute("data-json-props");
+      p && p.split(",").map((i) => i.trim()).filter(Boolean).forEach((i) => {
+        const d = i.replace(/-([a-z])/g, (f) => f[1].toUpperCase());
+        let h = this.getAttribute(i);
+        if (h === null) {
+          const f = d.replace(/([A-Z])/g, "-$1").toLowerCase();
+          h = this.getAttribute(f);
+        }
+        if (h !== null && !this[d]) {
+          const f = I(d, h);
+          f !== null && (this[d] = f);
+        }
+      });
+    }
+    connectedCallback() {
+      this._parseAttributes(), super.connectedCallback?.(), F(this);
+      const p = this.getAttribute("name");
+      p && (this._hiddenInput = document.createElement("input"), this._hiddenInput.type = "hidden", this._hiddenInput.name = p, this.after(this._hiddenInput));
+    }
+  }
+  return u;
+}
+function te(e) {
+  return e.replace(/([A-Z])/g, "-$1").toLowerCase().replace(/^-/, "");
+}
+function ne(e) {
+  const t = e.__name || e.name;
+  if (!t)
+    throw new Error("Component must have a __name or name property");
+  const n = te(t), s = ee(e);
+  customElements.get(n) || customElements.define(n, s);
+}
+ne(J);

package/pv-components/dist/web/components/pv-ghost-input/pv-ghost-input.js

@@ -0,0 +1,320 @@
+import { ref as S, getCurrentInstance as w, defineComponent as b, computed as _, createElementBlock as m, openBlock as p, normalizeClass as P, createElementVNode as x, normalizeStyle as $, createBlock as v, Fragment as A, createCommentVNode as g, toDisplayString as k, mergeModels as B, useTemplateRef as T, useModel as z, onMounted as O, watch as j, renderSlot as M, withDirectives as N, mergeProps as R, vModelText as V, defineCustomElement as W } from "vue";
+function D() {
+  const t = S(!1), n = w()?.root || {};
+  return "isCE" in n && n.isCE === !0 && (t.value = !0), t;
+}
+const L = [void 0, 10, 12, 20, 24, 32, 64], G = ["xlink:href"], C = /* @__PURE__ */ b({
+  __name: "PvIcon",
+  props: {
+    name: { type: String },
+    size: { type: null }
+  },
+  setup(t) {
+    const e = t, n = D(), s = S(null), o = _(() => ({
+      "pv-icon": !0,
+      [`pv-icon-${e.size}`]: L.includes(e.size)
+    })), a = _(() => n.value && s.value ? `${s.value}#${e.name}` : `#${e.name}`);
+    return globalThis.__PV_GLOBAL_SPRITE_PATH__ && (s.value = globalThis.__PV_GLOBAL_SPRITE_PATH__), (d, l) => (p(), m(
+      "svg",
+      {
+        "data-testid": "pv-icon",
+        "aria-hidden": "true",
+        class: P(o.value)
+      },
+      [
+        x("use", { "xlink:href": a.value }, null, 8, G)
+      ],
+      2
+      /* CLASS */
+    ));
+  }
+}), H = /* @__PURE__ */ b({
+  __name: "PvSpinner",
+  props: {
+    variant: { default: "primary", type: String },
+    size: { default: "lg", type: String }
+  },
+  setup(t) {
+    const e = {
+      xs: "0.75rem",
+      sm: "1rem",
+      md: "1.25rem",
+      lg: "1.5rem",
+      xl: "2rem"
+    }, n = {
+      primary: "pv-spinner",
+      dark: "pv-spinner-dark",
+      white: "pv-spinner-light"
+    };
+    return (s, o) => (p(), m(
+      "div",
+      {
+        "data-testid": "pv-spinner",
+        class: P(n[t.variant]),
+        style: $({ "--size": e[t.size] })
+      },
+      null,
+      6
+      /* CLASS, STYLE */
+    ));
+  }
+}), J = ["ghost"], E = {
+  md: "pv-button-small",
+  lg: void 0,
+  xl: "pv-button-large"
+}, U = (t) => t == null || !E.hasOwnProperty(t) ? null : E[t] || null, q = ["disabled"], F = {
+  key: 1,
+  "data-testid": "pv-button-label"
+}, Z = /* @__PURE__ */ b({
+  __name: "PvButton",
+  props: {
+    variant: { default: "primary", type: String },
+    disabled: { type: Boolean, default: !1 },
+    size: { default: "lg", type: String },
+    loading: { type: Boolean, default: !1 },
+    label: { type: String },
+    leftIcon: { type: String },
+    rightIcon: { type: String },
+    inverse: { type: Boolean, default: !1 }
+  },
+  setup(t) {
+    const e = t, n = _(() => {
+      const s = [];
+      e.inverse && J.includes(e.variant) ? s.push(`pv-button-${e.variant}-inverse`) : s.push(`pv-button-${e.variant}`);
+      const o = U(e.size);
+      return o && s.push(o), s;
+    });
+    return (s, o) => (p(), m("button", {
+      type: "button",
+      class: P(n.value),
+      disabled: t.disabled,
+      "data-testid": "pv-button"
+    }, [
+      t.loading ? (p(), v(H, {
+        key: 0,
+        size: "sm"
+      })) : (p(), m(
+        A,
+        { key: 1 },
+        [
+          t.leftIcon ? (p(), v(C, {
+            key: 0,
+            name: t.leftIcon,
+            "data-testid": "pv-button-left-icon"
+          }, null, 8, ["name"])) : g("v-if", !0),
+          t.label ? (p(), m(
+            "span",
+            F,
+            k(t.label),
+            1
+            /* TEXT */
+          )) : g("v-if", !0),
+          t.rightIcon ? (p(), v(C, {
+            key: 2,
+            name: t.rightIcon,
+            "data-testid": "pv-button-right-icon"
+          }, null, 8, ["name"])) : g("v-if", !0)
+        ],
+        64
+        /* STABLE_FRAGMENT */
+      ))
+    ], 10, q));
+  }
+}), K = ["data-style"], Q = ["placeholder", "disabled", "name"], X = /* @__PURE__ */ b({
+  __name: "PvGhostInput",
+  props: /* @__PURE__ */ B({
+    variant: { default: "h1", type: null },
+    placeholder: { type: String },
+    disabled: { type: Boolean },
+    showEditIcon: { type: Boolean }
+  }, {
+    modelValue: {},
+    modelModifiers: {}
+  }),
+  emits: ["update:modelValue"],
+  setup(t) {
+    const e = T("inputRef"), n = {
+      h1: "ghost-input-h1",
+      h2: "ghost-input-h2",
+      h3: "ghost-input-h3",
+      h4: "ghost-input-h4",
+      "text-lg": "ghost-input-text-large",
+      "text-md": "ghost-input-text-medium",
+      "text-sm": "ghost-input-text-small",
+      caption: "ghost-input-caption"
+    }, s = {
+      h1: "h1",
+      h2: "h2",
+      h3: "h3",
+      h4: "h4",
+      "text-sm": "text-small",
+      "text-md": "text-medium",
+      "text-lg": "text-large",
+      caption: "caption"
+    }, o = t, a = z(t, "modelValue"), d = S(0), l = () => {
+      e.value?.focus();
+    };
+    O(() => {
+      a.value && a.value.length > 0 ? c(a.value) : o.placeholder ? c(o.placeholder) : d.value = 240;
+    }), j(
+      () => a.value,
+      () => {
+        a.value && a.value.length > 0 ? c(a.value) : o.placeholder ? c(o.placeholder) : d.value = 240;
+      }
+    );
+    const c = (r) => {
+      if (!e.value) return;
+      const u = document.createElement("canvas").getContext("2d");
+      if (!u) return;
+      const h = getComputedStyle(e.value);
+      u.font = `${h.fontWeight} ${h.fontSize} ${h.fontFamily}`, d.value = u.measureText(r).width + 10;
+    };
+    return (r, i) => (p(), m("div", {
+      class: "pv-ghost-input pv-full-width",
+      "data-testid": "pv-ghost-input",
+      "data-style": s[t.variant]
+    }, [
+      M(r.$slots, "action"),
+      N(x("input", R({
+        ref_key: "inputRef",
+        ref: e
+      }, o, {
+        "onUpdate:modelValue": i[0] || (i[0] = (u) => a.value = u),
+        type: "text",
+        style: {
+          width: d.value + "px"
+        },
+        placeholder: t.placeholder,
+        disabled: t.disabled,
+        name: n[t.variant]
+      }), null, 16, Q), [
+        [V, a.value]
+      ]),
+      t.showEditIcon ? (p(), v(Z, {
+        key: 0,
+        "left-icon": "edit",
+        variant: "ghost",
+        onClick: l
+      })) : g("v-if", !0)
+    ], 8, K));
+  }
+}), Y = /* @__PURE__ */ new Set(["PvIcon", "PvPopoverMenu", "PvPopover"]);
+function tt(t) {
+  return !Y.has(t);
+}
+function y(t, e) {
+  const n = document.querySelector('link[href*="' + e + '"]');
+  if (!t.shadowRoot)
+    return !1;
+  if (n && t.shadowRoot) {
+    const s = n.href;
+    if (t.shadowRoot.querySelector(`link[href="${s}"]`))
+      return;
+    const o = document.createElement("link");
+    return o.rel = "stylesheet", o.href = s, t.shadowRoot.prepend(o), !0;
+  }
+  return !1;
+}
+function et(t) {
+  if (!y(t, "pit-viper-v2")) {
+    if (y(t, "pit-viper")) {
+      y(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 nt = (t) => ({ shadowRoot: tt(t) });
+function st(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 ot(t, e) {
+  const n = Number(e);
+  return isNaN(n) && console.warn(`Invalid number attribute value for "${t}": "${e}". Expected a valid number.`), n;
+}
+function at(t) {
+  const e = /* @__PURE__ */ new Set(), n = /* @__PURE__ */ new Set(), s = /* @__PURE__ */ new Set(), a = (t.__vccOpts || t).props;
+  return a && typeof a == "object" && Object.entries(a).forEach(([d, l]) => {
+    l === Boolean || l && l.type === Boolean ? e.add(d) : l === Number || l && l.type === Number ? n.add(d) : (l === Object || l === Array || l && (l.type === Object || l.type === Array)) && s.add(d);
+  }), { booleanProps: e, numberProps: n, jsonProps: s };
+}
+function I(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 rt(t) {
+  const e = t.__name || t.name;
+  if (!e)
+    throw new Error("Component must have a __name or name property");
+  const n = W(t, nt(e)), { booleanProps: s, numberProps: o, jsonProps: a } = at(t);
+  class d 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(c) {
+      this._hiddenInput && (this._hiddenInput.value = c ?? "");
+    }
+    _parseAttributes() {
+      s.forEach((r) => {
+        const i = this.getAttribute(r);
+        this[r] = st(r, i);
+      }), o.forEach((r) => {
+        const i = this.getAttribute(r);
+        i !== null && (this[r] = ot(r, i));
+      }), a.forEach((r) => {
+        const i = this.getAttribute(r);
+        if (i !== null) {
+          const u = I(r, i);
+          u !== null && (this[r] = u);
+        }
+      });
+      const c = this.getAttribute("data-json-props");
+      c && c.split(",").map((i) => i.trim()).filter(Boolean).forEach((i) => {
+        const u = i.replace(/-([a-z])/g, (f) => f[1].toUpperCase());
+        let h = this.getAttribute(i);
+        if (h === null) {
+          const f = u.replace(/([A-Z])/g, "-$1").toLowerCase();
+          h = this.getAttribute(f);
+        }
+        if (h !== null && !this[u]) {
+          const f = I(u, h);
+          f !== null && (this[u] = f);
+        }
+      });
+    }
+    connectedCallback() {
+      this._parseAttributes(), super.connectedCallback?.(), et(this);
+      const c = this.getAttribute("name");
+      c && (this._hiddenInput = document.createElement("input"), this._hiddenInput.type = "hidden", this._hiddenInput.name = c, this.after(this._hiddenInput));
+    }
+  }
+  return d;
+}
+function it(t) {
+  return t.replace(/([A-Z])/g, "-$1").toLowerCase().replace(/^-/, "");
+}
+function lt(t) {
+  const e = t.__name || t.name;
+  if (!e)
+    throw new Error("Component must have a __name or name property");
+  const n = it(e), s = rt(t);
+  customElements.get(n) || customElements.define(n, s);
+}
+lt(X);