@tangle-network/ui 1.0.0

package/dist/chunk-REJESC5U.js

@@ -0,0 +1,117 @@
+// src/hooks/use-live-time.ts
+import * as React from "react";
+function useLiveTime(intervalMs = 1e3) {
+  const [now, setNow] = React.useState(() => Date.now());
+  React.useEffect(() => {
+    const requested = Number.isFinite(intervalMs) && intervalMs > 0 ? intervalMs : 1e3;
+    const delay = Math.max(requested, 100);
+    const id = window.setInterval(() => {
+      setNow(Date.now());
+    }, delay);
+    return () => {
+      window.clearInterval(id);
+    };
+  }, [intervalMs]);
+  return now;
+}
+
+// src/hooks/use-auth.ts
+import * as React2 from "react";
+function useAuth({
+  apiBaseUrl,
+  revalidateOnFocus = false,
+  shouldRetryOnError = false
+}) {
+  const [user, setUser] = React2.useState(null);
+  const [isLoading, setIsLoading] = React2.useState(true);
+  const [error, setError] = React2.useState(null);
+  const retryTimerRef = React2.useRef(null);
+  const abortRef = React2.useRef(null);
+  const fetchSession = React2.useCallback(async () => {
+    abortRef.current?.abort();
+    const controller = new AbortController();
+    abortRef.current = controller;
+    setIsLoading(true);
+    setError(null);
+    try {
+      const res = await fetch(`${apiBaseUrl}/auth/session`, {
+        credentials: "include",
+        signal: controller.signal
+      });
+      if (!res.ok) {
+        throw new Error("Not authenticated");
+      }
+      const data = await res.json();
+      if (data.success && data.data) {
+        setUser(data.data);
+      } else {
+        setUser(null);
+      }
+    } catch (err) {
+      if (err.name === "AbortError") return;
+      setError(err instanceof Error ? err : new Error("Unknown error"));
+      setUser(null);
+      if (shouldRetryOnError) {
+        if (retryTimerRef.current) clearTimeout(retryTimerRef.current);
+        retryTimerRef.current = setTimeout(fetchSession, 5e3);
+      }
+    } finally {
+      if (!controller.signal.aborted) {
+        setIsLoading(false);
+      }
+    }
+  }, [apiBaseUrl, shouldRetryOnError]);
+  React2.useEffect(() => {
+    fetchSession();
+    return () => {
+      abortRef.current?.abort();
+      if (retryTimerRef.current) clearTimeout(retryTimerRef.current);
+    };
+  }, [fetchSession]);
+  React2.useEffect(() => {
+    if (!revalidateOnFocus) return;
+    const handleFocus = () => {
+      fetchSession();
+    };
+    window.addEventListener("focus", handleFocus);
+    return () => window.removeEventListener("focus", handleFocus);
+  }, [revalidateOnFocus, fetchSession]);
+  return {
+    user,
+    isLoading,
+    isError: !!error,
+    error,
+    mutate: fetchSession
+  };
+}
+function createAuthFetcher(_apiBaseUrl) {
+  return async function authFetcher(url, options) {
+    const res = await fetch(url, {
+      ...options,
+      credentials: "include",
+      headers: {
+        ...options?.headers
+      }
+    });
+    if (!res.ok) {
+      throw new Error(`Request failed with status ${res.status}`);
+    }
+    return res.json();
+  };
+}
+function useApiKey() {
+  const [apiKey, setApiKey] = React2.useState(null);
+  React2.useEffect(() => {
+    if (typeof window !== "undefined") {
+      setApiKey(localStorage.getItem("apiKey"));
+    }
+  }, []);
+  return apiKey;
+}
+
+export {
+  useLiveTime,
+  useAuth,
+  createAuthFetcher,
+  useApiKey
+};

package/dist/chunk-RQHJBTEU.js

@@ -0,0 +1,10 @@
+// src/lib/utils.ts
+import { clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+
+export {
+  cn
+};

package/dist/chunk-TMFOPHHN.js

@@ -0,0 +1,299 @@
+import {
+  Badge,
+  Card,
+  CardContent,
+  CardDescription,
+  CardHeader,
+  CardTitle,
+  Table,
+  TableBody,
+  TableCell,
+  TableHead,
+  TableHeader,
+  TableRow
+} from "./chunk-GYPQXTJU.js";
+import {
+  Button
+} from "./chunk-MKTSMWVD.js";
+import {
+  Markdown
+} from "./chunk-CD53GZOM.js";
+import {
+  CodeBlock
+} from "./chunk-66BNMOVT.js";
+import {
+  cn
+} from "./chunk-RQHJBTEU.js";
+
+// src/openui/openui-artifact-renderer.tsx
+import { Fragment } from "react";
+import { Minus } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+var NODE_TYPES = /* @__PURE__ */ new Set([
+  "heading",
+  "text",
+  "badge",
+  "stat",
+  "key_value",
+  "code",
+  "markdown",
+  "table",
+  "actions",
+  "separator",
+  "stack",
+  "grid",
+  "card"
+]);
+var GAP_STYLES = {
+  sm: "gap-2",
+  md: "gap-4",
+  lg: "gap-6"
+};
+var GRID_STYLES = {
+  1: "grid-cols-1",
+  2: "grid-cols-1 md:grid-cols-2",
+  3: "grid-cols-1 md:grid-cols-3",
+  4: "grid-cols-1 md:grid-cols-2 xl:grid-cols-4"
+};
+var ALIGN_STYLES = {
+  start: "items-start",
+  center: "items-center",
+  end: "items-end",
+  stretch: "items-stretch"
+};
+function formatValue(value) {
+  if (value === null || value === void 0) {
+    return /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: "\u2014" });
+  }
+  if (typeof value === "boolean") {
+    return value ? "Yes" : "No";
+  }
+  return value;
+}
+function asArray(value) {
+  return Array.isArray(value) ? value : [];
+}
+function isOpenUIComponentNode(value) {
+  return typeof value === "object" && value !== null && "type" in value && typeof value.type === "string" && NODE_TYPES.has(value.type);
+}
+function renderActions(actions, onAction) {
+  if (actions.length === 0) return null;
+  return /* @__PURE__ */ jsx("div", { className: "flex flex-wrap items-center gap-2", children: actions.map((action) => /* @__PURE__ */ jsx(
+    Button,
+    {
+      type: "button",
+      size: "sm",
+      variant: action.tone ?? "outline",
+      disabled: action.disabled,
+      onClick: () => {
+        action.onPress?.();
+        onAction?.(action);
+      },
+      children: action.label
+    },
+    action.id
+  )) });
+}
+function renderNode(node, onAction) {
+  switch (node.type) {
+    case "heading": {
+      const level = node.level ?? 2;
+      const HeadingTag = `h${level}`;
+      return /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+        node.kicker && /* @__PURE__ */ jsx("div", { className: "text-[10px] font-semibold uppercase tracking-[0.16em] text-muted-foreground", children: node.kicker }),
+        /* @__PURE__ */ jsx(
+          HeadingTag,
+          {
+            className: cn(
+              "font-semibold tracking-tight text-foreground",
+              level === 1 && "text-2xl",
+              level === 2 && "text-xl",
+              level === 3 && "text-lg",
+              level === 4 && "text-base"
+            ),
+            children: node.text
+          }
+        ),
+        node.meta && /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: node.meta })
+      ] });
+    }
+    case "text":
+      return /* @__PURE__ */ jsx(
+        "p",
+        {
+          className: cn(
+            "text-sm leading-6 text-foreground",
+            node.tone === "muted" && "text-muted-foreground",
+            node.tone === "success" && "text-[var(--surface-success-text)]",
+            node.tone === "warning" && "text-[var(--surface-warning-text)]",
+            node.tone === "error" && "text-[var(--surface-danger-text)]",
+            node.mono && "font-mono text-[13px]"
+          ),
+          children: node.text
+        }
+      );
+    case "badge":
+      return /* @__PURE__ */ jsx(Badge, { variant: node.tone ?? "outline", children: node.label });
+    case "stat":
+      return /* @__PURE__ */ jsx(Card, { variant: "glass", className: "border-border shadow-[var(--shadow-card)]", children: /* @__PURE__ */ jsxs(CardContent, { className: "space-y-2 p-4", children: [
+        /* @__PURE__ */ jsx("div", { className: "text-xs uppercase tracking-[0.12em] text-muted-foreground", children: node.label }),
+        /* @__PURE__ */ jsx("div", { className: "text-2xl font-semibold tracking-tight text-foreground", children: node.value }),
+        node.change && /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: cn(
+              "text-xs",
+              node.tone === "success" && "text-[var(--surface-success-text)]",
+              node.tone === "warning" && "text-[var(--surface-warning-text)]",
+              node.tone === "error" && "text-[var(--surface-danger-text)]",
+              node.tone === "info" && "text-[var(--surface-info-text)]",
+              !node.tone || node.tone === "default" ? "text-muted-foreground" : void 0
+            ),
+            children: node.change
+          }
+        )
+      ] }) });
+    case "key_value":
+      if (asArray(node.items).length === 0) {
+        return null;
+      }
+      return /* @__PURE__ */ jsx("dl", { className: "grid gap-3 sm:grid-cols-2", children: asArray(node.items).map((item, index) => /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: "rounded-[var(--radius-lg)] border border-border bg-card px-4 py-3",
+          children: [
+            /* @__PURE__ */ jsx("dt", { className: "text-[11px] uppercase tracking-[0.12em] text-muted-foreground", children: item.label }),
+            /* @__PURE__ */ jsx(
+              "dd",
+              {
+                className: cn(
+                  "mt-1 text-sm font-medium text-foreground",
+                  item.tone === "muted" && "text-foreground"
+                ),
+                children: formatValue(item.value)
+              }
+            )
+          ]
+        },
+        item.id ?? `${item.label}-${index}`
+      )) });
+    case "code":
+      return /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+        node.title && /* @__PURE__ */ jsx("div", { className: "text-xs uppercase tracking-[0.12em] text-muted-foreground", children: node.title }),
+        /* @__PURE__ */ jsx(
+          CodeBlock,
+          {
+            code: node.code,
+            language: node.language,
+            showLineNumbers: node.showLineNumbers,
+            className: "border-border bg-background"
+          }
+        )
+      ] });
+    case "markdown":
+      return /* @__PURE__ */ jsx("div", { className: "rounded-[var(--radius-lg)] border border-border bg-card p-5", children: /* @__PURE__ */ jsx(Markdown, { className: "prose-sm max-w-none", children: node.content }) });
+    case "table":
+      if (asArray(node.columns).length === 0) {
+        return null;
+      }
+      return /* @__PURE__ */ jsxs("div", { className: "overflow-hidden rounded-[var(--radius-lg)] border border-border bg-card", children: [
+        /* @__PURE__ */ jsxs(Table, { children: [
+          /* @__PURE__ */ jsx(TableHeader, { children: /* @__PURE__ */ jsx(TableRow, { className: "border-border", children: asArray(node.columns).map((column) => /* @__PURE__ */ jsx(
+            TableHead,
+            {
+              className: cn(
+                "h-10 text-[11px] uppercase tracking-[0.1em] text-muted-foreground",
+                column.align === "right" && "text-right"
+              ),
+              children: column.header
+            },
+            column.key
+          )) }) }),
+          /* @__PURE__ */ jsx(TableBody, { children: asArray(node.rows).map((row, rowIndex) => /* @__PURE__ */ jsx(TableRow, { className: "border-border", children: asArray(node.columns).map((column) => /* @__PURE__ */ jsx(
+            TableCell,
+            {
+              className: cn(
+                "py-3 text-sm text-foreground",
+                column.align === "right" && "text-right tabular-nums"
+              ),
+              children: formatValue(row[column.key])
+            },
+            column.key
+          )) }, rowIndex)) })
+        ] }),
+        node.caption && /* @__PURE__ */ jsx("div", { className: "border-t border-border px-4 py-2 text-xs text-muted-foreground", children: node.caption })
+      ] });
+    case "actions":
+      return renderActions(asArray(node.actions), onAction);
+    case "separator":
+      return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+        /* @__PURE__ */ jsx("div", { className: "h-px flex-1 bg-border" }),
+        node.label && /* @__PURE__ */ jsx("span", { className: "text-[10px] uppercase tracking-[0.14em] text-muted-foreground", children: node.label }),
+        /* @__PURE__ */ jsx("div", { className: "h-px flex-1 bg-border" })
+      ] });
+    case "stack":
+      if (asArray(node.children).length === 0) {
+        return null;
+      }
+      return /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: cn(
+            "flex",
+            node.direction === "row" ? "flex-row" : "flex-col",
+            GAP_STYLES[node.gap ?? "md"],
+            ALIGN_STYLES[node.align ?? "stretch"],
+            node.wrap && "flex-wrap"
+          ),
+          children: asArray(node.children).map((child, index) => /* @__PURE__ */ jsx(Fragment, { children: renderNode(child, onAction) }, child.id ?? `${child.type}-${index}`))
+        }
+      );
+    case "grid":
+      if (asArray(node.children).length === 0) {
+        return null;
+      }
+      return /* @__PURE__ */ jsx("div", { className: cn("grid", GRID_STYLES[node.columns ?? 2], GAP_STYLES[node.gap ?? "md"]), children: asArray(node.children).map((child, index) => /* @__PURE__ */ jsx(Fragment, { children: renderNode(child, onAction) }, child.id ?? `${child.type}-${index}`)) });
+    case "card":
+      return /* @__PURE__ */ jsxs(Card, { variant: "glass", className: "border-border shadow-[var(--shadow-card)]", children: [
+        (node.eyebrow || node.title || node.description || node.badge || asArray(node.actions).length > 0) && /* @__PURE__ */ jsxs(CardHeader, { className: "gap-2 p-4 pb-0", children: [
+          /* @__PURE__ */ jsxs("div", { className: "flex items-start justify-between gap-3", children: [
+            /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1 space-y-1", children: [
+              node.eyebrow && /* @__PURE__ */ jsx("div", { className: "text-[10px] font-semibold uppercase tracking-[0.16em] text-muted-foreground", children: node.eyebrow }),
+              node.title && /* @__PURE__ */ jsx(CardTitle, { className: "text-base text-foreground", children: node.title }),
+              node.description && /* @__PURE__ */ jsx(CardDescription, { className: "text-muted-foreground", children: node.description })
+            ] }),
+            node.badge && /* @__PURE__ */ jsx(Badge, { variant: node.badge.tone ?? "outline", children: node.badge.label })
+          ] }),
+          asArray(node.actions).length > 0 && renderActions(asArray(node.actions), onAction)
+        ] }),
+        asArray(node.children).length > 0 && /* @__PURE__ */ jsx(CardContent, { className: "space-y-4 p-4", children: asArray(node.children).map((child, index) => /* @__PURE__ */ jsx(Fragment, { children: renderNode(child, onAction) }, child.id ?? `${child.type}-${index}`)) })
+      ] });
+  }
+}
+function OpenUIArtifactRenderer({
+  schema,
+  onAction,
+  className
+}) {
+  const nodes = (Array.isArray(schema) ? schema : [schema]).filter(isOpenUIComponentNode);
+  if (nodes.length === 0) {
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: cn(
+          "flex min-h-[6rem] items-center justify-center rounded-[var(--radius-xl)] border border-dashed border-border bg-card p-5 text-center",
+          className
+        ),
+        children: /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+          /* @__PURE__ */ jsx("div", { className: "mx-auto flex h-10 w-10 items-center justify-center rounded-full bg-muted/50 text-muted-foreground", children: /* @__PURE__ */ jsx(Minus, { className: "h-4 w-4" }) }),
+          /* @__PURE__ */ jsx("div", { className: "text-sm font-medium text-foreground", children: "No view was generated." })
+        ] })
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx("div", { className: cn("space-y-4", className), children: nodes.map((node, index) => /* @__PURE__ */ jsx(Fragment, { children: renderNode(node, onAction) }, node.id ?? `${node.type}-${index}`)) });
+}
+
+export {
+  OpenUIArtifactRenderer
+};

package/dist/chunk-XGKULLYE.js

@@ -0,0 +1,40 @@
+// src/utils/copy-text.ts
+async function copyText(text) {
+  if (typeof navigator !== "undefined" && navigator.clipboard?.writeText) {
+    try {
+      await navigator.clipboard.writeText(text);
+      return true;
+    } catch {
+    }
+  }
+  if (typeof document === "undefined") return false;
+  try {
+    const textarea = document.createElement("textarea");
+    textarea.value = text;
+    textarea.style.position = "fixed";
+    textarea.style.opacity = "0";
+    document.body.appendChild(textarea);
+    textarea.select();
+    const copied = document.execCommand("copy");
+    document.body.removeChild(textarea);
+    return copied;
+  } catch {
+    return false;
+  }
+}
+
+// src/utils/time-ago.ts
+function timeAgo(ts) {
+  const secs = Math.floor((Date.now() - ts) / 1e3);
+  if (secs < 5) return "just now";
+  if (secs < 60) return `${secs}s ago`;
+  const mins = Math.floor(secs / 60);
+  if (mins < 60) return `${mins}m ago`;
+  const hrs = Math.floor(mins / 60);
+  return `${hrs}h ago`;
+}
+
+export {
+  copyText,
+  timeAgo
+};