reend-components 0.1.0 → 0.2.0

package/dist/lib/index.mjs

@@ -1,42 +1,43 @@
-import { jsx as r, jsxs as m } from "react/jsx-runtime";
-import * as i from "react";
-import * as c from "@radix-ui/react-tooltip";
-import { clsx as N } from "clsx";
-import { twMerge as S } from "tailwind-merge";
-import * as a from "@radix-ui/react-toast";
-import { cva as A } from "class-variance-authority";
-import { X as O } from "lucide-react";
-import { Toaster as R } from "sonner";
-import { toast as K } from "sonner";
-function n(...t) {
-  return S(N(t));
+import { jsx as t, jsxs as i } from "react/jsx-runtime";
+import * as n from "react";
+import * as T from "@radix-ui/react-tooltip";
+import { clsx as z } from "clsx";
+import { twMerge as H } from "tailwind-merge";
+import * as m from "@radix-ui/react-toast";
+import { cva as P } from "class-variance-authority";
+import { X as W, Crosshair as Y, Terminal as X, AlertTriangle as K } from "lucide-react";
+import { Toaster as Q } from "sonner";
+import { toast as Ue } from "sonner";
+import { AnimatePresence as Z, motion as I, useInView as q } from "framer-motion";
+function x(...e) {
+  return H(z(e));
 }
-const F = c.Provider, G = c.Root, Q = c.Trigger, E = i.forwardRef(({ className: t, sideOffset: e = 4, ...o }, s) => /* @__PURE__ */ r(
-  c.Content,
+const Le = T.Provider, Oe = T.Root, Pe = T.Trigger, J = n.forwardRef(({ className: e, sideOffset: r = 4, ...o }, a) => /* @__PURE__ */ t(
+  T.Content,
   {
-    ref: s,
-    sideOffset: e,
-    className: n(
+    ref: a,
+    sideOffset: r,
+    className: x(
       "z-50 overflow-hidden border bg-popover px-3 py-1.5 text-sm text-popover-foreground shadow-md animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
-      t
+      e
     ),
     ...o
   }
 ));
-E.displayName = c.Content.displayName;
-const _ = a.Provider, v = i.forwardRef(({ className: t, ...e }, o) => /* @__PURE__ */ r(
-  a.Viewport,
+J.displayName = T.Content.displayName;
+const ee = m.Provider, _ = n.forwardRef(({ className: e, ...r }, o) => /* @__PURE__ */ t(
+  m.Viewport,
   {
     ref: o,
-    className: n(
+    className: x(
       "fixed top-0 z-[100] flex max-h-screen w-full flex-col-reverse p-4 sm:bottom-0 sm:right-0 sm:top-auto sm:flex-col md:max-w-[420px]",
-      t
+      e
     ),
-    ...e
+    ...r
   }
 ));
-v.displayName = a.Viewport.displayName;
-const D = A(
+_.displayName = m.Viewport.displayName;
+const te = P(
   "group pointer-events-auto relative flex w-full items-center justify-between space-x-4 overflow-hidden border p-6 pr-8 shadow-lg transition-all data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full data-[state=open]:slide-in-from-top-full data-[state=open]:sm:slide-in-from-bottom-full",
   {
     variants: {
@@ -49,170 +50,170 @@ const D = A(
       variant: "default"
     }
   }
-), x = i.forwardRef(({ className: t, variant: e, ...o }, s) => /* @__PURE__ */ r(
-  a.Root,
+), M = n.forwardRef(({ className: e, variant: r, ...o }, a) => /* @__PURE__ */ t(
+  m.Root,
   {
-    ref: s,
-    className: n(D({ variant: e }), t),
+    ref: a,
+    className: x(te({ variant: r }), e),
     ...o
   }
 ));
-x.displayName = a.Root.displayName;
-const I = i.forwardRef(({ className: t, ...e }, o) => /* @__PURE__ */ r(
-  a.Action,
+M.displayName = m.Root.displayName;
+const re = n.forwardRef(({ className: e, ...r }, o) => /* @__PURE__ */ t(
+  m.Action,
   {
     ref: o,
-    className: n(
+    className: x(
       "inline-flex h-8 shrink-0 items-center justify-center border bg-transparent px-3 text-sm font-medium ring-offset-background transition-colors group-[.destructive]:border-muted/40 hover:bg-secondary group-[.destructive]:hover:border-destructive/30 group-[.destructive]:hover:bg-destructive group-[.destructive]:hover:text-destructive-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 group-[.destructive]:focus:ring-destructive disabled:pointer-events-none disabled:opacity-50",
-      t
+      e
     ),
-    ...e
+    ...r
   }
 ));
-I.displayName = a.Action.displayName;
-const h = i.forwardRef(({ className: t, ...e }, o) => /* @__PURE__ */ r(
-  a.Close,
+re.displayName = m.Action.displayName;
+const V = n.forwardRef(({ className: e, ...r }, o) => /* @__PURE__ */ t(
+  m.Close,
   {
     ref: o,
-    className: n(
+    className: x(
       "absolute right-2 top-2 p-1 text-foreground/50 opacity-0 transition-opacity group-hover:opacity-100 group-[.destructive]:text-red-300 hover:text-foreground group-[.destructive]:hover:text-red-50 focus:opacity-100 focus:outline-none focus:ring-2 group-[.destructive]:focus:ring-red-400 group-[.destructive]:focus:ring-offset-red-600",
-      t
+      e
     ),
     "toast-close": "",
-    ...e,
-    children: /* @__PURE__ */ r(O, { className: "h-4 w-4" })
+    ...r,
+    children: /* @__PURE__ */ t(W, { className: "h-4 w-4" })
   }
 ));
-h.displayName = a.Close.displayName;
-const y = i.forwardRef(({ className: t, ...e }, o) => /* @__PURE__ */ r(
-  a.Title,
+V.displayName = m.Close.displayName;
+const B = n.forwardRef(({ className: e, ...r }, o) => /* @__PURE__ */ t(
+  m.Title,
   {
     ref: o,
-    className: n("text-sm font-semibold", t),
-    ...e
+    className: x("text-sm font-semibold", e),
+    ...r
   }
 ));
-y.displayName = a.Title.displayName;
-const b = i.forwardRef(({ className: t, ...e }, o) => /* @__PURE__ */ r(
-  a.Description,
+B.displayName = m.Title.displayName;
+const U = n.forwardRef(({ className: e, ...r }, o) => /* @__PURE__ */ t(
+  m.Description,
   {
     ref: o,
-    className: n("text-sm opacity-90", t),
-    ...e
+    className: x("text-sm opacity-90", e),
+    ...r
   }
 ));
-b.displayName = a.Description.displayName;
-const M = 1, P = 5e3;
-let f = 0;
-function V() {
-  return f = (f + 1) % Number.MAX_SAFE_INTEGER, f.toString();
+U.displayName = m.Description.displayName;
+const oe = 1, ae = 5e3;
+let $ = 0;
+function se() {
+  return $ = ($ + 1) % Number.MAX_SAFE_INTEGER, $.toString();
 }
-const g = /* @__PURE__ */ new Map(), T = (t) => {
-  if (g.has(t))
+const D = /* @__PURE__ */ new Map(), O = (e) => {
+  if (D.has(e))
     return;
-  const e = setTimeout(() => {
-    g.delete(t), u({
+  const r = setTimeout(() => {
+    D.delete(e), N({
       type: "REMOVE_TOAST",
-      toastId: t
+      toastId: e
     });
-  }, P);
-  g.set(t, e);
-}, C = (t, e) => {
-  switch (e.type) {
+  }, ae);
+  D.set(e, r);
+}, ne = (e, r) => {
+  switch (r.type) {
     case "ADD_TOAST":
       return {
-        ...t,
-        toasts: [e.toast, ...t.toasts].slice(0, M)
+        ...e,
+        toasts: [r.toast, ...e.toasts].slice(0, oe)
       };
     case "UPDATE_TOAST":
       return {
-        ...t,
-        toasts: t.toasts.map(
-          (o) => o.id === e.toast.id ? { ...o, ...e.toast } : o
+        ...e,
+        toasts: e.toasts.map(
+          (o) => o.id === r.toast.id ? { ...o, ...r.toast } : o
         )
       };
     case "DISMISS_TOAST": {
-      const { toastId: o } = e;
-      return o ? T(o) : t.toasts.forEach((s) => {
-        T(s.id);
+      const { toastId: o } = r;
+      return o ? O(o) : e.toasts.forEach((a) => {
+        O(a.id);
       }), {
-        ...t,
-        toasts: t.toasts.map(
-          (s) => s.id === o || o === void 0 ? {
-            ...s,
+        ...e,
+        toasts: e.toasts.map(
+          (a) => a.id === o || o === void 0 ? {
+            ...a,
             open: !1
-          } : s
+          } : a
         )
       };
     }
     case "REMOVE_TOAST":
-      return e.toastId === void 0 ? {
-        ...t,
+      return r.toastId === void 0 ? {
+        ...e,
         toasts: []
       } : {
-        ...t,
-        toasts: t.toasts.filter((o) => o.id !== e.toastId)
+        ...e,
+        toasts: e.toasts.filter((o) => o.id !== r.toastId)
       };
   }
-}, p = [];
-let l = { toasts: [] };
-function u(t) {
-  l = C(l, t), p.forEach((e) => {
-    e(l);
+}, S = [];
+let E = { toasts: [] };
+function N(e) {
+  E = ne(E, e), S.forEach((r) => {
+    r(E);
   });
 }
-function k({ ...t }) {
-  const e = V(), o = (d) => u({
+function ie({ ...e }) {
+  const r = se(), o = (s) => N({
     type: "UPDATE_TOAST",
-    toast: { ...d, id: e }
-  }), s = () => u({ type: "DISMISS_TOAST", toastId: e });
-  return u({
+    toast: { ...s, id: r }
+  }), a = () => N({ type: "DISMISS_TOAST", toastId: r });
+  return N({
     type: "ADD_TOAST",
     toast: {
-      ...t,
-      id: e,
+      ...e,
+      id: r,
       open: !0,
-      onOpenChange: (d) => {
-        d || s();
+      onOpenChange: (s) => {
+        s || a();
       }
     }
   }), {
-    id: e,
-    dismiss: s,
+    id: r,
+    dismiss: a,
     update: o
   };
 }
-function j() {
-  const [t, e] = i.useState(l);
-  return i.useEffect(() => (p.push(e), () => {
-    const o = p.indexOf(e);
-    o > -1 && p.splice(o, 1);
-  }), [t]), {
-    ...t,
-    toast: k,
-    dismiss: (o) => u({ type: "DISMISS_TOAST", toastId: o })
+function le() {
+  const [e, r] = n.useState(E);
+  return n.useEffect(() => (S.push(r), () => {
+    const o = S.indexOf(r);
+    o > -1 && S.splice(o, 1);
+  }), [e]), {
+    ...e,
+    toast: ie,
+    dismiss: (o) => N({ type: "DISMISS_TOAST", toastId: o })
   };
 }
-function Y() {
-  const { toasts: t } = j();
-  return /* @__PURE__ */ m(_, { children: [
-    t.map(function({ id: e, title: o, description: s, action: d, ...w }) {
-      return /* @__PURE__ */ m(x, { ...w, children: [
-        /* @__PURE__ */ m("div", { className: "grid gap-1", children: [
-          o && /* @__PURE__ */ r(y, { children: o }),
-          s && /* @__PURE__ */ r(b, { children: s })
+function _e() {
+  const { toasts: e } = le();
+  return /* @__PURE__ */ i(ee, { children: [
+    e.map(function({ id: r, title: o, description: a, action: s, ...c }) {
+      return /* @__PURE__ */ i(M, { ...c, children: [
+        /* @__PURE__ */ i("div", { className: "grid gap-1", children: [
+          o && /* @__PURE__ */ t(B, { children: o }),
+          a && /* @__PURE__ */ t(U, { children: a })
         ] }),
-        d,
-        /* @__PURE__ */ r(h, {})
-      ] }, e);
+        s,
+        /* @__PURE__ */ t(V, {})
+      ] }, r);
     }),
-    /* @__PURE__ */ r(v, {})
+    /* @__PURE__ */ t(_, {})
   ] });
 }
-const q = ({ theme: t = "dark", ...e }) => /* @__PURE__ */ r(
-  R,
+const Me = ({ theme: e = "dark", ...r }) => /* @__PURE__ */ t(
+  Q,
   {
-    theme: t,
+    theme: e,
     className: "toaster group",
     toastOptions: {
       classNames: {
@@ -222,26 +223,552 @@ const q = ({ theme: t = "dark", ...e }) => /* @__PURE__ */ r(
         cancelButton: "group-[.toast]:bg-muted group-[.toast]:text-muted-foreground"
       }
     },
-    ...e
+    ...r
+  }
+), de = n.forwardRef(
+  ({ children: e, className: r = "" }, o) => /* @__PURE__ */ i("span", { ref: o, className: `relative inline-block ${r}`, children: [
+    /* @__PURE__ */ t("span", { className: "relative z-10", children: e }),
+    /* @__PURE__ */ t(
+      "span",
+      {
+        "aria-hidden": !0,
+        className: "absolute inset-0 text-ef-cyan opacity-70 animate-glitch",
+        style: {
+          clipPath: "inset(20% 0 50% 0)",
+          transform: "translate(-2px, 0)"
+        },
+        children: e
+      }
+    ),
+    /* @__PURE__ */ t(
+      "span",
+      {
+        "aria-hidden": !0,
+        className: "absolute inset-0 text-ef-red opacity-70 animate-glitch",
+        style: {
+          clipPath: "inset(50% 0 20% 0)",
+          transform: "translate(2px, 0)",
+          animationDelay: "0.1s"
+        },
+        children: e
+      }
+    )
+  ] })
+);
+de.displayName = "GlitchText";
+const ce = { sm: 16, md: 28, lg: 44 }, pe = n.forwardRef(({ size: e = "md", label: r, className: o }, a) => {
+  const s = ce[e];
+  return /* @__PURE__ */ i(
+    "div",
+    {
+      ref: a,
+      className: `flex flex-col items-center gap-3${o ? ` ${o}` : ""}`,
+      children: [
+        /* @__PURE__ */ t("div", { className: "relative", style: { width: s * 2, height: s * 2 }, children: [0, 1, 2].map((c) => /* @__PURE__ */ t(
+          "div",
+          {
+            className: "absolute inset-0 border-2 border-primary",
+            style: {
+              transform: `rotate(45deg) scale(${1 - c * 0.25})`,
+              animation: `diamondSpin ${1.2 + c * 0.4}s linear infinite${c === 1 ? " reverse" : ""}`,
+              opacity: 1 - c * 0.25
+            }
+          },
+          c
+        )) }),
+        r && /* @__PURE__ */ t("span", { className: "font-mono text-xs text-muted-foreground tracking-[0.15em] uppercase", children: r })
+      ]
+    }
+  );
+});
+pe.displayName = "DiamondLoader";
+const me = {
+  online: "ONLINE",
+  warning: "CAUTION",
+  offline: "OFFLINE",
+  scanning: "SCANNING"
+}, fe = {
+  online: "bg-ef-green",
+  warning: "bg-ef-yellow",
+  offline: "bg-ef-red",
+  scanning: "bg-ef-cyan animate-pulse"
+}, ue = n.forwardRef(({ title: e, status: r = "online", children: o, className: a }, s) => /* @__PURE__ */ i(
+  "div",
+  {
+    ref: s,
+    className: `relative border border-border bg-surface-1 scanline-overlay${a ? ` ${a}` : ""}`,
+    children: [
+      /* @__PURE__ */ i("div", { className: "flex items-center justify-between px-4 py-2.5 border-b border-border bg-surface-0", children: [
+        /* @__PURE__ */ i("div", { className: "flex items-center gap-3", children: [
+          /* @__PURE__ */ t(Y, { className: "w-3.5 h-3.5 text-primary" }),
+          /* @__PURE__ */ t("span", { className: "font-display text-[11px] font-bold tracking-[0.15em] uppercase text-foreground", children: e })
+        ] }),
+        /* @__PURE__ */ i("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ t(
+            "div",
+            {
+              className: `w-2 h-2 ${fe[r]}`,
+              style: { clipPath: "polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%)" }
+            }
+          ),
+          /* @__PURE__ */ t("span", { className: "font-mono text-[10px] tracking-[0.1em] text-muted-foreground", children: me[r] })
+        ] })
+      ] }),
+      /* @__PURE__ */ t("div", { className: "absolute top-0 left-0 w-6 h-6 border-t-2 border-l-2 border-primary/40 pointer-events-none" }),
+      /* @__PURE__ */ t("div", { className: "absolute top-0 right-0 w-6 h-6 border-t-2 border-r-2 border-primary/40 pointer-events-none" }),
+      /* @__PURE__ */ t("div", { className: "absolute bottom-0 left-0 w-6 h-6 border-b-2 border-l-2 border-primary/40 pointer-events-none" }),
+      /* @__PURE__ */ t("div", { className: "absolute bottom-0 right-0 w-6 h-6 border-b-2 border-r-2 border-primary/40 pointer-events-none" }),
+      /* @__PURE__ */ t("div", { className: "p-5", children: o })
+    ]
+  }
+));
+ue.displayName = "TacticalPanel";
+const ge = n.forwardRef(
+  ({ title: e, subtitle: r, icon: o, value: a, className: s }, c) => {
+    const [l, g] = n.useState(!1);
+    return /* @__PURE__ */ i(
+      "div",
+      {
+        ref: c,
+        className: `relative clip-corner border border-border bg-surface-1 p-6 overflow-hidden group cursor-pointer transition-all duration-500 hover:border-primary/30${s ? ` ${s}` : ""}`,
+        onMouseEnter: () => g(!0),
+        onMouseLeave: () => g(!1),
+        children: [
+          /* @__PURE__ */ t(
+            "div",
+            {
+              className: "absolute left-0 right-0 h-px bg-gradient-to-r from-transparent via-primary/60 to-transparent pointer-events-none transition-all",
+              style: {
+                top: l ? "100%" : "-10%",
+                opacity: l ? 1 : 0,
+                transitionDuration: "2000ms"
+              }
+            }
+          ),
+          /* @__PURE__ */ t(
+            "div",
+            {
+              className: "absolute inset-0 pointer-events-none transition-opacity duration-500",
+              style: {
+                background: "linear-gradient(135deg, transparent 0%, hsl(var(--primary) / 0.03) 40%, transparent 60%)",
+                opacity: l ? 1 : 0
+              }
+            }
+          ),
+          /* @__PURE__ */ i("div", { className: "relative z-10", children: [
+            /* @__PURE__ */ t(o, { className: "w-5 h-5 text-primary mb-4 group-hover:drop-shadow-[0_0_8px_hsl(var(--primary)/0.5)] transition-all" }),
+            a && /* @__PURE__ */ t("p", { className: "font-display text-3xl font-bold text-primary mb-1", children: a }),
+            /* @__PURE__ */ t("h4", { className: "font-display text-sm font-bold tracking-[0.05em] uppercase text-foreground mb-1", children: e }),
+            /* @__PURE__ */ t("p", { className: "text-sm text-muted-foreground", children: r })
+          ] }),
+          /* @__PURE__ */ t("div", { className: "absolute bottom-3 right-3 text-primary/20 group-hover:text-primary/60 transition-colors text-xs", children: "◆" })
+        ]
+      }
+    );
+  }
+);
+ge.displayName = "HoloCard";
+const be = [
+  "[SYS] Initializing ENDFIELD protocol...",
+  "[NET] Connection established — latency: 12ms",
+  "[SEC] Authentication verified ◆ Level: ALPHA",
+  "[DAT] Loading design tokens: 94 variables mapped",
+  "[GPU] Render pipeline: Optimized (60fps locked)",
+  "[SYS] Component registry: 70 modules online",
+  "[NET] Sync complete — all nodes operational",
+  "[DAT] Color system: HSL-based, 9 neutrals, 9 accents",
+  "[SEC] Encryption: AES-256 ◆ Status: ACTIVE",
+  "[SYS] ENDFIELD DESIGN SYSTEM v2.0 ◆ READY"
+], xe = n.forwardRef(
+  ({ messages: e = be, className: r }, o) => {
+    const [a, s] = n.useState([]), c = n.useRef(null);
+    return n.useEffect(() => {
+      let l = 0;
+      const g = setInterval(() => {
+        s((b) => {
+          const u = [...b, e[l % e.length]];
+          return u.length > 8 ? u.slice(-8) : u;
+        }), l++;
+      }, 1200);
+      return () => clearInterval(g);
+    }, [e]), n.useEffect(() => {
+      c.current && (c.current.scrollTop = c.current.scrollHeight);
+    }, [a]), /* @__PURE__ */ i(
+      "div",
+      {
+        ref: o,
+        className: `border border-border bg-background clip-corner overflow-hidden${r ? ` ${r}` : ""}`,
+        children: [
+          /* @__PURE__ */ i("div", { className: "flex items-center gap-2 px-4 py-2 border-b border-border bg-surface-0", children: [
+            /* @__PURE__ */ t(X, { className: "w-3.5 h-3.5 text-primary" }),
+            /* @__PURE__ */ t("span", { className: "font-mono text-[10px] tracking-[0.1em] text-muted-foreground uppercase", children: "LIVE FEED" }),
+            /* @__PURE__ */ i("div", { className: "ml-auto flex items-center gap-1.5", children: [
+              /* @__PURE__ */ t(
+                "div",
+                {
+                  className: "w-1.5 h-1.5 bg-ef-green animate-pulse",
+                  style: { clipPath: "polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%)" }
+                }
+              ),
+              /* @__PURE__ */ t("span", { className: "font-mono text-[10px] text-ef-green", children: "ACTIVE" })
+            ] })
+          ] }),
+          /* @__PURE__ */ i(
+            "div",
+            {
+              ref: c,
+              className: "p-4 h-48 overflow-y-auto font-mono text-xs space-y-1",
+              children: [
+                /* @__PURE__ */ t(Z, { children: a.map((l, g) => /* @__PURE__ */ t(
+                  I.div,
+                  {
+                    initial: { opacity: 0, x: -10 },
+                    animate: { opacity: 1, x: 0 },
+                    className: l.includes("[SEC]") ? "text-ef-green" : l.includes("[NET]") ? "text-ef-blue" : l.includes("[DAT]") ? "text-ef-cyan" : l.includes("[GPU]") ? "text-ef-purple" : "text-muted-foreground",
+                    children: l
+                  },
+                  `${l}-${g}`
+                )) }),
+                /* @__PURE__ */ t("span", { className: "inline-block w-2 h-4 bg-primary animate-cursor-blink" })
+              ]
+            }
+          )
+        ]
+      }
+    );
+  }
+);
+xe.displayName = "DataStream";
+const he = P(
+  "inline-flex items-center gap-1.5 clip-corner-sm border px-3 py-1 font-display text-[10px] font-bold tracking-[0.15em] uppercase",
+  {
+    variants: {
+      variant: {
+        default: "border-primary/40 text-primary bg-primary/10",
+        success: "border-ef-green/40 text-ef-green bg-ef-green/10",
+        warning: "border-ef-yellow/40 text-ef-yellow bg-ef-yellow/10",
+        danger: "border-ef-red/40 text-ef-red bg-ef-red/10",
+        info: "border-ef-cyan/40 text-ef-cyan bg-ef-cyan/10"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+), ve = n.forwardRef(({ variant: e, className: r, children: o, ...a }, s) => /* @__PURE__ */ i(
+  "span",
+  {
+    ref: s,
+    className: x(he({ variant: e }), r),
+    ...a,
+    children: [
+      /* @__PURE__ */ t("span", { style: { fontSize: "6px" }, children: "◆" }),
+      o
+    ]
+  }
+));
+ve.displayName = "TacticalBadge";
+const ye = {
+  caution: {
+    border: "border-ef-yellow/30",
+    bg: "bg-ef-yellow/5",
+    icon: "text-ef-yellow",
+    label: "CAUTION"
+  },
+  alert: {
+    border: "border-ef-orange/30",
+    bg: "bg-ef-orange/5",
+    icon: "text-ef-orange",
+    label: "ALERT"
+  },
+  critical: {
+    border: "border-ef-red/30",
+    bg: "bg-ef-red/5",
+    icon: "text-ef-red",
+    label: "CRITICAL"
+  }
+}, Ne = n.forwardRef(({ level: e = "caution", children: r, className: o }, a) => {
+  const s = ye[e];
+  return /* @__PURE__ */ i(
+    "div",
+    {
+      ref: a,
+      className: `clip-corner border ${s.border} ${s.bg} p-4 flex items-start gap-3${o ? ` ${o}` : ""}`,
+      children: [
+        /* @__PURE__ */ t(K, { className: `w-5 h-5 ${s.icon} shrink-0 mt-0.5` }),
+        /* @__PURE__ */ i("div", { children: [
+          /* @__PURE__ */ t(
+            "span",
+            {
+              className: `font-display text-[11px] font-bold tracking-[0.15em] ${s.icon}`,
+              children: s.label
+            }
+          ),
+          /* @__PURE__ */ t("p", { className: "text-sm text-muted-foreground mt-1", children: r })
+        ] })
+      ]
+    }
+  );
+});
+Ne.displayName = "WarningBanner";
+const Te = n.forwardRef(
+  ({ label: e, className: r }, o) => /* @__PURE__ */ i(
+    "div",
+    {
+      ref: o,
+      className: `relative flex items-center gap-4 py-2${r ? ` ${r}` : ""}`,
+      children: [
+        /* @__PURE__ */ t("div", { className: "flex-1 h-px bg-gradient-to-r from-transparent via-primary/30 to-transparent" }),
+        e && /* @__PURE__ */ i("span", { className: "font-display text-[10px] font-bold tracking-[0.2em] uppercase text-primary/60 flex items-center gap-2", children: [
+          /* @__PURE__ */ t("span", { style: { fontSize: "6px" }, children: "◆" }),
+          " ",
+          e,
+          " ",
+          /* @__PURE__ */ t("span", { style: { fontSize: "6px" }, children: "◆" })
+        ] }),
+        /* @__PURE__ */ t("div", { className: "flex-1 h-px bg-gradient-to-r from-transparent via-primary/30 to-transparent" })
+      ]
+    }
+  )
+);
+Te.displayName = "ScanDivider";
+const we = n.forwardRef(({ label: e, value: r, unit: o, className: a }, s) => /* @__PURE__ */ i(
+  "div",
+  {
+    ref: s,
+    className: `inline-flex items-center border border-border bg-surface-0 overflow-hidden${a ? ` ${a}` : ""}`,
+    children: [
+      /* @__PURE__ */ t("span", { className: "font-mono text-[10px] tracking-[0.1em] uppercase text-muted-foreground bg-surface-2 px-2.5 py-1.5 border-r border-border", children: e }),
+      /* @__PURE__ */ t("span", { className: "font-mono text-xs text-primary px-2.5 py-1.5 font-bold", children: r }),
+      o && /* @__PURE__ */ t("span", { className: "font-mono text-[10px] text-muted-foreground pr-2.5", children: o })
+    ]
+  }
+));
+we.displayName = "CoordinateTag";
+const Se = n.forwardRef(
+  ({ data: e, size: r = 260, color: o = "primary", className: a }, s) => {
+    const c = n.useRef(null), l = q(c, { once: !0 }), g = n.useCallback(
+      (d) => {
+        c.current = d, typeof s == "function" ? s(d) : s && (s.current = d);
+      },
+      [s]
+    ), b = r / 2, u = r / 2, f = r * 0.38, v = 4, j = e.length, R = Math.PI * 2 / j, y = o === "cyan" ? "--ef-cyan" : "--primary", w = (d, p) => ({
+      x: b + p * Math.sin(d * R),
+      y: u - p * Math.cos(d * R)
+    }), G = Array.from({ length: v }, (d, p) => {
+      const h = f * ((p + 1) / v);
+      return e.map((A, F) => w(F, h)).map((A) => `${A.x},${A.y}`).join(" ");
+    }), k = e.map((d, p) => w(p, d.value / 100 * f)), C = k.map((d) => `${d.x},${d.y}`).join(" "), L = e.map(() => `${b},${u}`).join(" ");
+    return /* @__PURE__ */ t(
+      "div",
+      {
+        ref: g,
+        className: `flex flex-col items-center w-full${a ? ` ${a}` : ""}`,
+        children: /* @__PURE__ */ i(
+          "svg",
+          {
+            viewBox: `0 0 ${r} ${r}`,
+            className: "w-full max-w-[260px] h-auto overflow-visible",
+            children: [
+              G.map((d, p) => /* @__PURE__ */ t(
+                "polygon",
+                {
+                  points: d,
+                  fill: "none",
+                  stroke: "hsl(var(--border))",
+                  strokeWidth: 1,
+                  opacity: 0.5
+                },
+                p
+              )),
+              e.map((d, p) => {
+                const h = w(p, f);
+                return /* @__PURE__ */ t(
+                  "line",
+                  {
+                    x1: b,
+                    y1: u,
+                    x2: h.x,
+                    y2: h.y,
+                    stroke: "hsl(var(--border))",
+                    strokeWidth: 1,
+                    opacity: 0.3
+                  },
+                  p
+                );
+              }),
+              /* @__PURE__ */ t(
+                I.polygon,
+                {
+                  points: l ? C : L,
+                  fill: `hsl(var(${y}) / 0.15)`,
+                  stroke: `hsl(var(${y}))`,
+                  strokeWidth: 2,
+                  initial: !1,
+                  animate: { points: l ? C : L },
+                  transition: { duration: 0.8, ease: [0.25, 0.8, 0.25, 1] },
+                  style: {
+                    filter: `drop-shadow(0 0 8px hsl(var(${y}) / 0.3))`
+                  }
+                }
+              ),
+              k.map((d, p) => /* @__PURE__ */ t(
+                I.circle,
+                {
+                  cx: b,
+                  cy: u,
+                  r: 4,
+                  fill: `hsl(var(${y}))`,
+                  stroke: "hsl(var(--background))",
+                  strokeWidth: 2,
+                  initial: !1,
+                  animate: { cx: l ? d.x : b, cy: l ? d.y : u },
+                  transition: { duration: 0.8, delay: p * 0.05 },
+                  style: {
+                    filter: `drop-shadow(0 0 4px hsl(var(${y}) / 0.5))`
+                  }
+                },
+                p
+              )),
+              e.map((d, p) => {
+                const h = w(p, f + 20);
+                return /* @__PURE__ */ t(
+                  "text",
+                  {
+                    x: h.x,
+                    y: h.y,
+                    textAnchor: "middle",
+                    dominantBaseline: "middle",
+                    className: "font-display text-[9px] font-bold tracking-[0.1em] uppercase",
+                    fill: "hsl(var(--muted-foreground))",
+                    children: d.label
+                  },
+                  p
+                );
+              })
+            ]
+          }
+        )
+      }
+    );
+  }
+);
+Se.displayName = "RadarChart";
+const Ee = n.forwardRef(
+  ({
+    children: e,
+    systemLabel: r = "SYS::ENDFIELD v2.0",
+    lat: o = "LAT 37.7749°N",
+    lon: a = "LON 122.4194°W",
+    showCoords: s = !0,
+    showCrosshair: c = !0,
+    className: l
+  }, g) => {
+    const [b, u] = n.useState("");
+    return n.useEffect(() => {
+      const f = () => u((/* @__PURE__ */ new Date()).toLocaleTimeString("en-GB"));
+      f();
+      const v = setInterval(f, 1e3);
+      return () => clearInterval(v);
+    }, []), /* @__PURE__ */ i(
+      "div",
+      {
+        ref: g,
+        className: `relative border border-border bg-surface-0 aspect-video flex items-center justify-center overflow-hidden${l ? ` ${l}` : ""}`,
+        children: [
+          /* @__PURE__ */ t("div", { className: "absolute inset-0 scanline-overlay" }),
+          [
+            "top-3 left-3 border-t-2 border-l-2",
+            "top-3 right-3 border-t-2 border-r-2",
+            "bottom-3 left-3 border-b-2 border-l-2",
+            "bottom-3 right-3 border-b-2 border-r-2"
+          ].map((f, v) => /* @__PURE__ */ t(
+            "div",
+            {
+              className: `absolute w-8 h-8 ${f} border-primary/40 pointer-events-none`
+            },
+            v
+          )),
+          c && /* @__PURE__ */ i("div", { className: "absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 pointer-events-none", children: [
+            /* @__PURE__ */ t(
+              "div",
+              {
+                className: "w-6 h-px bg-primary/20",
+                style: { position: "absolute", top: "50%", left: "-12px" }
+              }
+            ),
+            /* @__PURE__ */ t(
+              "div",
+              {
+                className: "h-6 w-px bg-primary/20",
+                style: { position: "absolute", left: "50%", top: "-12px" }
+              }
+            )
+          ] }),
+          s && /* @__PURE__ */ i("div", { className: "absolute top-4 left-12 font-mono text-[9px] text-muted-foreground/60 space-y-0.5", children: [
+            /* @__PURE__ */ t("div", { children: r }),
+            /* @__PURE__ */ t("div", { className: "text-primary/60", children: b })
+          ] }),
+          s && /* @__PURE__ */ i("div", { className: "absolute top-4 right-12 font-mono text-[9px] text-muted-foreground/60 text-right space-y-0.5", children: [
+            /* @__PURE__ */ t("div", { children: o }),
+            /* @__PURE__ */ t("div", { children: a })
+          ] }),
+          /* @__PURE__ */ i("div", { className: "absolute bottom-4 left-12 right-12 flex items-center justify-between", children: [
+            /* @__PURE__ */ i("div", { className: "flex items-center gap-2", children: [
+              /* @__PURE__ */ t(
+                "div",
+                {
+                  className: "w-1.5 h-1.5 bg-ef-green",
+                  style: { clipPath: "polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%)" }
+                }
+              ),
+              /* @__PURE__ */ t("span", { className: "font-mono text-[9px] text-ef-green/80", children: "LINK ACTIVE" })
+            ] }),
+            /* @__PURE__ */ t("div", { className: "flex gap-4", children: ["FPS:60", "MEM:47%", "NET:12ms"].map((f) => /* @__PURE__ */ t(
+              "span",
+              {
+                className: "font-mono text-[9px] text-muted-foreground/50",
+                children: f
+              },
+              f
+            )) })
+          ] }),
+          /* @__PURE__ */ t("div", { className: "relative z-10", children: e })
+        ]
+      }
+    );
   }
 );
+Ee.displayName = "HUDOverlay";
 export {
-  q as SonnerToaster,
-  x as Toast,
-  I as ToastAction,
-  h as ToastClose,
-  b as ToastDescription,
-  _ as ToastProvider,
-  y as ToastTitle,
-  v as ToastViewport,
-  Y as Toaster,
-  G as Tooltip,
-  E as TooltipContent,
-  F as TooltipProvider,
-  Q as TooltipTrigger,
-  n as cn,
-  K as toast,
-  k as toastAction,
-  j as useToast
+  we as CoordinateTag,
+  xe as DataStream,
+  pe as DiamondLoader,
+  de as GlitchText,
+  Ee as HUDOverlay,
+  ge as HoloCard,
+  Se as RadarChart,
+  Te as ScanDivider,
+  Me as SonnerToaster,
+  ve as TacticalBadge,
+  ue as TacticalPanel,
+  M as Toast,
+  re as ToastAction,
+  V as ToastClose,
+  U as ToastDescription,
+  ee as ToastProvider,
+  B as ToastTitle,
+  _ as ToastViewport,
+  _e as Toaster,
+  Oe as Tooltip,
+  J as TooltipContent,
+  Le as TooltipProvider,
+  Pe as TooltipTrigger,
+  Ne as WarningBanner,
+  x as cn,
+  he as tacticalBadgeVariants,
+  Ue as toast,
+  ie as toastAction,
+  le as useToast
 };
 //# sourceMappingURL=index.mjs.map