@pequity/squirrel 1.0.19 → 1.0.20-beta.1

package/dist/es/chunks/p-select-btn.js

@@ -0,0 +1,77 @@
+import { defineComponent as V, resolveDirective as g, openBlock as i, createElementBlock as s, normalizeClass as r, Fragment as h, renderList as y, withDirectives as B, createBlock as T, withCtx as b, renderSlot as v, createTextVNode as w, toDisplayString as k } from "vue";
+import S from "../p-btn.js";
+const P = /* @__PURE__ */ V({
+  name: "PBtnGroup",
+  __name: "p-select-btn",
+  props: {
+    modelValue: { default: null },
+    items: { default: () => [] },
+    itemValue: { default: "value" },
+    itemText: { default: "text" },
+    itemTooltipText: { default: "text" },
+    size: { default: "md" },
+    showTooltip: { type: Boolean, default: !1 },
+    highlightSelected: { type: Boolean, default: !0 },
+    grow: { type: Boolean, default: !1 },
+    multiple: { type: Boolean, default: !1 },
+    noPadding: { type: Boolean, default: !1 }
+  },
+  emits: ["update:modelValue"],
+  setup(m, { emit: p }) {
+    const a = p, l = m, f = (e) => l.showTooltip ? e[l.itemTooltipText] : "", c = (e) => {
+      if (!l.multiple)
+        a("update:modelValue", e[l.itemValue]);
+      else if (Array.isArray(l.modelValue)) {
+        const n = e[l.itemValue];
+        l.modelValue.findIndex((t) => t[l.itemValue] === n) !== -1 ? a(
+          "update:modelValue",
+          l.modelValue.filter((t) => t[l.itemValue] !== n)
+        ) : a("update:modelValue", [...l.modelValue, e]);
+      } else
+        a("update:modelValue", [e]);
+    }, u = (e) => {
+      if (l.multiple) {
+        if (Array.isArray(l.modelValue))
+          return l.modelValue.findIndex((d) => d[l.itemValue] === e[l.itemValue]) !== -1;
+      } else
+        return l.modelValue === e[l.itemValue];
+    };
+    return (e, n) => {
+      const d = g("tooltip");
+      return i(), s("div", {
+        class: r({ flex: e.grow, "*:px-0 *:py-0": e.noPadding })
+      }, [
+        (i(!0), s(h, null, y(e.items, (t, o) => B((i(), T(S, {
+          key: t[e.itemValue],
+          size: e.size,
+          type: "secondary-outline-blue",
+          disabled: t.disabled,
+          class: r({
+            "rounded-none": o !== 0 && o !== e.items.length - 1,
+            "rounded-br-none rounded-tr-none": o === 0,
+            "rounded-bl-none rounded-tl-none": o === e.items.length - 1,
+            "-mr-0.5": o !== e.items.length - 1,
+            "flex-1": e.grow
+          }),
+          selected: u(t) && e.highlightSelected,
+          onClick: (z) => c(t)
+        }, {
+          default: b(() => [
+            v(e.$slots, `btn-${o}`, {
+              item: t,
+              isSelected: u(t)
+            }, () => [
+              w(k(t[e.itemText]), 1)
+            ])
+          ]),
+          _: 2
+        }, 1032, ["size", "disabled", "class", "selected", "onClick"])), [
+          [d, { content: f(t) }]
+        ])), 128))
+      ], 2);
+    };
+  }
+});
+export {
+  P as _
+};

package/dist/es/chunks/p-select.js

@@ -0,0 +1,97 @@
+import { defineComponent as x, useAttrs as k, computed as u, openBlock as o, createElementBlock as i, normalizeClass as c, unref as s, normalizeStyle as B, renderSlot as M, toDisplayString as m, createCommentVNode as N, createElementVNode as p, mergeProps as z, Fragment as A, renderList as E, withDirectives as I, vShow as P } from "vue";
+import { INPUT_SIZES as T } from "../inputClassesShared.js";
+import { useInputClasses as w } from "../useInputClasses.js";
+const D = ["data-has-error"], O = ["value"], $ = ["value"], v = "___null_value___", L = /* @__PURE__ */ x({
+  name: "PSelect",
+  inheritAttrs: !1,
+  __name: "p-select",
+  props: {
+    modelValue: {
+      type: [String, Number, Boolean, null],
+      default: ""
+    },
+    items: {
+      type: Array,
+      default: () => []
+    },
+    label: {
+      type: String,
+      default: ""
+    },
+    errorMsg: {
+      type: String,
+      default: ""
+    },
+    required: {
+      type: Boolean,
+      default: !1
+    },
+    size: {
+      type: String,
+      default: "md",
+      validator(t) {
+        return Object.keys(T).includes(t);
+      }
+    },
+    itemText: {
+      type: String,
+      default: "text"
+    },
+    itemValue: {
+      type: [String, Number, Boolean, null],
+      default: "value"
+    }
+  },
+  emits: ["update:modelValue"],
+  setup(t, { emit: y }) {
+    const d = y, l = t, n = k(), { labelClasses: f, selectClasses: g, errorMsgClasses: S } = w(l), V = u({
+      get: () => l.modelValue === null ? v : l.modelValue,
+      set: (e) => d("update:modelValue", e)
+    }), b = u(() => {
+      const { class: e, style: a, ...r } = n;
+      return r;
+    }), h = u(() => n.style), C = u(() => l.items.map((e) => ({
+      value: e[l.itemValue] === null ? v : e[l.itemValue],
+      text: e[l.itemText]
+    }))), _ = (e) => {
+      const a = e.target.value;
+      if (a === v) {
+        d("update:modelValue", null);
+        return;
+      }
+      d("update:modelValue", ["true", "false"].includes(a) ? a === "true" : a);
+    };
+    return (e, a) => (o(), i("div", {
+      class: c([{ hidden: s(n).hidden }, s(n).class]),
+      "data-has-error": !!t.errorMsg,
+      style: B(h.value)
+    }, [
+      M(e.$slots, "label", {
+        label: t.label,
+        labelClasses: s(f)
+      }, () => [
+        t.label ? (o(), i("label", {
+          key: 0,
+          class: c(s(f))
+        }, m(t.label), 3)) : N("", !0)
+      ]),
+      p("select", z({ class: s(g) }, b.value, {
+        value: V.value,
+        onChange: _
+      }), [
+        (o(!0), i(A, null, E(C.value, (r) => (o(), i("option", {
+          key: String(r.value),
+          value: r.value
+        }, m(r.text), 9, $))), 128))
+      ], 16, O),
+      I(p("div", {
+        class: c(s(S))
+      }, m(t.errorMsg), 3), [
+        [P, t.errorMsg]
+      ])
+    ], 14, D));
+  }
+});
+export {
+  L as _
+};

package/dist/es/chunks/p-table-loader.js

@@ -0,0 +1,57 @@
+import { defineComponent as b, openBlock as e, createElementBlock as t, createElementVNode as l, Fragment as a, renderList as o, createVNode as n, normalizeClass as d } from "vue";
+import u from "../p-skeleton-loader.js";
+const m = { class: "block overflow-hidden border border-p-gray-30" }, i = { class: "mb-0 w-full bg-surface" }, f = { class: "relative border-b border-p-gray-30 px-4 py-2" }, p = { class: "skeleton-fade" }, N = /* @__PURE__ */ b({
+  name: "PTableLoader",
+  __name: "p-table-loader",
+  props: {
+    rows: {
+      type: [Number, String],
+      default: 4
+    },
+    columns: {
+      type: [Number, String],
+      default: 6
+    },
+    tdClasses: {
+      type: String,
+      default: "px-4 py-5"
+    },
+    tdSkeletonClasses: {
+      type: String,
+      default: "h-5"
+    }
+  },
+  setup(r) {
+    return (y, h) => (e(), t("div", m, [
+      l("table", i, [
+        l("thead", null, [
+          l("tr", null, [
+            (e(!0), t(a, null, o(Number(r.columns), (s) => (e(), t("th", {
+              key: s,
+              class: "bg-surface p-0"
+            }, [
+              l("div", f, [
+                n(u, { class: "h-5" })
+              ])
+            ]))), 128))
+          ])
+        ]),
+        l("tbody", p, [
+          (e(!0), t(a, null, o(Number(r.rows), (s) => (e(), t("tr", { key: s }, [
+            (e(!0), t(a, null, o(Number(r.columns), (c) => (e(), t("td", {
+              key: c,
+              class: d([r.tdClasses, "border-b border-p-blue-15"])
+            }, [
+              n(u, {
+                class: d(r.tdSkeletonClasses)
+              }, null, 8, ["class"])
+            ], 2))), 128))
+          ]))), 128))
+        ])
+      ])
+    ]));
+  }
+});
+export {
+  N as _
+};

package/dist/es/chunks/p-tabs.js

@@ -0,0 +1,47 @@
+import { defineComponent as c, openBlock as r, createElementBlock as i, normalizeStyle as a, Fragment as m, renderList as d, createBlock as o, resolveDynamicComponent as n, mergeProps as p, withCtx as u, createElementVNode as l, normalizeClass as y, createCommentVNode as b, toDisplayString as f } from "vue";
+const g = { class: "flex items-center gap-2" }, v = { key: 0 }, C = /* @__PURE__ */ c({
+  __name: "p-tabs",
+  props: {
+    tabs: {
+      type: Array,
+      required: !0
+    },
+    activeTab: {
+      type: String,
+      required: !0
+    },
+    tabsLeftPadding: {
+      type: Number,
+      default: 0
+    }
+  },
+  emits: ["click:tab"],
+  setup(t) {
+    return (s, k) => (r(), i("div", {
+      class: "flex gap-4 border-b border-p-gray-30 text-base font-semibold",
+      style: a({ paddingLeft: `${t.tabsLeftPadding}px` })
+    }, [
+      (r(!0), i(m, null, d(t.tabs, (e) => (r(), o(n(e.to ? "RouterLink" : "div"), p({
+        key: `tab-${e.name}`
+      }, e.to ? { to: e.to } : {}, {
+        class: [[t.activeTab === e.name ? "border-primary text-primary" : "border-transparent text-p-gray-40"], "group cursor-pointer border-b-2 pb-3 hover:border-primary hover:text-primary"],
+        onClick: (x) => s.$emit("click:tab", e.name)
+      }), {
+        default: u(() => [
+          l("div", g, [
+            e.icon ? (r(), i("div", v, [
+              (r(), o(n(e.icon), {
+                class: y(["group-hover:fill-primary", [t.activeTab === e.name ? "fill-primary" : "fill-p-gray-40"]])
+              }, null, 8, ["class"]))
+            ])) : b("", !0),
+            l("div", null, f(e.title), 1)
+          ])
+        ]),
+        _: 2
+      }, 1040, ["class", "onClick"]))), 128))
+    ], 4));
+  }
+});
+export {
+  C as _
+};

package/dist/es/config.js

@@ -0,0 +1,105 @@
+const r = {
+  content: ["./index.html", "./squirrel/**/*.{vue,js,ts,jsx,tsx,mdx}", "./src/**/*.{vue,js,ts,jsx,tsx,mdx}"],
+  theme: {
+    colors: {
+      transparent: "transparent",
+      current: "currentColor",
+      /* Design system colors */
+      white: "#fff",
+      black: "#000",
+      night: "var(--color-night)",
+      "barley-white": "var(--color-barley-white)",
+      "horses-neck": "var(--color-horses-neck)",
+      "active-blue": "var(--color-active-blue)",
+      /* Pequity colors */
+      "p-gray": {
+        10: "var(--color-p-gray-10)",
+        20: "var(--color-p-gray-20)",
+        30: "var(--color-p-gray-30)",
+        40: "var(--color-p-gray-40)",
+        50: "var(--color-p-gray-50)",
+        60: "var(--color-p-gray-60)",
+        70: "var(--color-p-gray-70)",
+        80: "var(--color-p-gray-80)",
+        90: "var(--color-p-gray-90)",
+        100: "var(--color-p-gray-100)"
+      },
+      "p-blue": {
+        10: "var(--color-p-blue-10)",
+        15: "var(--color-p-blue-15)",
+        20: "var(--color-p-blue-20)",
+        30: "var(--color-p-blue-30)",
+        40: "var(--color-p-blue-40)",
+        50: "var(--color-p-blue-50)",
+        60: "var(--color-p-blue-60)",
+        70: "var(--color-p-blue-70)",
+        80: "var(--color-p-blue-80)"
+      },
+      "p-purple": {
+        10: "var(--color-p-purple-10)",
+        20: "var(--color-p-purple-20)",
+        30: "var(--color-p-purple-30)",
+        40: "var(--color-p-purple-40)",
+        50: "var(--color-p-purple-50)",
+        60: "var(--color-p-purple-60)"
+      },
+      "p-green": {
+        10: "var(--color-p-green-10)",
+        20: "var(--color-p-green-20)",
+        30: "var(--color-p-green-30)",
+        40: "var(--color-p-green-40)",
+        50: "var(--color-p-green-50)"
+      },
+      "p-red": {
+        10: "var(--color-p-red-10)",
+        20: "var(--color-p-red-20)",
+        30: "var(--color-p-red-30)",
+        40: "var(--color-p-red-40)",
+        50: "var(--color-p-red-50)"
+      },
+      /* Aliases */
+      primary: "var(--color-primary)",
+      accent: "var(--color-accent)",
+      surface: "var(--color-surface)",
+      "on-surface": "var(--color-on-surface)",
+      error: "var(--color-error)",
+      "on-error": "var(--color-on-error)",
+      info: "var(--color-info)",
+      "on-info": "var(--color-on-info)",
+      success: "var(--color-success)",
+      "on-success": "var(--color-on-success)",
+      warning: "var(--color-warning)",
+      "on-warning": "var(--color-on-warning)"
+    },
+    fontFamily: {
+      sans: ["Inter", "Helvetica", "Arial", "sans-serif"]
+    },
+    fontSize: {
+      xs: "0.75rem",
+      sm: "0.875rem",
+      base: "1rem",
+      lg: "1.125rem",
+      xl: "1.25rem",
+      "2xl": "1.5rem",
+      "3xl": "1.875rem",
+      "4xl": "2.25rem",
+      "5xl": "3rem",
+      "6xl": "4rem"
+    },
+    extend: {
+      borderColor: {
+        DEFAULT: "var(--color-p-gray-30)"
+      },
+      spacing: {
+        7.5: "1.875rem"
+      },
+      zIndex: {
+        110: "110"
+      },
+      screens: {}
+    }
+  }
+};
+export {
+  r as config
+};

package/dist/es/currency.js

@@ -0,0 +1,9 @@
+const e = Object.freeze({
+  currency: null,
+  precision: 0,
+  locale: "en-US",
+  allowNegative: !1
+});
+export {
+  e as CURRENCY_INPUT_DEFAULTS
+};

package/dist/es/dom.js

@@ -0,0 +1,15 @@
+const s = (t) => {
+  var n;
+  if (!(t instanceof Element))
+    throw Error("You must provide a DOM element.");
+  return !!(t.offsetWidth || t.offsetHeight || t.getClientRects().length) && window.getComputedStyle(t).visibility !== "hidden" && window.getComputedStyle(t).display !== "none" && ((n = t.style) == null ? void 0 : n.transform.includes("translateY(-9999px)")) === !1;
+}, f = (t, n, o, r) => {
+  const i = t.length;
+  let e = n ? t.indexOf(n) : -1;
+  return e === -1 ? !o && r ? t[i - 1] : t[0] : (e += o ? 1 : -1, r && (e = (e + i) % i), t[Math.max(0, Math.min(e, i - 1))]);
+}, a = (t) => typeof t == "object" && t !== null && "tagName" in t && t instanceof HTMLElement;
+export {
+  f as getNextActiveElement,
+  a as isElement,
+  s as isVisible
+};