@sudobility/analytics-components 1.0.9

package/dist/index.esm.js

@@ -0,0 +1,1214 @@
+import M from "react";
+import { cn as d, Spinner as J } from "@sudobility/components";
+import { textVariants as u } from "@sudobility/design";
+var S = { exports: {} }, T = {};
+var q;
+function de() {
+  if (q) return T;
+  q = 1;
+  var t = Symbol.for("react.transitional.element"), a = Symbol.for("react.fragment");
+  function r(n, s, l) {
+    var c = null;
+    if (l !== void 0 && (c = "" + l), s.key !== void 0 && (c = "" + s.key), "key" in s) {
+      l = {};
+      for (var g in s)
+        g !== "key" && (l[g] = s[g]);
+    } else l = s;
+    return s = l.ref, {
+      $$typeof: t,
+      type: n,
+      key: c,
+      ref: s !== void 0 ? s : null,
+      props: l
+    };
+  }
+  return T.Fragment = a, T.jsx = r, T.jsxs = r, T;
+}
+var C = {};
+var B;
+function ce() {
+  return B || (B = 1, process.env.NODE_ENV !== "production" && (function() {
+    function t(e) {
+      if (e == null) return null;
+      if (typeof e == "function")
+        return e.$$typeof === se ? null : e.displayName || e.name || null;
+      if (typeof e == "string") return e;
+      switch (e) {
+        case j:
+          return "Fragment";
+        case A:
+          return "Profiler";
+        case E:
+          return "StrictMode";
+        case te:
+          return "Suspense";
+        case ae:
+          return "SuspenseList";
+        case oe:
+          return "Activity";
+      }
+      if (typeof e == "object")
+        switch (typeof e.tag == "number" && console.error(
+          "Received an unexpected object in getComponentNameFromType(). This is likely a bug in React. Please file an issue."
+        ), e.$$typeof) {
+          case N:
+            return "Portal";
+          case ee:
+            return e.displayName || "Context";
+          case K:
+            return (e._context.displayName || "Context") + ".Consumer";
+          case re:
+            var i = e.render;
+            return e = e.displayName, e || (e = i.displayName || i.name || "", e = e !== "" ? "ForwardRef(" + e + ")" : "ForwardRef"), e;
+          case ne:
+            return i = e.displayName || null, i !== null ? i : t(e.type) || "Memo";
+          case O:
+            i = e._payload, e = e._init;
+            try {
+              return t(e(i));
+            } catch {
+            }
+        }
+      return null;
+    }
+    function a(e) {
+      return "" + e;
+    }
+    function r(e) {
+      try {
+        a(e);
+        var i = !1;
+      } catch {
+        i = !0;
+      }
+      if (i) {
+        i = console;
+        var b = i.error, v = typeof Symbol == "function" && Symbol.toStringTag && e[Symbol.toStringTag] || e.constructor.name || "Object";
+        return b.call(
+          i,
+          "The provided key is an unsupported type %s. This value must be coerced to a string before using it here.",
+          v
+        ), a(e);
+      }
+    }
+    function n(e) {
+      if (e === j) return "<>";
+      if (typeof e == "object" && e !== null && e.$$typeof === O)
+        return "<...>";
+      try {
+        var i = t(e);
+        return i ? "<" + i + ">" : "<...>";
+      } catch {
+        return "<...>";
+      }
+    }
+    function s() {
+      var e = P.A;
+      return e === null ? null : e.getOwner();
+    }
+    function l() {
+      return Error("react-stack-top-frame");
+    }
+    function c(e) {
+      if (D.call(e, "key")) {
+        var i = Object.getOwnPropertyDescriptor(e, "key").get;
+        if (i && i.isReactWarning) return !1;
+      }
+      return e.key !== void 0;
+    }
+    function g(e, i) {
+      function b() {
+        Y || (Y = !0, console.error(
+          "%s: `key` is not a prop. Trying to access it will result in `undefined` being returned. If you need to access the same value within the child component, you should pass it as a different prop. (https://react.dev/link/special-props)",
+          i
+        ));
+      }
+      b.isReactWarning = !0, Object.defineProperty(e, "key", {
+        get: b,
+        configurable: !0
+      });
+    }
+    function w() {
+      var e = t(this.type);
+      return I[e] || (I[e] = !0, console.error(
+        "Accessing element.ref was removed in React 19. ref is now a regular prop. It will be removed from the JSX Element type in a future release."
+      )), e = this.props.ref, e !== void 0 ? e : null;
+    }
+    function x(e, i, b, v, U, V) {
+      var p = b.ref;
+      return e = {
+        $$typeof: f,
+        type: e,
+        key: i,
+        props: b,
+        _owner: v
+      }, (p !== void 0 ? p : null) !== null ? Object.defineProperty(e, "ref", {
+        enumerable: !1,
+        get: w
+      }) : Object.defineProperty(e, "ref", { enumerable: !1, value: null }), e._store = {}, Object.defineProperty(e._store, "validated", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: 0
+      }), Object.defineProperty(e, "_debugInfo", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: null
+      }), Object.defineProperty(e, "_debugStack", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: U
+      }), Object.defineProperty(e, "_debugTask", {
+        configurable: !1,
+        enumerable: !1,
+        writable: !0,
+        value: V
+      }), Object.freeze && (Object.freeze(e.props), Object.freeze(e)), e;
+    }
+    function y(e, i, b, v, U, V) {
+      var p = i.children;
+      if (p !== void 0)
+        if (v)
+          if (le(p)) {
+            for (v = 0; v < p.length; v++)
+              h(p[v]);
+            Object.freeze && Object.freeze(p);
+          } else
+            console.error(
+              "React.jsx: Static children should always be an array. You are likely explicitly calling React.jsxs or React.jsxDEV. Use the Babel transform instead."
+            );
+        else h(p);
+      if (D.call(i, "key")) {
+        p = t(e);
+        var R = Object.keys(i).filter(function(ie) {
+          return ie !== "key";
+        });
+        v = 0 < R.length ? "{key: someKey, " + R.join(": ..., ") + ": ...}" : "{key: someKey}", z[p + v] || (R = 0 < R.length ? "{" + R.join(": ..., ") + ": ...}" : "{}", console.error(
+          `A props object containing a "key" prop is being spread into JSX:
+  let props = %s;
+  <%s {...props} />
+React keys must be passed directly to JSX without using spread:
+  let props = %s;
+  <%s key={someKey} {...props} />`,
+          v,
+          p,
+          R,
+          p
+        ), z[p + v] = !0);
+      }
+      if (p = null, b !== void 0 && (r(b), p = "" + b), c(i) && (r(i.key), p = "" + i.key), "key" in i) {
+        b = {};
+        for (var L in i)
+          L !== "key" && (b[L] = i[L]);
+      } else b = i;
+      return p && g(
+        b,
+        typeof e == "function" ? e.displayName || e.name || "Unknown" : e
+      ), x(
+        e,
+        p,
+        b,
+        s(),
+        U,
+        V
+      );
+    }
+    function h(e) {
+      m(e) ? e._store && (e._store.validated = 1) : typeof e == "object" && e !== null && e.$$typeof === O && (e._payload.status === "fulfilled" ? m(e._payload.value) && e._payload.value._store && (e._payload.value._store.validated = 1) : e._store && (e._store.validated = 1));
+    }
+    function m(e) {
+      return typeof e == "object" && e !== null && e.$$typeof === f;
+    }
+    var k = M, f = Symbol.for("react.transitional.element"), N = Symbol.for("react.portal"), j = Symbol.for("react.fragment"), E = Symbol.for("react.strict_mode"), A = Symbol.for("react.profiler"), K = Symbol.for("react.consumer"), ee = Symbol.for("react.context"), re = Symbol.for("react.forward_ref"), te = Symbol.for("react.suspense"), ae = Symbol.for("react.suspense_list"), ne = Symbol.for("react.memo"), O = Symbol.for("react.lazy"), oe = Symbol.for("react.activity"), se = Symbol.for("react.client.reference"), P = k.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, D = Object.prototype.hasOwnProperty, le = Array.isArray, $ = console.createTask ? console.createTask : function() {
+      return null;
+    };
+    k = {
+      react_stack_bottom_frame: function(e) {
+        return e();
+      }
+    };
+    var Y, I = {}, F = k.react_stack_bottom_frame.bind(
+      k,
+      l
+    )(), W = $(n(l)), z = {};
+    C.Fragment = j, C.jsx = function(e, i, b) {
+      var v = 1e4 > P.recentlyCreatedOwnerStacks++;
+      return y(
+        e,
+        i,
+        b,
+        !1,
+        v ? Error("react-stack-top-frame") : F,
+        v ? $(n(e)) : W
+      );
+    }, C.jsxs = function(e, i, b) {
+      var v = 1e4 > P.recentlyCreatedOwnerStacks++;
+      return y(
+        e,
+        i,
+        b,
+        !0,
+        v ? Error("react-stack-top-frame") : F,
+        v ? $(n(e)) : W
+      );
+    };
+  })()), C;
+}
+var G;
+function ue() {
+  return G || (G = 1, process.env.NODE_ENV === "production" ? S.exports = de() : S.exports = ce()), S.exports;
+}
+var o = ue();
+function Z(t) {
+  var a, r, n = "";
+  if (typeof t == "string" || typeof t == "number") n += t;
+  else if (typeof t == "object") if (Array.isArray(t)) {
+    var s = t.length;
+    for (a = 0; a < s; a++) t[a] && (r = Z(t[a])) && (n && (n += " "), n += r);
+  } else for (r in t) t[r] && (n && (n += " "), n += r);
+  return n;
+}
+function ge() {
+  for (var t, a, r = 0, n = "", s = arguments.length; r < s; r++) (t = arguments[r]) && (a = Z(t)) && (n && (n += " "), n += a);
+  return n;
+}
+const X = (t) => typeof t == "boolean" ? `${t}` : t === 0 ? "0" : t, Q = ge, _ = (t, a) => (r) => {
+  var n;
+  if (a?.variants == null) return Q(t, r?.class, r?.className);
+  const { variants: s, defaultVariants: l } = a, c = Object.keys(s).map((x) => {
+    const y = r?.[x], h = l?.[x];
+    if (y === null) return null;
+    const m = X(y) || X(h);
+    return s[x][m];
+  }), g = r && Object.entries(r).reduce((x, y) => {
+    let [h, m] = y;
+    return m === void 0 || (x[h] = m), x;
+  }, {}), w = a == null || (n = a.compoundVariants) === null || n === void 0 ? void 0 : n.reduce((x, y) => {
+    let { class: h, className: m, ...k } = y;
+    return Object.entries(k).every((f) => {
+      let [N, j] = f;
+      return Array.isArray(j) ? j.includes({
+        ...l,
+        ...g
+      }[N]) : {
+        ...l,
+        ...g
+      }[N] === j;
+    }) ? [
+      ...x,
+      h,
+      m
+    ] : x;
+  }, []);
+  return Q(t, c, w, r?.class, r?.className);
+}, xe = _("grid gap-8", {
+  variants: {
+    layout: {
+      grid: "grid-cols-1 md:grid-cols-2",
+      stacked: "grid-cols-1 space-y-8",
+      cards: "grid-cols-1 md:grid-cols-2 gap-6"
+    },
+    spacing: {
+      sm: "gap-4",
+      md: "gap-8",
+      lg: "gap-12"
+    }
+  },
+  defaultVariants: {
+    layout: "grid",
+    spacing: "md"
+  }
+}), me = _("rounded-xl p-6 transition-all duration-300", {
+  variants: {
+    variant: {
+      traditional: "bg-red-50 dark:bg-red-900/20 border-2 border-red-100 dark:border-red-800/30 hover:border-red-200 dark:hover:border-red-700/50",
+      web3: "bg-green-50 dark:bg-green-900/20 border-2 border-green-100 dark:border-green-800/30 hover:border-green-200 dark:hover:border-green-700/50",
+      neutral: "bg-gray-50 dark:bg-gray-800/50 border-2 border-gray-100 dark:border-gray-700/30 hover:border-gray-200 dark:hover:border-gray-600/50",
+      elevated: "bg-white dark:bg-gray-800 shadow-lg hover:shadow-xl border border-gray-200 dark:border-gray-700"
+    },
+    animation: {
+      none: "",
+      hover: "hover:transform hover:scale-[1.02]",
+      float: "hover:-translate-y-1"
+    }
+  },
+  defaultVariants: {
+    variant: "traditional",
+    animation: "hover"
+  }
+}), fe = _("text-lg font-bold mb-4 flex items-center gap-3", {
+  variants: {
+    variant: {
+      traditional: "text-red-600 dark:text-red-400",
+      web3: "text-green-600 dark:text-green-400",
+      neutral: "text-gray-900 dark:text-white",
+      elevated: "text-gray-900 dark:text-white"
+    }
+  },
+  defaultVariants: {
+    variant: "traditional"
+  }
+}), be = {
+  traditional: "❌",
+  web3: "✅",
+  neutral: "ℹ️",
+  elevated: "⭐"
+}, he = {
+  red: "bg-red-100 text-red-800 dark:bg-red-900/30 dark:text-red-300",
+  green: "bg-green-100 text-green-800 dark:bg-green-900/30 dark:text-green-300",
+  blue: "bg-blue-100 text-blue-800 dark:bg-blue-900/30 dark:text-blue-300",
+  gray: "bg-gray-100 text-gray-800 dark:bg-gray-800 dark:text-gray-300"
+}, Ee = ({
+  className: t,
+  layout: a = "grid",
+  spacing: r = "md",
+  title: n,
+  subtitle: s,
+  traditional: l,
+  web3: c,
+  cardAnimation: g = "hover",
+  animate: w = !0,
+  animationDelay: x = 0,
+  traditionalIcon: y,
+  web3Icon: h
+}) => {
+  const m = (f, N) => {
+    const j = /* @__PURE__ */ o.jsxs(
+      "div",
+      {
+        className: d(
+          me({ variant: f.variant, animation: g })
+        ),
+        children: [
+          /* @__PURE__ */ o.jsxs("div", { className: d(fe({ variant: f.variant })), children: [
+            /* @__PURE__ */ o.jsx("span", { className: "text-2xl", children: f.icon || (N === 0 ? y : h) || be[f.variant] }),
+            /* @__PURE__ */ o.jsx("div", { className: "flex-1", children: /* @__PURE__ */ o.jsxs("div", { className: "flex items-center gap-2", children: [
+              /* @__PURE__ */ o.jsx("span", { children: f.title }),
+              f.badge && /* @__PURE__ */ o.jsx(
+                "span",
+                {
+                  className: d(
+                    "text-xs font-medium px-2 py-1 rounded-full",
+                    he[f.badge.color || "gray"]
+                  ),
+                  children: f.badge.text
+                }
+              )
+            ] }) })
+          ] }),
+          /* @__PURE__ */ o.jsx("ul", { className: "space-y-3", children: f.items.map((E, A) => /* @__PURE__ */ o.jsxs(
+            "li",
+            {
+              className: d(
+                "flex items-start gap-3 text-sm leading-relaxed",
+                E.highlight && "font-medium"
+              ),
+              children: [
+                E.icon && /* @__PURE__ */ o.jsx("span", { className: "flex-shrink-0 mt-0.5 text-base", children: E.icon }),
+                /* @__PURE__ */ o.jsxs("div", { className: "flex-1", children: [
+                  /* @__PURE__ */ o.jsx(
+                    "span",
+                    {
+                      className: d(
+                        f.variant === "traditional" || f.variant === "web3" ? "text-gray-700 dark:text-gray-300" : "text-gray-600 dark:text-gray-400"
+                      ),
+                      children: E.text
+                    }
+                  ),
+                  E.subtext && /* @__PURE__ */ o.jsx("p", { className: "text-xs text-gray-500 dark:text-gray-500 mt-1", children: E.subtext })
+                ] })
+              ]
+            },
+            A
+          )) })
+        ]
+      }
+    );
+    return /* @__PURE__ */ o.jsx("div", { children: j }, f.title);
+  };
+  return /* @__PURE__ */ o.jsxs("div", { className: d("space-y-8", t), children: [
+    (n || s) && /* @__PURE__ */ o.jsxs("div", { className: "text-center space-y-4", children: [
+      n && /* @__PURE__ */ o.jsx("h2", { className: "text-2xl sm:text-3xl font-bold text-gray-900 dark:text-white", children: n }),
+      s && /* @__PURE__ */ o.jsx("p", { className: "text-lg text-gray-600 dark:text-gray-400 max-w-2xl mx-auto", children: s })
+    ] }),
+    /* @__PURE__ */ o.jsxs("div", { className: d(xe({ layout: a, spacing: r })), children: [
+      m(l, 0),
+      m(c, 1)
+    ] })
+  ] });
+}, H = (t, a, r, n) => ({
+  title: t,
+  variant: r,
+  items: a.map((s) => typeof s == "string" ? { text: s } : s),
+  ...n
+}), _e = (t) => {
+  const a = [
+    { text: "Create account with email/password", icon: "🔑" },
+    { text: "Remember multiple passwords", icon: "🧠" },
+    { text: "Verify email address", icon: "📧" },
+    { text: "Risk of password theft", icon: "⚠️" },
+    { text: "Data stored on company servers", icon: "🏢" },
+    { text: "Account can be locked/suspended", icon: "🔒" }
+  ], r = [
+    { text: "Connect your wallet", icon: "🔗" },
+    { text: "No passwords needed", icon: "🚫" },
+    { text: "Instant authentication", icon: "⚡" },
+    { text: "Cryptographically secure", icon: "🔐" },
+    { text: "You own your data", icon: "👑" },
+    { text: "Censorship resistant", icon: "🛡️" }
+  ];
+  return {
+    traditional: H(
+      t?.traditionalTitle || "Traditional Email",
+      t?.traditionalItems || a,
+      "traditional",
+      { badge: { text: t?.traditionalBadge || "Old Way", color: "red" } }
+    ),
+    web3: H(
+      t?.web3Title || "Web3 Email",
+      t?.web3Items || r,
+      "web3",
+      { badge: { text: t?.web3Badge || "New Way", color: "green" } }
+    )
+  };
+}, Re = ({
+  className: t,
+  children: a,
+  disabled: r = !1,
+  onClick: n
+}) => /* @__PURE__ */ o.jsx(
+  "div",
+  {
+    className: d(
+      "p-4 rounded-lg border transition-colors",
+      "bg-white dark:bg-gray-900",
+      "border-gray-200 dark:border-gray-700",
+      "text-gray-900 dark:text-white",
+      r && "opacity-50 cursor-not-allowed",
+      "hover:bg-gray-50 dark:hover:bg-gray-800",
+      t
+    ),
+    onClick: r ? void 0 : n,
+    role: "region",
+    "aria-label": "UcontainerUstats",
+    children: a || "UcontainerUstats Component"
+  }
+), Te = ({
+  icon: t,
+  title: a = "No data",
+  description: r,
+  action: n,
+  className: s
+}) => /* @__PURE__ */ o.jsxs(
+  "div",
+  {
+    className: d(
+      "flex flex-col items-center justify-center py-12 px-4 text-center",
+      s
+    ),
+    children: [
+      t && /* @__PURE__ */ o.jsx("div", { className: "mb-4 text-gray-400 dark:text-gray-600", children: t }),
+      /* @__PURE__ */ o.jsx("h3", { className: d(u.heading.h3(), "mb-2"), children: a }),
+      r && /* @__PURE__ */ o.jsx(
+        "p",
+        {
+          className: d(
+            u.body.sm(),
+            "text-gray-600 dark:text-gray-400 max-w-sm mb-6"
+          ),
+          children: r
+        }
+      ),
+      n && /* @__PURE__ */ o.jsx("div", { className: "mt-4", children: n })
+    ]
+  }
+), Ce = ({
+  className: t,
+  children: a,
+  disabled: r = !1,
+  onClick: n
+}) => /* @__PURE__ */ o.jsx(
+  "div",
+  {
+    className: d(
+      "p-4 rounded-lg border transition-colors",
+      "bg-white dark:bg-gray-900",
+      "border-gray-200 dark:border-gray-700",
+      "text-gray-900 dark:text-white",
+      r && "opacity-50 cursor-not-allowed",
+      "hover:bg-gray-50 dark:hover:bg-gray-800",
+      t
+    ),
+    onClick: r ? void 0 : n,
+    role: "region",
+    "aria-label": "UfeatureUcomparison",
+    children: a || "UfeatureUcomparison Component"
+  }
+), Ue = ({
+  className: t,
+  children: a,
+  disabled: r = !1,
+  onClick: n
+}) => /* @__PURE__ */ o.jsx(
+  "div",
+  {
+    className: d(
+      "p-4 rounded-lg border transition-colors",
+      "bg-white dark:bg-gray-900",
+      "border-gray-200 dark:border-gray-700",
+      "text-gray-900 dark:text-white",
+      r && "opacity-50 cursor-not-allowed",
+      "hover:bg-gray-50 dark:hover:bg-gray-800",
+      t
+    ),
+    onClick: r ? void 0 : n,
+    role: "region",
+    "aria-label": "UfeatureUimportance",
+    children: a || "UfeatureUimportance Component"
+  }
+), Se = ({
+  value: t,
+  min: a = 0,
+  max: r = 100,
+  size: n = 120,
+  strokeWidth: s = 10,
+  showValue: l = !0,
+  label: c,
+  variant: g = "primary",
+  className: w
+}) => {
+  const x = Math.min(r, Math.max(a, t)), y = (x - a) / (r - a) * 100, h = n / 2, m = (n - s) / 2, k = Math.PI * m, f = k - y / 100 * k, N = {
+    primary: "stroke-blue-600 dark:stroke-blue-500",
+    success: "stroke-green-600 dark:stroke-green-500",
+    warning: "stroke-yellow-600 dark:stroke-yellow-500",
+    danger: "stroke-red-600 dark:stroke-red-500"
+  };
+  return /* @__PURE__ */ o.jsxs("div", { className: d("inline-flex flex-col items-center gap-2", w), children: [
+    /* @__PURE__ */ o.jsxs("svg", { width: n, height: n * 0.65, className: "transform rotate-180", children: [
+      /* @__PURE__ */ o.jsx(
+        "path",
+        {
+          d: `M ${s / 2} ${h} A ${m} ${m} 0 0 1 ${n - s / 2} ${h}`,
+          fill: "none",
+          className: "stroke-gray-200 dark:stroke-gray-700",
+          strokeWidth: s,
+          strokeLinecap: "round"
+        }
+      ),
+      /* @__PURE__ */ o.jsx(
+        "path",
+        {
+          d: `M ${s / 2} ${h} A ${m} ${m} 0 0 1 ${n - s / 2} ${h}`,
+          fill: "none",
+          className: d(N[g], "transition-all duration-500"),
+          strokeWidth: s,
+          strokeDasharray: k,
+          strokeDashoffset: f,
+          strokeLinecap: "round"
+        }
+      )
+    ] }),
+    l && /* @__PURE__ */ o.jsxs("div", { className: "text-center -mt-8", children: [
+      /* @__PURE__ */ o.jsx("div", { className: "text-2xl font-bold text-gray-900 dark:text-white", children: Math.round(x) }),
+      c && /* @__PURE__ */ o.jsx("div", { className: "text-xs text-gray-600 dark:text-gray-400", children: c })
+    ] })
+  ] });
+}, Ae = ({
+  message: t = "Loading...",
+  size: a = "default",
+  fullScreen: r = !1,
+  variant: n = "default",
+  className: s
+}) => {
+  const c = {
+    small: { spinner: "small", text: "text-sm" },
+    default: { spinner: "default", text: "text-base" },
+    large: { spinner: "large", text: "text-lg" }
+  }[a], g = r ? "fixed inset-0 z-50 flex items-center justify-center bg-white/80 dark:bg-gray-900/80" : "flex flex-col items-center justify-center p-8", w = /* @__PURE__ */ o.jsxs("div", { className: d(g, s), children: [
+    /* @__PURE__ */ o.jsx(J, { size: c.spinner, variant: n, className: "mb-4" }),
+    t && /* @__PURE__ */ o.jsx(
+      "p",
+      {
+        className: d(
+          c.text,
+          "text-gray-600 dark:text-gray-400 text-center max-w-sm"
+        ),
+        children: t
+      }
+    )
+  ] });
+  return r ? /* @__PURE__ */ o.jsx("div", { className: "fixed inset-0 z-50 bg-white/80 dark:bg-gray-900/80 backdrop-blur-sm", children: /* @__PURE__ */ o.jsxs("div", { className: "flex items-center justify-center min-h-full p-4", children: [
+    /* @__PURE__ */ o.jsx(J, { size: c.spinner, variant: n, className: "mb-4" }),
+    t && /* @__PURE__ */ o.jsx("p", { className: "text-center text-gray-600 dark:text-gray-400 max-w-sm", children: t })
+  ] }) }) : w;
+}, Oe = ({
+  className: t,
+  children: a,
+  disabled: r = !1,
+  onClick: n
+}) => /* @__PURE__ */ o.jsx(
+  "div",
+  {
+    className: d(
+      "p-4 rounded-lg border transition-colors",
+      "bg-white dark:bg-gray-900",
+      "border-gray-200 dark:border-gray-700",
+      "text-gray-900 dark:text-white",
+      r && "opacity-50 cursor-not-allowed",
+      "hover:bg-gray-50 dark:hover:bg-gray-800",
+      t
+    ),
+    onClick: r ? void 0 : n,
+    role: "region",
+    "aria-label": "UmetricUcomparison",
+    children: a || "UmetricUcomparison Component"
+  }
+), Pe = ({
+  className: t,
+  children: a,
+  disabled: r = !1,
+  onClick: n
+}) => /* @__PURE__ */ o.jsx(
+  "div",
+  {
+    className: d(
+      "p-4 rounded-lg border transition-colors",
+      "bg-white dark:bg-gray-900",
+      "border-gray-200 dark:border-gray-700",
+      "text-gray-900 dark:text-white",
+      r && "opacity-50 cursor-not-allowed",
+      "hover:bg-gray-50 dark:hover:bg-gray-800",
+      t
+    ),
+    onClick: r ? void 0 : n,
+    role: "region",
+    "aria-label": "UmodelUprediction",
+    children: a || "UmodelUprediction Component"
+  }
+), $e = ({
+  className: t,
+  children: a,
+  disabled: r = !1,
+  onClick: n
+}) => /* @__PURE__ */ o.jsx(
+  "div",
+  {
+    className: d(
+      "p-4 rounded-lg border transition-colors",
+      "bg-white dark:bg-gray-900",
+      "border-gray-200 dark:border-gray-700",
+      "text-gray-900 dark:text-white",
+      r && "opacity-50 cursor-not-allowed",
+      "hover:bg-gray-50 dark:hover:bg-gray-800",
+      t
+    ),
+    onClick: r ? void 0 : n,
+    role: "region",
+    "aria-label": "UprogressUtracker",
+    children: a || "UprogressUtracker Component"
+  }
+), Ve = ({ className: t, children: a, disabled: r }) => /* @__PURE__ */ o.jsx(
+  "div",
+  {
+    className: d(
+      "p-4 rounded-lg border transition-colors",
+      "bg-white dark:bg-gray-900",
+      "border-gray-200 dark:border-gray-700",
+      "text-gray-900 dark:text-white",
+      r && "opacity-50 cursor-not-allowed",
+      t
+    ),
+    role: "region",
+    "aria-label": "QaReport",
+    children: a || "QaReport Component"
+  }
+), Le = ({
+  className: t,
+  children: a,
+  disabled: r = !1,
+  onClick: n
+}) => /* @__PURE__ */ o.jsx(
+  "div",
+  {
+    className: d(
+      "p-4 rounded-lg border transition-colors",
+      "bg-white dark:bg-gray-900",
+      "border-gray-200 dark:border-gray-700",
+      "text-gray-900 dark:text-white",
+      r && "opacity-50 cursor-not-allowed",
+      "hover:bg-gray-50 dark:hover:bg-gray-800",
+      t
+    ),
+    onClick: r ? void 0 : n,
+    role: "region",
+    "aria-label": "UreportUbuilder",
+    children: a || "UreportUbuilder Component"
+  }
+), Me = ({
+  data: t,
+  width: a = 100,
+  height: r = 30,
+  color: n = "#3b82f6",
+  fill: s = !1,
+  className: l
+}) => {
+  if (t.length === 0) return null;
+  const c = Math.max(...t), g = Math.min(...t), w = c - g || 1, x = t.map((y, h) => {
+    const m = h / (t.length - 1) * a, k = r - (y - g) / w * r;
+    return `${m},${k}`;
+  }).join(" ");
+  return /* @__PURE__ */ o.jsxs(
+    "svg",
+    {
+      width: a,
+      height: r,
+      className: d("inline-block", l),
+      children: [
+        s && /* @__PURE__ */ o.jsx(
+          "polygon",
+          {
+            points: `0,${r} ${x} ${a},${r}`,
+            fill: n,
+            opacity: "0.2"
+          }
+        ),
+        /* @__PURE__ */ o.jsx(
+          "polyline",
+          {
+            points: x,
+            fill: "none",
+            stroke: n,
+            strokeWidth: "2",
+            strokeLinejoin: "round",
+            strokeLinecap: "round"
+          }
+        )
+      ]
+    }
+  );
+}, De = ({
+  value: t,
+  label: a,
+  variant: r = "neutral",
+  size: n = "md",
+  align: s = "center",
+  icon: l,
+  iconPosition: c = "top",
+  className: g,
+  valueClassName: w,
+  labelClassName: x
+}) => {
+  const y = {
+    primary: {
+      value: "text-blue-600 dark:text-blue-400",
+      label: "text-blue-600/70 dark:text-blue-400/70",
+      icon: "text-blue-600 dark:text-blue-400"
+    },
+    success: {
+      value: "text-green-600 dark:text-green-400",
+      label: "text-green-600/70 dark:text-green-400/70",
+      icon: "text-green-600 dark:text-green-400"
+    },
+    warning: {
+      value: "text-yellow-600 dark:text-yellow-400",
+      label: "text-yellow-600/70 dark:text-yellow-400/70",
+      icon: "text-yellow-600 dark:text-yellow-400"
+    },
+    danger: {
+      value: "text-red-600 dark:text-red-400",
+      label: "text-red-600/70 dark:text-red-400/70",
+      icon: "text-red-600 dark:text-red-400"
+    },
+    neutral: {
+      value: "text-gray-900 dark:text-gray-100",
+      label: "text-gray-600 dark:text-gray-400",
+      icon: "text-gray-600 dark:text-gray-400"
+    },
+    white: {
+      value: "text-white",
+      label: "text-white/70",
+      icon: "text-white"
+    }
+  }, h = {
+    sm: {
+      value: u.heading.h5(),
+      label: u.caption.default(),
+      icon: "h-4 w-4"
+    },
+    md: {
+      value: u.heading.h4(),
+      label: u.body.sm(),
+      icon: "h-5 w-5"
+    },
+    lg: {
+      value: u.heading.h3(),
+      label: u.body.md(),
+      icon: "h-6 w-6"
+    },
+    xl: {
+      value: u.heading.h2(),
+      label: u.body.lg(),
+      icon: "h-8 w-8"
+    }
+  }, m = {
+    left: "text-left",
+    center: "text-center",
+    right: "text-right"
+  }, k = y[r], f = h[n];
+  return /* @__PURE__ */ o.jsxs("div", { className: d(m[s], g), children: [
+    l && c === "top" && /* @__PURE__ */ o.jsx(
+      l,
+      {
+        className: d(
+          f.icon,
+          k.icon,
+          "mb-2",
+          s === "center" && "mx-auto"
+        )
+      }
+    ),
+    /* @__PURE__ */ o.jsxs(
+      "div",
+      {
+        className: d(
+          c === "left" && l && "flex items-center gap-3",
+          s === "center" && c === "left" && "justify-center"
+        ),
+        children: [
+          l && c === "left" && /* @__PURE__ */ o.jsx(l, { className: d(f.icon, k.icon) }),
+          /* @__PURE__ */ o.jsxs("div", { children: [
+            /* @__PURE__ */ o.jsx(
+              "div",
+              {
+                className: d(
+                  "font-bold",
+                  f.value,
+                  k.value,
+                  w
+                ),
+                children: t
+              }
+            ),
+            /* @__PURE__ */ o.jsx(
+              "div",
+              {
+                className: d(
+                  f.label,
+                  k.label,
+                  x
+                ),
+                children: a
+              }
+            )
+          ] })
+        ]
+      }
+    )
+  ] });
+}, Ye = ({
+  className: t,
+  children: a,
+  disabled: r
+}) => /* @__PURE__ */ o.jsx(
+  "div",
+  {
+    className: d(
+      "p-4 rounded-lg border transition-colors",
+      "bg-white dark:bg-gray-900",
+      "border-gray-200 dark:border-gray-700",
+      "text-gray-900 dark:text-white",
+      r && "opacity-50 cursor-not-allowed",
+      t
+    ),
+    role: "region",
+    "aria-label": "SupportDashboard",
+    children: a || "SupportDashboard Component"
+  }
+), Ie = ({
+  value: t,
+  previousValue: a,
+  format: r = "percentage",
+  currency: n = "$",
+  showArrow: s = !0,
+  size: l = "md",
+  className: c
+}) => {
+  const g = t - a, w = a !== 0 ? g / a * 100 : 0, x = g >= 0, y = () => {
+    switch (r) {
+      case "percentage":
+        return `${Math.abs(w).toFixed(1)}%`;
+      case "currency":
+        return `${n}${Math.abs(g).toFixed(2)}`;
+      case "number":
+        return Math.abs(g).toFixed(0);
+      default:
+        return "";
+    }
+  }, h = {
+    sm: "text-xs",
+    md: "text-sm",
+    lg: "text-base"
+  }, m = {
+    sm: "w-3 h-3",
+    md: "w-4 h-4",
+    lg: "w-5 h-5"
+  };
+  return /* @__PURE__ */ o.jsxs(
+    "div",
+    {
+      className: d(
+        "inline-flex items-center gap-1 font-semibold",
+        x ? "text-green-600 dark:text-green-400" : "text-red-600 dark:text-red-400",
+        h[l],
+        c
+      ),
+      children: [
+        s && /* @__PURE__ */ o.jsx(
+          "svg",
+          {
+            className: d(m[l]),
+            fill: "none",
+            stroke: "currentColor",
+            viewBox: "0 0 24 24",
+            children: x ? /* @__PURE__ */ o.jsx(
+              "path",
+              {
+                strokeLinecap: "round",
+                strokeLinejoin: "round",
+                strokeWidth: 2,
+                d: "M5 10l7-7m0 0l7 7m-7-7v18"
+              }
+            ) : /* @__PURE__ */ o.jsx(
+              "path",
+              {
+                strokeLinecap: "round",
+                strokeLinejoin: "round",
+                strokeWidth: 2,
+                d: "M19 14l-7 7m0 0l-7-7m7 7V3"
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ o.jsxs("span", { children: [
+          x ? "+" : "-",
+          y()
+        ] })
+      ]
+    }
+  );
+}, ye = _("", {
+  variants: {
+    variant: {
+      hero: u.heading.display.hero(),
+      display: u.heading.display.lg(),
+      h1: u.heading.h1(),
+      h2: u.heading.h2(),
+      h3: u.heading.h3()
+    },
+    responsive: {
+      true: "",
+      // Responsive sizing handled in variant
+      false: ""
+    },
+    align: {
+      left: "text-left",
+      center: "text-center",
+      right: "text-right"
+    },
+    color: {
+      default: "text-gray-900 dark:text-white",
+      muted: "text-gray-600 dark:text-gray-400",
+      vibrant: "text-white",
+      brand: "bg-gradient-to-r from-blue-600 to-purple-600 bg-clip-text text-transparent"
+    }
+  },
+  defaultVariants: {
+    variant: "h1",
+    responsive: !0,
+    align: "left",
+    color: "default"
+  }
+}), Fe = ({
+  children: t,
+  variant: a = "h1",
+  responsive: r = !0,
+  align: n = "left",
+  color: s = "default",
+  className: l,
+  as: c
+}) => {
+  const g = c || (a === "hero" || a === "display" || a === "h1" ? "h1" : a === "h2" ? "h2" : "h3");
+  return /* @__PURE__ */ o.jsx(
+    g,
+    {
+      className: d(
+        ye({ variant: a, responsive: r, align: n, color: s }),
+        l
+      ),
+      children: t
+    }
+  );
+}, ve = _("", {
+  variants: {
+    variant: {
+      h2: u.heading.h2(),
+      h3: u.heading.h3(),
+      h4: u.heading.h4(),
+      h5: u.heading.h5(),
+      h6: u.heading.h6()
+    },
+    spacing: {
+      none: "",
+      sm: "mb-2",
+      md: "mb-4",
+      lg: "mb-6",
+      xl: "mb-8"
+    },
+    align: {
+      left: "text-left",
+      center: "text-center",
+      right: "text-right"
+    }
+  },
+  defaultVariants: {
+    variant: "h2",
+    spacing: "md",
+    align: "left"
+  }
+}), We = ({
+  children: t,
+  variant: a = "h2",
+  spacing: r = "md",
+  align: n = "left",
+  className: s,
+  as: l
+}) => {
+  const c = l || a;
+  return M.createElement(
+    c,
+    {
+      className: d(
+        ve({ variant: a, spacing: r, align: n }),
+        s
+      )
+    },
+    t
+  );
+}, pe = _("", {
+  variants: {
+    variant: {
+      body: u.body.md(),
+      lead: u.body.lg(),
+      large: u.body.lg(),
+      small: u.body.sm(),
+      caption: u.body.xs()
+    },
+    color: {
+      default: "text-gray-700 dark:text-gray-300",
+      muted: "text-gray-500 dark:text-gray-500",
+      primary: "text-gray-900 dark:text-white"
+    },
+    align: {
+      left: "text-left",
+      center: "text-center",
+      right: "text-right",
+      justify: "text-justify"
+    }
+  },
+  defaultVariants: {
+    variant: "body",
+    color: "default",
+    align: "left"
+  }
+}), ze = ({
+  children: t,
+  variant: a = "body",
+  color: r = "default",
+  align: n = "left",
+  className: s,
+  as: l = "p"
+}) => M.createElement(
+  l,
+  { className: d(pe({ variant: a, color: r, align: n }), s) },
+  t
+), ke = _(u.link.default(), {
+  variants: {
+    variant: {
+      default: u.link.default(),
+      subtle: u.link.subtle(),
+      muted: u.link.muted(),
+      button: "inline-flex items-center justify-center px-4 py-2 rounded-md bg-blue-600 text-white hover:bg-blue-700 transition-colors"
+    },
+    external: {
+      true: "inline-flex items-center gap-1",
+      false: ""
+    }
+  },
+  defaultVariants: {
+    variant: "default",
+    external: !1
+  }
+}), Je = ({
+  children: t,
+  href: a,
+  variant: r = "default",
+  external: n = !1,
+  className: s,
+  target: l,
+  rel: c
+}) => /* @__PURE__ */ o.jsxs(
+  "a",
+  {
+    href: a,
+    target: l || (n ? "_blank" : void 0),
+    rel: c || (n ? "noopener noreferrer" : void 0),
+    className: d(ke({ variant: r, external: n }), s),
+    children: [
+      t,
+      n && /* @__PURE__ */ o.jsx(
+        "svg",
+        {
+          className: "w-4 h-4",
+          fill: "none",
+          stroke: "currentColor",
+          viewBox: "0 0 24 24",
+          children: /* @__PURE__ */ o.jsx(
+            "path",
+            {
+              strokeLinecap: "round",
+              strokeLinejoin: "round",
+              strokeWidth: 2,
+              d: "M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"
+            }
+          )
+        }
+      )
+    ]
+  }
+);
+export {
+  ze as BodyText,
+  Ee as ComparisonSection,
+  Te as EmptyState,
+  Se as Gauge,
+  Ae as LoadingState,
+  Fe as PageTitle,
+  Ve as QaReport,
+  We as SectionTitle,
+  Me as Sparkline,
+  De as StatDisplay,
+  Ye as SupportDashboard,
+  Je as TextLink,
+  Ie as TrendIndicator,
+  Re as UcontainerUstats,
+  Ce as UfeatureUcomparison,
+  Ue as UfeatureUimportance,
+  Oe as UmetricUcomparison,
+  Pe as UmodelUprediction,
+  $e as UprogressUtracker,
+  Le as UreportUbuilder,
+  H as createComparisonData,
+  _e as createEmailComparisonData
+};