@hansenexus/hud 0.1.0

package/chunk-6jt8yg4m.js

@@ -0,0 +1,117 @@
+import {
+  LoadingSpinner,
+  PanelSection
+} from "./chunk-kyeb6qeq.js";
+import {
+  Badge,
+  Button
+} from "./chunk-xztw0xyt.js";
+
+// panels/role-switcher-panel.tsx
+import { Check, Shield, User } from "lucide-react";
+import { useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+"use client";
+function RoleSwitcherPanel({ adapter }) {
+  const { roles, currentRoleId, currentUserLabel, isLoading = false, onSwitch } = adapter;
+  const [switching, setSwitching] = useState(false);
+  const [error, setError] = useState(null);
+  async function handleSwitch(roleId) {
+    if (roleId === currentRoleId)
+      return;
+    setSwitching(true);
+    setError(null);
+    try {
+      await onSwitch(roleId);
+    } catch (err) {
+      setError(err instanceof Error ? err.message : "Role switch failed");
+    } finally {
+      setSwitching(false);
+    }
+  }
+  if (isLoading)
+    return /* @__PURE__ */ jsx(LoadingSpinner, {});
+  const current = roles.find((role) => role.id === currentRoleId);
+  return /* @__PURE__ */ jsxs("div", {
+    className: "space-y-4",
+    children: [
+      /* @__PURE__ */ jsx(PanelSection, {
+        icon: Shield,
+        title: "Current Role",
+        children: /* @__PURE__ */ jsxs("div", {
+          className: "border bg-muted/30 px-3 py-2",
+          children: [
+            /* @__PURE__ */ jsxs("div", {
+              className: "flex items-center gap-2",
+              children: [
+                /* @__PURE__ */ jsx(User, {
+                  className: "h-4 w-4 text-muted-foreground"
+                }),
+                /* @__PURE__ */ jsx("span", {
+                  className: "text-sm font-medium",
+                  children: currentUserLabel ?? "Unknown"
+                })
+              ]
+            }),
+            /* @__PURE__ */ jsx(Badge, {
+              variant: "outline",
+              className: `mt-1 ${current?.badgeClassName ?? ""}`,
+              children: current?.label ?? currentRoleId ?? "—"
+            })
+          ]
+        })
+      }),
+      /* @__PURE__ */ jsx(PanelSection, {
+        title: "Switch Role",
+        children: roles.map((role) => {
+          const isCurrent = role.id === currentRoleId;
+          return /* @__PURE__ */ jsxs(Button, {
+            variant: "ghost",
+            size: "sm",
+            disabled: isCurrent || switching,
+            className: "w-full justify-between text-xs",
+            onClick: () => handleSwitch(role.id),
+            children: [
+              /* @__PURE__ */ jsxs("div", {
+                className: "flex items-center gap-2",
+                children: [
+                  /* @__PURE__ */ jsx("span", {
+                    className: `h-2 w-2 rounded-full ${isCurrent ? "bg-primary" : "bg-muted-foreground/30"}`
+                  }),
+                  /* @__PURE__ */ jsx("span", {
+                    children: role.label
+                  })
+                ]
+              }),
+              /* @__PURE__ */ jsxs("div", {
+                className: "flex items-center gap-1.5",
+                children: [
+                  role.level !== undefined && /* @__PURE__ */ jsxs("span", {
+                    className: "text-[10px] text-muted-foreground",
+                    children: [
+                      "Lvl ",
+                      role.level
+                    ]
+                  }),
+                  isCurrent && /* @__PURE__ */ jsx(Check, {
+                    className: "h-3 w-3 text-primary"
+                  })
+                ]
+              })
+            ]
+          }, role.id);
+        })
+      }),
+      error && /* @__PURE__ */ jsx("p", {
+        className: "px-2 text-[10px] text-destructive",
+        children: error
+      }),
+      /* @__PURE__ */ jsx("p", {
+        className: "text-[10px] text-muted-foreground/60",
+        children: "Role changes take effect immediately. Use this for testing role-based access."
+      })
+    ]
+  });
+}
+
+export { RoleSwitcherPanel };

package/chunk-71se605m.js

@@ -0,0 +1,85 @@
+import {
+  LoadingSpinner
+} from "./chunk-kyeb6qeq.js";
+import {
+  Badge,
+  Switch
+} from "./chunk-xztw0xyt.js";
+
+// panels/feature-flags-panel.tsx
+import { Flag } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+"use client";
+function FeatureFlagsPanel({ adapter }) {
+  const { flags, isLoading = false, onToggle } = adapter;
+  if (isLoading)
+    return /* @__PURE__ */ jsx(LoadingSpinner, {});
+  const categories = [...new Set(flags.map((flag) => flag.category ?? "general"))];
+  return /* @__PURE__ */ jsxs("div", {
+    className: "space-y-4",
+    children: [
+      categories.map((category) => /* @__PURE__ */ jsxs("div", {
+        children: [
+          /* @__PURE__ */ jsxs("h4", {
+            className: "mb-2 flex items-center gap-1.5 text-[11px] font-semibold uppercase tracking-wider text-muted-foreground",
+            children: [
+              /* @__PURE__ */ jsx(Flag, {
+                className: "h-3 w-3"
+              }),
+              category
+            ]
+          }),
+          /* @__PURE__ */ jsx("div", {
+            className: "space-y-1",
+            children: flags.filter((flag) => (flag.category ?? "general") === category).map((flag) => /* @__PURE__ */ jsx(FlagRow, {
+              flag,
+              onToggle: () => void onToggle(flag.id)
+            }, flag.id))
+          })
+        ]
+      }, category)),
+      flags.length === 0 && /* @__PURE__ */ jsx("p", {
+        className: "px-2 text-[10px] text-muted-foreground/60",
+        children: "No flags registered."
+      })
+    ]
+  });
+}
+function FlagRow({ flag, onToggle }) {
+  const isOverridden = flag.enabled !== flag.defaultValue;
+  return /* @__PURE__ */ jsxs("div", {
+    className: "flex items-center justify-between px-2 py-1.5 hover:bg-muted/50",
+    children: [
+      /* @__PURE__ */ jsxs("div", {
+        className: "min-w-0 flex-1",
+        children: [
+          /* @__PURE__ */ jsxs("div", {
+            className: "flex items-center gap-1.5",
+            children: [
+              /* @__PURE__ */ jsx("span", {
+                className: "text-xs font-medium",
+                children: flag.label
+              }),
+              isOverridden && /* @__PURE__ */ jsx(Badge, {
+                variant: "outline",
+                className: "h-4 border-amber-500/50 px-1 text-[9px] text-amber-500",
+                children: "overridden"
+              })
+            ]
+          }),
+          flag.description && /* @__PURE__ */ jsx("p", {
+            className: "truncate text-[10px] text-muted-foreground",
+            children: flag.description
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsx(Switch, {
+        checked: flag.enabled,
+        onCheckedChange: onToggle,
+        className: "ml-2 shrink-0"
+      })
+    ]
+  });
+}
+
+export { FeatureFlagsPanel };

package/chunk-82nm9wcg.js

@@ -0,0 +1,316 @@
+import {
+  Badge,
+  Button,
+  cn
+} from "./chunk-xztw0xyt.js";
+
+// grabber/grabber-store.ts
+var state = { mode: "idle", payload: null };
+var listeners = new Set;
+function setState(next) {
+  state = next;
+  for (const listener of listeners)
+    listener();
+}
+function getGrabberState() {
+  return state;
+}
+function subscribeGrabber(listener) {
+  listeners.add(listener);
+  return () => listeners.delete(listener);
+}
+function startGrab() {
+  setState({ ...state, mode: "grabbing" });
+}
+function cancelGrab() {
+  setState({ ...state, mode: "idle" });
+}
+function completeGrab(payload) {
+  setState({ mode: "idle", payload });
+}
+function clearGrabbedPayload() {
+  setState({ ...state, payload: null });
+}
+
+// ../dev-tools/drawer/dev-drawer-provider.tsx
+import {
+  createContext,
+  useCallback,
+  useContext,
+  useEffect,
+  useMemo,
+  useState
+} from "react";
+import { jsx } from "react/jsx-runtime";
+"use client";
+var DevDrawerContext = createContext(null);
+var DEFAULTS = {
+  defaultHeight: 40,
+  minHeight: 25,
+  maxHeight: 80,
+  shortcutKey: "d"
+};
+function loadStored(storageKey) {
+  if (!storageKey || typeof window === "undefined")
+    return {};
+  try {
+    const raw = localStorage.getItem(storageKey);
+    if (!raw)
+      return {};
+    const parsed = JSON.parse(raw);
+    return {
+      height: typeof parsed.height === "number" ? parsed.height : undefined,
+      activeTab: typeof parsed.activeTab === "string" ? parsed.activeTab : undefined
+    };
+  } catch {
+    return {};
+  }
+}
+function persist(storageKey, state2) {
+  if (!storageKey || typeof window === "undefined")
+    return;
+  try {
+    localStorage.setItem(storageKey, JSON.stringify(state2));
+  } catch {}
+}
+function DevDrawerProvider({ config, children }) {
+  const defaultHeight = config?.defaultHeight ?? DEFAULTS.defaultHeight;
+  const minHeight = config?.minHeight ?? DEFAULTS.minHeight;
+  const maxHeight = config?.maxHeight ?? DEFAULTS.maxHeight;
+  const shortcutKey = config?.shortcutKey === null ? null : config?.shortcutKey ?? DEFAULTS.shortcutKey;
+  const storageKey = config?.storageKey;
+  const [isOpen, setIsOpen] = useState(false);
+  const [activeTab, setActiveTabState] = useState(config?.defaultActiveTab ?? null);
+  const [height, setHeightState] = useState(defaultHeight);
+  useEffect(() => {
+    const stored = loadStored(storageKey);
+    if (stored.height != null)
+      setHeightState(stored.height);
+    if (stored.activeTab != null)
+      setActiveTabState(stored.activeTab);
+  }, [storageKey]);
+  useEffect(() => {
+    persist(storageKey, { height, activeTab });
+  }, [storageKey, height, activeTab]);
+  useEffect(() => {
+    if (!shortcutKey)
+      return;
+    const handler = (event) => {
+      if ((event.ctrlKey || event.metaKey) && event.shiftKey && event.key.toLowerCase() === shortcutKey) {
+        event.preventDefault();
+        setIsOpen((prev) => !prev);
+      }
+    };
+    window.addEventListener("keydown", handler);
+    return () => window.removeEventListener("keydown", handler);
+  }, [shortcutKey]);
+  const toggleDrawer = useCallback(() => setIsOpen((prev) => !prev), []);
+  const openDrawer = useCallback(() => setIsOpen(true), []);
+  const closeDrawer = useCallback(() => setIsOpen(false), []);
+  const setActiveTab = useCallback((tab) => setActiveTabState(tab), []);
+  const setHeight = useCallback((next) => setHeightState(Math.min(maxHeight, Math.max(minHeight, next))), [minHeight, maxHeight]);
+  const value = useMemo(() => ({
+    isOpen,
+    activeTab,
+    height,
+    minHeight,
+    maxHeight,
+    toggleDrawer,
+    openDrawer,
+    closeDrawer,
+    setActiveTab,
+    setHeight
+  }), [
+    isOpen,
+    activeTab,
+    height,
+    minHeight,
+    maxHeight,
+    toggleDrawer,
+    openDrawer,
+    closeDrawer,
+    setActiveTab,
+    setHeight
+  ]);
+  return /* @__PURE__ */ jsx(DevDrawerContext.Provider, {
+    value,
+    children
+  });
+}
+function useDevDrawer() {
+  const ctx = useContext(DevDrawerContext);
+  if (!ctx)
+    throw new Error("useDevDrawer must be used within a DevDrawerProvider");
+  return ctx;
+}
+
+// ../dev-tools/drawer/dev-drawer.tsx
+import { Wrench, X } from "lucide-react";
+import { jsx as jsx2, jsxs } from "react/jsx-runtime";
+"use client";
+function DevDrawer({
+  tabs,
+  children,
+  title = "Dev Toolbar",
+  badgeLabel = "DEV",
+  headerIcon: HeaderIcon = Wrench,
+  className
+}) {
+  const { isOpen, activeTab, setActiveTab, closeDrawer, height, minHeight, maxHeight, setHeight } = useDevDrawer();
+  if (!isOpen)
+    return null;
+  const resolvedTabs = tabs && tabs.length > 0 ? tabs : null;
+  const currentTab = resolvedTabs?.find((tab) => tab.id === activeTab) ?? resolvedTabs?.[0];
+  const handleResizeStart = (event) => {
+    event.preventDefault();
+    const startY = event.clientY;
+    const startHeight = height;
+    function onMove(moveEvent) {
+      const delta = startY - moveEvent.clientY;
+      const deltaPercent = delta / window.innerHeight * 100;
+      setHeight(startHeight + deltaPercent);
+    }
+    function onUp() {
+      document.removeEventListener("pointermove", onMove);
+      document.removeEventListener("pointerup", onUp);
+    }
+    document.addEventListener("pointermove", onMove);
+    document.addEventListener("pointerup", onUp);
+  };
+  return /* @__PURE__ */ jsxs("div", {
+    className: cn("fixed inset-x-0 bottom-0 z-50 border-t border-border/50 bg-background/95 backdrop-blur-md", className),
+    style: { height: `${height}vh` },
+    children: [
+      /* @__PURE__ */ jsx2("div", {
+        role: "slider",
+        tabIndex: 0,
+        "aria-label": "Resize dev drawer",
+        "aria-orientation": "horizontal",
+        "aria-valuemin": Math.round(minHeight),
+        "aria-valuemax": Math.round(maxHeight),
+        "aria-valuenow": Math.round(height),
+        className: "absolute inset-x-0 -top-1 flex h-3 cursor-ns-resize items-center justify-center focus:outline-none focus-visible:ring-2 focus-visible:ring-ring",
+        onPointerDown: handleResizeStart,
+        onKeyDown: (event) => {
+          if (event.key === "ArrowUp") {
+            event.preventDefault();
+            setHeight(height + 2);
+          } else if (event.key === "ArrowDown") {
+            event.preventDefault();
+            setHeight(height - 2);
+          }
+        },
+        children: /* @__PURE__ */ jsx2("div", {
+          className: "h-1 w-8 bg-muted-foreground/30"
+        })
+      }),
+      /* @__PURE__ */ jsxs("div", {
+        className: "flex h-10 items-center justify-between border-b border-border/50 px-3",
+        children: [
+          /* @__PURE__ */ jsxs("div", {
+            className: "flex items-center gap-2",
+            children: [
+              /* @__PURE__ */ jsx2(HeaderIcon, {
+                className: "h-3.5 w-3.5 text-amber-500"
+              }),
+              /* @__PURE__ */ jsx2("span", {
+                className: "text-xs font-semibold",
+                children: title
+              }),
+              badgeLabel ? /* @__PURE__ */ jsx2(Badge, {
+                variant: "outline",
+                className: "h-4 border-amber-500/30 px-1 text-[9px] text-amber-500",
+                children: badgeLabel
+              }) : null
+            ]
+          }),
+          /* @__PURE__ */ jsxs("div", {
+            className: "flex items-center gap-1",
+            children: [
+              resolvedTabs?.map((tab) => {
+                const Icon = tab.icon;
+                const isActive = tab.id === (currentTab?.id ?? null);
+                return /* @__PURE__ */ jsxs(Button, {
+                  variant: isActive ? "secondary" : "ghost",
+                  size: "sm",
+                  className: "h-6 gap-1 px-2 text-[10px]",
+                  onClick: () => setActiveTab(tab.id),
+                  children: [
+                    Icon ? /* @__PURE__ */ jsx2(Icon, {
+                      className: "h-3 w-3"
+                    }) : null,
+                    tab.label
+                  ]
+                }, tab.id);
+              }),
+              resolvedTabs ? /* @__PURE__ */ jsx2("div", {
+                className: "mx-1 h-4 w-px bg-border"
+              }) : null,
+              /* @__PURE__ */ jsx2(Button, {
+                variant: "ghost",
+                size: "icon",
+                className: "h-6 w-6",
+                onClick: closeDrawer,
+                children: /* @__PURE__ */ jsx2(X, {
+                  className: "h-3 w-3"
+                })
+              })
+            ]
+          })
+        ]
+      }),
+      /* @__PURE__ */ jsx2("div", {
+        className: "h-[calc(100%-2.5rem)] overflow-y-auto px-3 py-3",
+        children: resolvedTabs ? currentTab?.content : children
+      })
+    ]
+  });
+}
+// ../ui/components/tooltip.tsx
+import * as TooltipPrimitive from "@radix-ui/react-tooltip";
+import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
+"use client";
+
+// ../dev-tools/fab/dev-floating-menu.tsx
+import { MoreHorizontal } from "lucide-react";
+import { AnimatePresence, motion } from "motion/react";
+
+// ../ui/components/kbd.tsx
+import { jsx as jsx4 } from "react/jsx-runtime";
+
+// ../dev-tools/fab/fab-action.tsx
+import Link from "next/link";
+import { useCallback as useCallback2, useRef } from "react";
+import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
+"use client";
+var baseClass = cn("size-9 rounded-full", "bg-background/80 backdrop-blur-sm border border-border/50", "shadow-sm hover:shadow-md transition-all duration-200");
+var bauhausBaseClass = cn("size-9 rounded-full border backdrop-blur-2xl transition-all duration-200", "border-[rgb(var(--bauhaus-border-strong))] bg-bauhaus-bg/60 text-bauhaus-fg/55", "shadow-[0_6px_24px_rgba(0,0,0,0.45)]", "hover:bg-bauhaus-bg/80 hover:text-[var(--fab-ink)] hover:border-[var(--fab-ink)]");
+
+// ../dev-tools/fab/use-fab-state.ts
+import { useCallback as useCallback3, useEffect as useEffect2, useState as useState2 } from "react";
+"use client";
+
+// ../dev-tools/fab/dev-floating-menu.tsx
+import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
+"use client";
+// ../dev-tools/fab/dock-context.tsx
+import {
+  createContext as createContext2,
+  useCallback as useCallback4,
+  useContext as useContext2,
+  useEffect as useEffect3,
+  useMemo as useMemo2,
+  useState as useState3
+} from "react";
+import { jsx as jsx7, jsxs as jsxs5 } from "react/jsx-runtime";
+"use client";
+var FloatingDockContext = createContext2(null);
+// ../dev-tools/gate/dev-only.tsx
+import { jsx as jsx8, Fragment } from "react/jsx-runtime";
+"use client";
+// ../dev-tools/panels/variants-link-panel.tsx
+import { ArrowUpRight, Beaker } from "lucide-react";
+import Link2 from "next/link";
+import { jsx as jsx9, jsxs as jsxs6 } from "react/jsx-runtime";
+"use client";
+export { getGrabberState, subscribeGrabber, startGrab, cancelGrab, completeGrab, clearGrabbedPayload, DevDrawerProvider, useDevDrawer, DevDrawer };

package/chunk-8tam7r3h.js

@@ -0,0 +1,68 @@
+import {
+  InfoRow,
+  LoadingSpinner,
+  PanelSection
+} from "./chunk-kyeb6qeq.js";
+
+// panels/debug-info-panel.tsx
+import { Info, Monitor } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+"use client";
+function DebugInfoPanel({ user, isLoading = false }) {
+  if (isLoading)
+    return /* @__PURE__ */ jsx(LoadingSpinner, {});
+  return /* @__PURE__ */ jsxs("div", {
+    className: "space-y-4",
+    children: [
+      user && /* @__PURE__ */ jsxs(PanelSection, {
+        icon: Info,
+        title: "User",
+        children: [
+          /* @__PURE__ */ jsx(InfoRow, {
+            label: "Name",
+            value: user.name ?? "—"
+          }),
+          /* @__PURE__ */ jsx(InfoRow, {
+            label: "Email",
+            value: user.email ?? "—",
+            copyable: !!user.email
+          }),
+          /* @__PURE__ */ jsx(InfoRow, {
+            label: "ID",
+            value: user.id ?? "—",
+            copyable: !!user.id
+          }),
+          /* @__PURE__ */ jsx(InfoRow, {
+            label: "Role",
+            value: user.role ?? "—"
+          }),
+          Object.entries(user.extra ?? {}).map(([label, value]) => /* @__PURE__ */ jsx(InfoRow, {
+            label,
+            value
+          }, label))
+        ]
+      }),
+      /* @__PURE__ */ jsxs(PanelSection, {
+        icon: Monitor,
+        title: "Environment",
+        children: [
+          /* @__PURE__ */ jsx(InfoRow, {
+            label: "NODE_ENV",
+            value: "production"
+          }),
+          /* @__PURE__ */ jsx(InfoRow, {
+            label: "Convex URL",
+            value: process.env.NEXT_PUBLIC_CONVEX_URL ?? "not set",
+            copyable: true
+          }),
+          /* @__PURE__ */ jsx(InfoRow, {
+            label: "Origin",
+            value: typeof window !== "undefined" ? window.location.origin : "—"
+          })
+        ]
+      })
+    ]
+  });
+}
+
+export { DebugInfoPanel };

package/chunk-babjpqkb.js

@@ -0,0 +1,52 @@
+import {
+  HUD_CAPABILITIES
+} from "./chunk-v086j53b.js";
+
+// core/capabilities.ts
+var CAPABILITY_MATRIX = {
+  development: HUD_CAPABILITIES,
+  staging: [
+    "observe.app",
+    "observe.estate",
+    "cicd.read",
+    "mock.toggle",
+    "auth.impersonate",
+    "variants.switch",
+    "variants.vote"
+  ],
+  preview: [
+    "observe.app",
+    "observe.estate",
+    "cicd.read",
+    "mock.toggle",
+    "variants.switch",
+    "variants.vote"
+  ],
+  production: ["observe.app", "observe.estate", "cicd.read"],
+  disabled: []
+};
+function resolveHudEnv() {
+  if (process.env.NEXT_PUBLIC_HUD_DISABLED === "true")
+    return "disabled";
+  if (false)
+    ;
+  const explicit = process.env.NEXT_PUBLIC_HUD_ENV;
+  if (explicit === "staging" || explicit === "preview" || explicit === "production") {
+    return explicit;
+  }
+  if (process.env.VERCEL_ENV === "preview")
+    return "preview";
+  return "production";
+}
+function isHudVisible(env = resolveHudEnv()) {
+  if (env === "disabled")
+    return false;
+  if (env === "development")
+    return true;
+  return process.env.NEXT_PUBLIC_HUD_ENABLED === "true";
+}
+function hasCapability(env, capability) {
+  return CAPABILITY_MATRIX[env].includes(capability);
+}
+
+export { CAPABILITY_MATRIX, resolveHudEnv, isHudVisible, hasCapability };