@ima-jin/ui 1.0.0

package/dist/index.mjs

@@ -0,0 +1,1891 @@
+// src/nav-bar.tsx
+import React6, { useState as useState5, useEffect as useEffect6, useRef as useRef4 } from "react";
+
+// src/app-launcher.tsx
+import React2, { useState as useState2, useEffect as useEffect2, useRef } from "react";
+
+// src/use-identities.ts
+import { useState, useEffect } from "react";
+
+// src/acting-as.ts
+function getActingAs() {
+  if (typeof window === "undefined") return null;
+  return localStorage.getItem("imajin:acting-as");
+}
+function setActingAs(did) {
+  if (typeof window === "undefined") return;
+  if (did) {
+    localStorage.setItem("imajin:acting-as", did);
+    document.cookie = `x-acting-as=${did}; path=/; max-age=31536000; SameSite=Lax`;
+  } else {
+    localStorage.removeItem("imajin:acting-as");
+    document.cookie = "x-acting-as=; path=/; max-age=0";
+  }
+  window.dispatchEvent(new CustomEvent("imajin:acting-as-changed", { detail: { did } }));
+}
+function getActingAsHeaders() {
+  const did = getActingAs();
+  return did ? { "X-Acting-As": did } : {};
+}
+
+// src/use-identities.ts
+function useIdentities(authUrl, profileUrl) {
+  const [identities, setIdentities] = useState([]);
+  const [loading, setLoading] = useState(false);
+  const [activeIdentity, setActiveIdentityState] = useState(null);
+  const [activeConfig, setActiveConfig] = useState(null);
+  useEffect(() => {
+    setActiveIdentityState(getActingAs());
+  }, []);
+  useEffect(() => {
+    if (!authUrl) return;
+    setLoading(true);
+    fetch(`${authUrl}/api/groups`, { credentials: "include" }).then((r) => r.ok ? r.json() : null).then((data) => {
+      if (Array.isArray(data)) setIdentities(data);
+      else if (data == null ? void 0 : data.groups) setIdentities(data.groups);
+    }).catch(() => {
+    }).finally(() => setLoading(false));
+  }, [authUrl]);
+  useEffect(() => {
+    const configBase = profileUrl;
+    if (!configBase || !activeIdentity) {
+      setActiveConfig(null);
+      return;
+    }
+    fetch(`${configBase}/api/forest/${encodeURIComponent(activeIdentity)}/config/public`).then((r) => r.ok ? r.json() : null).then((data) => {
+      if (data) setActiveConfig(data);
+    }).catch(() => {
+    });
+  }, [authUrl, profileUrl, activeIdentity]);
+  function setActiveIdentity(did) {
+    setActingAs(did);
+    setActiveIdentityState(did);
+    window.location.reload();
+  }
+  return { identities, loading, activeIdentity, activeConfig, setActiveIdentity };
+}
+
+// src/app-launcher.tsx
+function filterByTier(services, tier) {
+  const hasProfile = tier === "hard" || tier === "creator";
+  return services.filter((s) => {
+    if (s.visibility === "internal") return false;
+    if (s.visibility === "public") return true;
+    if (s.visibility === "authenticated") return hasProfile;
+    if (s.visibility === "creator") return hasProfile;
+    return false;
+  });
+}
+function groupByCategory(services) {
+  return {
+    kernel: services.filter((s) => s.category === "kernel"),
+    core: services.filter((s) => s.category === "core"),
+    creator: services.filter((s) => s.category === "creator"),
+    developer: services.filter((s) => s.category === "developer"),
+    meta: services.filter((s) => s.category === "meta")
+  };
+}
+function scopeIcon(scope) {
+  if (scope === "community") return "\u{1F3DB}\uFE0F";
+  if (scope === "org") return "\u{1F3E2}";
+  if (scope === "family") return "\u{1F468}\u200D\u{1F469}\u200D\u{1F466}";
+  if (scope === "node") return "\u{1F5A5}\uFE0F";
+  if (scope === "agent") return "\u{1F916}";
+  if (scope === "device") return "\u{1F4F1}";
+  return "\u{1F464}";
+}
+function AppLauncher({ registryUrl, currentService, tier = "anonymous", inline = false, variant = "list", authUrl, enabledServices }) {
+  var _a, _b;
+  const [services, setServices] = useState2([]);
+  const [showPanel, setShowPanel] = useState2(false);
+  const panelRef = useRef(null);
+  const showIdentities = tier === "hard" || tier === "creator";
+  const { identities, activeIdentity, setActiveIdentity } = useIdentities(showIdentities && authUrl ? authUrl : null, null);
+  useEffect2(() => {
+    fetch(`${registryUrl}/api/specs`).then((r) => r.ok ? r.json() : null).then((data) => {
+      if (data == null ? void 0 : data.services) setServices(data.services);
+    }).catch(() => {
+    });
+  }, [registryUrl]);
+  useEffect2(() => {
+    if (!showPanel) return;
+    function handleClickOutside(event) {
+      if (panelRef.current && !panelRef.current.contains(event.target)) {
+        setShowPanel(false);
+      }
+    }
+    document.addEventListener("mousedown", handleClickOutside);
+    return () => document.removeEventListener("mousedown", handleClickOutside);
+  }, [showPanel]);
+  let visible = filterByTier(services, tier);
+  if (enabledServices && enabledServices.length > 0) {
+    visible = visible.filter((s) => enabledServices.includes(s.name));
+  }
+  const { kernel, core, creator, developer, meta } = groupByCategory(visible);
+  const wwwUrl = ((_a = services.find((s) => s.name === "kernel")) == null ? void 0 : _a.url) || ((_b = services.find((s) => s.name === "www")) == null ? void 0 : _b.url) || "#";
+  function renderTile(service) {
+    const isCurrent = service.name === currentService;
+    const isExternal = !!service.externalUrl;
+    return /* @__PURE__ */ React2.createElement(
+      "a",
+      {
+        key: service.name,
+        href: service.url,
+        ...isExternal && { target: "_blank", rel: "noopener noreferrer" },
+        className: `flex items-center gap-3 px-3 py-2.5 rounded-lg text-sm transition no-underline ${isCurrent ? "bg-orange-100 dark:bg-orange-900/30 text-orange-600 dark:text-orange-400 font-medium" : "text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-800"}`
+      },
+      /* @__PURE__ */ React2.createElement("span", { className: "text-lg flex-shrink-0" }, service.icon),
+      /* @__PURE__ */ React2.createElement("span", null, service.label)
+    );
+  }
+  function renderGridTile(service) {
+    const isCurrent = service.name === currentService;
+    return /* @__PURE__ */ React2.createElement(
+      "a",
+      {
+        key: service.name,
+        href: service.url,
+        className: `flex flex-col items-center justify-center w-16 h-16 rounded-lg text-center transition no-underline ${isCurrent ? "bg-orange-100 dark:bg-orange-900/30 text-orange-600 dark:text-orange-400" : "text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-800"}`
+      },
+      /* @__PURE__ */ React2.createElement("span", { className: "text-2xl" }, service.icon),
+      /* @__PURE__ */ React2.createElement("span", { className: "text-[10px] mt-0.5 leading-tight" }, service.label)
+    );
+  }
+  const identitiesSection = showIdentities && (identities.length > 0 || authUrl) ? /* @__PURE__ */ React2.createElement("div", { className: "border-t border-gray-200 dark:border-gray-800 mt-1 pt-1" }, /* @__PURE__ */ React2.createElement("div", { className: "px-3 pt-1 pb-1 text-[10px] font-semibold uppercase tracking-wider text-gray-400 dark:text-gray-500" }, "Switch To"), identities.map((ident) => {
+    const isActive = ident.groupDid === activeIdentity;
+    return /* @__PURE__ */ React2.createElement(
+      "button",
+      {
+        key: ident.groupDid,
+        onClick: () => {
+          setActiveIdentity(isActive ? null : ident.groupDid);
+          setShowPanel(false);
+        },
+        className: `w-full text-left flex items-center gap-3 px-3 py-2 rounded-lg text-sm transition ${isActive ? "bg-amber-50 dark:bg-amber-900/20 text-amber-700 dark:text-amber-300 font-medium" : "text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-800"}`
+      },
+      /* @__PURE__ */ React2.createElement("span", { className: "text-lg flex-shrink-0" }, scopeIcon(ident.scope)),
+      /* @__PURE__ */ React2.createElement("span", null, ident.name || ident.handle || ident.groupDid.slice(0, 12)),
+      isActive && /* @__PURE__ */ React2.createElement("span", { className: "ml-auto text-amber-600 dark:text-amber-400 font-bold text-xs" }, "\u2713")
+    );
+  })) : null;
+  const footer = /* @__PURE__ */ React2.createElement("div", { className: "border-t border-gray-200 dark:border-gray-800 mt-1 pt-1" }, /* @__PURE__ */ React2.createElement(
+    "a",
+    {
+      href: `${wwwUrl}/`,
+      className: "flex items-center gap-2 px-3 py-2 rounded-lg text-xs text-gray-500 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-800 transition no-underline"
+    },
+    "See all apps \u2192"
+  ));
+  const content = variant === "grid" ? /* @__PURE__ */ React2.createElement(React2.Fragment, null, kernel.length > 0 && /* @__PURE__ */ React2.createElement("div", null, /* @__PURE__ */ React2.createElement("div", { className: "col-span-4 px-3 pt-1 pb-1 text-[10px] font-semibold uppercase tracking-wider text-gray-400 dark:text-gray-500" }, "Kernel Services"), /* @__PURE__ */ React2.createElement("div", { className: "grid grid-cols-4 gap-1 px-2" }, kernel.map(renderGridTile))), core.length > 0 && /* @__PURE__ */ React2.createElement("div", { className: "grid grid-cols-4 gap-1 px-2" }, core.map(renderGridTile)), creator.length > 0 && /* @__PURE__ */ React2.createElement("div", null, /* @__PURE__ */ React2.createElement("div", { className: "col-span-4 px-3 pt-2 pb-1 text-[10px] font-semibold uppercase tracking-wider text-gray-400 dark:text-gray-500" }, "Creator Tools"), /* @__PURE__ */ React2.createElement("div", { className: "grid grid-cols-4 gap-1 px-2" }, creator.map(renderGridTile))), developer.length > 0 && /* @__PURE__ */ React2.createElement("div", null, /* @__PURE__ */ React2.createElement("div", { className: "col-span-4 px-3 pt-2 pb-1 text-[10px] font-semibold uppercase tracking-wider text-gray-400 dark:text-gray-500" }, "Developers"), /* @__PURE__ */ React2.createElement("div", { className: "grid grid-cols-4 gap-1 px-2" }, developer.map(renderGridTile))), identitiesSection, footer) : /* @__PURE__ */ React2.createElement(React2.Fragment, null, kernel.length > 0 && /* @__PURE__ */ React2.createElement("div", null, /* @__PURE__ */ React2.createElement("div", { className: "px-3 pt-1 pb-1 text-[10px] font-semibold uppercase tracking-wider text-gray-400 dark:text-gray-500" }, "Kernel Services"), kernel.map(renderTile)), core.length > 0 && /* @__PURE__ */ React2.createElement("div", null, core.map(renderTile)), creator.length > 0 && /* @__PURE__ */ React2.createElement("div", null, /* @__PURE__ */ React2.createElement("div", { className: "px-3 pt-2 pb-1 text-[10px] font-semibold uppercase tracking-wider text-gray-400 dark:text-gray-500" }, "Creator Tools"), creator.map(renderTile)), developer.length > 0 && /* @__PURE__ */ React2.createElement("div", null, /* @__PURE__ */ React2.createElement("div", { className: "px-3 pt-2 pb-1 text-[10px] font-semibold uppercase tracking-wider text-gray-400 dark:text-gray-500" }, "Developers"), developer.map(renderTile)), meta.length > 0 && /* @__PURE__ */ React2.createElement("div", null, /* @__PURE__ */ React2.createElement("div", { className: "px-3 pt-2 pb-1 text-[10px] font-semibold uppercase tracking-wider text-gray-400 dark:text-gray-500" }, "Project"), meta.map(renderTile)), identitiesSection, footer);
+  if (inline) {
+    return /* @__PURE__ */ React2.createElement("div", { className: "space-y-0.5" }, content);
+  }
+  return /* @__PURE__ */ React2.createElement("div", { className: "relative", ref: panelRef }, /* @__PURE__ */ React2.createElement(
+    "button",
+    {
+      onClick: () => setShowPanel(!showPanel),
+      className: `px-3 py-1.5 rounded-lg text-sm transition flex items-center gap-1.5 ${showPanel ? "bg-orange-100 dark:bg-orange-900/30 text-orange-600 dark:text-orange-400" : "text-gray-600 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-800"}`
+    },
+    variant === "grid" ? /* @__PURE__ */ React2.createElement("span", { className: "grid grid-cols-2 gap-0.5 w-4 h-4" }, /* @__PURE__ */ React2.createElement("span", { className: "w-1.5 h-1.5 rounded-sm bg-current" }), /* @__PURE__ */ React2.createElement("span", { className: "w-1.5 h-1.5 rounded-sm bg-current" }), /* @__PURE__ */ React2.createElement("span", { className: "w-1.5 h-1.5 rounded-sm bg-current" }), /* @__PURE__ */ React2.createElement("span", { className: "w-1.5 h-1.5 rounded-sm bg-current" })) : /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement("span", null, "\u{1F680}"), /* @__PURE__ */ React2.createElement("span", { className: "hidden sm:inline" }, "Launcher"))
+  ), showPanel && /* @__PURE__ */ React2.createElement("div", { className: `absolute left-0 mt-2 ${variant === "grid" ? "w-72" : "w-56"} bg-white dark:bg-gray-900 border border-gray-200 dark:border-gray-800 rounded-xl shadow-xl py-2 z-50` }, visible.length === 0 ? /* @__PURE__ */ React2.createElement("div", { className: "px-4 py-3 text-sm text-gray-400" }, "Loading...") : content));
+}
+
+// src/notification-bell.tsx
+import React5, { useState as useState4, useEffect as useEffect5, useRef as useRef3, useCallback as useCallback3 } from "react";
+
+// src/notification-provider.tsx
+import React4, { createContext as createContext2, useContext as useContext2, useState as useState3, useEffect as useEffect4, useRef as useRef2, useCallback as useCallback2 } from "react";
+
+// src/toast.tsx
+import React3, { createContext, useContext, useReducer, useCallback, useEffect as useEffect3 } from "react";
+function reducer(state, action) {
+  switch (action.type) {
+    case "ADD":
+      return [...state, action.toast].slice(-5);
+    case "REMOVE":
+      return state.filter((t) => t.id !== action.id);
+    default:
+      return state;
+  }
+}
+var ToastContext = createContext(null);
+var BORDER_COLORS = {
+  success: "border-l-green-500",
+  error: "border-l-red-500",
+  warning: "border-l-amber-500",
+  info: "border-l-blue-500"
+};
+var DURATIONS = {
+  success: 4e3,
+  error: 0,
+  warning: 6e3,
+  info: 4e3
+};
+function AutoDismiss({
+  id,
+  duration,
+  onDismiss
+}) {
+  useEffect3(() => {
+    const timer = setTimeout(() => onDismiss(id), duration);
+    return () => clearTimeout(timer);
+  }, [id, duration, onDismiss]);
+  return null;
+}
+function ToastItem({
+  toast,
+  onDismiss
+}) {
+  return /* @__PURE__ */ React3.createElement(
+    "div",
+    {
+      className: `flex items-start gap-3 bg-gray-900 text-white px-4 py-3 rounded-lg shadow-lg border-l-4 ${BORDER_COLORS[toast.type]} min-w-[280px] max-w-sm`,
+      style: { animation: "toastSlideIn 0.2s ease-out" }
+    },
+    /* @__PURE__ */ React3.createElement("p", { className: "flex-1 text-sm" }, toast.message),
+    /* @__PURE__ */ React3.createElement(
+      "button",
+      {
+        onClick: onDismiss,
+        className: "text-gray-400 hover:text-white transition-colors shrink-0 text-lg leading-none",
+        "aria-label": "Dismiss"
+      },
+      "\xD7"
+    )
+  );
+}
+function ToastProvider({ children }) {
+  const [toasts, dispatch] = useReducer(reducer, []);
+  const dismiss = useCallback((id) => {
+    dispatch({ type: "REMOVE", id });
+  }, []);
+  const add = useCallback((type, message) => {
+    const id = typeof crypto !== "undefined" && crypto.randomUUID ? crypto.randomUUID() : String(Date.now() + Math.random());
+    const sticky = type === "error";
+    dispatch({ type: "ADD", toast: { id, type, message, sticky } });
+  }, []);
+  const toast = {
+    success: (message) => add("success", message),
+    error: (message) => add("error", message),
+    warning: (message) => add("warning", message),
+    info: (message) => add("info", message)
+  };
+  return /* @__PURE__ */ React3.createElement(ToastContext.Provider, { value: { toast } }, children, /* @__PURE__ */ React3.createElement(
+    "div",
+    {
+      className: "fixed bottom-4 right-4 z-[9999] flex flex-col gap-2 items-end",
+      "aria-live": "polite"
+    },
+    /* @__PURE__ */ React3.createElement("style", null, `
+          @keyframes toastSlideIn {
+            from { transform: translateX(calc(100% + 1rem)); opacity: 0; }
+            to { transform: translateX(0); opacity: 1; }
+          }
+        `),
+    toasts.map((t) => /* @__PURE__ */ React3.createElement(React3.Fragment, { key: t.id }, !t.sticky && DURATIONS[t.type] > 0 && /* @__PURE__ */ React3.createElement(AutoDismiss, { id: t.id, duration: DURATIONS[t.type], onDismiss: dismiss }), /* @__PURE__ */ React3.createElement(ToastItem, { toast: t, onDismiss: () => dismiss(t.id) })))
+  ));
+}
+function useToast() {
+  const ctx = useContext(ToastContext);
+  if (!ctx) throw new Error("useToast must be used within a ToastProvider");
+  return ctx;
+}
+
+// src/notification-provider.tsx
+var NotificationContext = createContext2(null);
+var emptyValue = {
+  unreadCount: 0,
+  notifications: [],
+  markAsRead: async () => {
+  },
+  markAllAsRead: async () => {
+  },
+  refresh: async () => {
+  }
+};
+function NotificationProvider({ children }) {
+  const notifyUrl = process.env.NEXT_PUBLIC_NOTIFY_URL;
+  const [unreadCount, setUnreadCount] = useState3(0);
+  const [notifications, setNotifications] = useState3([]);
+  const hasWarnedRef = useRef2(false);
+  const lastCountRef = useRef2(-1);
+  const lastNewIdRef = useRef2(null);
+  const { toast } = useToast();
+  const toastRef = useRef2(toast);
+  toastRef.current = toast;
+  const fetchAndMaybeToast = useCallback2(async () => {
+    var _a;
+    if (!notifyUrl) return;
+    try {
+      const res = await fetch(`${notifyUrl}/api/notifications/unread`, { credentials: "include" });
+      if (!res.ok) return;
+      const data = await res.json();
+      const count = data.count ?? 0;
+      if (lastCountRef.current >= 0 && count > lastCountRef.current) {
+        try {
+          const listRes = await fetch(`${notifyUrl}/api/notifications?limit=1`, { credentials: "include" });
+          if (listRes.ok) {
+            const listData = await listRes.json();
+            const latest = ((_a = listData.notifications) == null ? void 0 : _a[0]) ?? listData[0];
+            if (latest && latest.id !== lastNewIdRef.current) {
+              lastNewIdRef.current = latest.id;
+              if (latest.urgency === "urgent") {
+                toastRef.current.warning(latest.title);
+              } else {
+                toastRef.current.info(latest.title);
+              }
+            }
+          }
+        } catch {
+        }
+      }
+      lastCountRef.current = count;
+      setUnreadCount(count);
+    } catch {
+      if (!hasWarnedRef.current) {
+        console.warn("[notifications] notify service unavailable \u2014 bell will show 0 unread");
+        hasWarnedRef.current = true;
+      }
+    }
+  }, [notifyUrl]);
+  useEffect4(() => {
+    if (!notifyUrl) return;
+    fetchAndMaybeToast();
+    const interval = setInterval(fetchAndMaybeToast, 3e4);
+    return () => clearInterval(interval);
+  }, [notifyUrl, fetchAndMaybeToast]);
+  const refresh = useCallback2(async () => {
+    if (!notifyUrl) return;
+    try {
+      const res = await fetch(`${notifyUrl}/api/notifications?limit=20`, { credentials: "include" });
+      if (!res.ok) return;
+      const data = await res.json();
+      setNotifications(data.notifications ?? data ?? []);
+    } catch {
+    }
+  }, [notifyUrl]);
+  const markAsRead = useCallback2(async (id) => {
+    if (!notifyUrl) return;
+    try {
+      await fetch(`${notifyUrl}/api/notifications/${id}/read`, {
+        method: "POST",
+        credentials: "include"
+      });
+      setNotifications((prev) => prev.map((n) => n.id === id ? { ...n, read: true } : n));
+      setUnreadCount((prev) => Math.max(0, prev - 1));
+    } catch {
+    }
+  }, [notifyUrl]);
+  const markAllAsRead = useCallback2(async () => {
+    if (!notifyUrl) return;
+    try {
+      await fetch(`${notifyUrl}/api/notifications/read-all`, {
+        method: "POST",
+        credentials: "include"
+      });
+      setNotifications((prev) => prev.map((n) => ({ ...n, read: true })));
+      setUnreadCount(0);
+      lastCountRef.current = 0;
+    } catch {
+    }
+  }, [notifyUrl]);
+  return /* @__PURE__ */ React4.createElement(NotificationContext.Provider, { value: { unreadCount, notifications, markAsRead, markAllAsRead, refresh } }, children);
+}
+function useNotifications() {
+  return useContext2(NotificationContext) ?? emptyValue;
+}
+
+// src/notification-bell.tsx
+function relativeTime(dateStr) {
+  const diff = Date.now() - new Date(dateStr).getTime();
+  const minutes = Math.floor(diff / 6e4);
+  if (minutes < 1) return "just now";
+  if (minutes < 60) return `${minutes}m ago`;
+  const hours = Math.floor(minutes / 60);
+  if (hours < 24) return `${hours}h ago`;
+  const days = Math.floor(hours / 24);
+  if (days === 1) return "Yesterday";
+  return `${days}d ago`;
+}
+function BellIcon({ className }) {
+  return /* @__PURE__ */ React5.createElement(
+    "svg",
+    {
+      className,
+      xmlns: "http://www.w3.org/2000/svg",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: 2,
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true"
+    },
+    /* @__PURE__ */ React5.createElement("path", { d: "M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9" }),
+    /* @__PURE__ */ React5.createElement("path", { d: "M13.73 21a2 2 0 0 1-3.46 0" })
+  );
+}
+function NotificationBell() {
+  const { unreadCount, notifications, markAsRead, markAllAsRead, refresh } = useNotifications();
+  const [open, setOpen] = useState4(false);
+  const [loading, setLoading] = useState4(false);
+  const panelRef = useRef3(null);
+  const handleOpen = useCallback3(async () => {
+    if (!open) {
+      setOpen(true);
+      setLoading(true);
+      await refresh();
+      setLoading(false);
+    } else {
+      setOpen(false);
+    }
+  }, [open, refresh]);
+  useEffect5(() => {
+    if (!open) return;
+    function handleClickOutside(e) {
+      if (panelRef.current && !panelRef.current.contains(e.target)) {
+        setOpen(false);
+      }
+    }
+    function handleKeyDown(e) {
+      if (e.key === "Escape") setOpen(false);
+    }
+    document.addEventListener("mousedown", handleClickOutside);
+    document.addEventListener("keydown", handleKeyDown);
+    return () => {
+      document.removeEventListener("mousedown", handleClickOutside);
+      document.removeEventListener("keydown", handleKeyDown);
+    };
+  }, [open]);
+  const hasUnread = notifications.some((n) => !n.read);
+  return /* @__PURE__ */ React5.createElement("div", { className: "relative", ref: panelRef }, /* @__PURE__ */ React5.createElement(
+    "button",
+    {
+      onClick: handleOpen,
+      className: `relative p-2 rounded-lg transition ${open ? "bg-gray-100 dark:bg-gray-800" : "hover:bg-gray-100 dark:hover:bg-gray-800"}`,
+      title: "Notifications",
+      "aria-label": `Notifications${unreadCount > 0 ? `, ${unreadCount} unread` : ""}`,
+      "aria-expanded": open
+    },
+    /* @__PURE__ */ React5.createElement(BellIcon, { className: "w-5 h-5 text-gray-600 dark:text-gray-300" }),
+    unreadCount > 0 && /* @__PURE__ */ React5.createElement("span", { className: "absolute -top-0.5 -right-0.5 bg-red-500 text-white text-[10px] font-bold rounded-full min-w-[1.1rem] h-[1.1rem] flex items-center justify-center px-1 leading-none pointer-events-none" }, unreadCount > 99 ? "99+" : unreadCount)
+  ), open && /* @__PURE__ */ React5.createElement("div", { className: "absolute right-0 mt-2 w-80 bg-gray-900 border border-gray-700 rounded-lg shadow-lg z-50 flex flex-col max-h-[24rem]" }, /* @__PURE__ */ React5.createElement("div", { className: "flex items-center justify-between px-4 py-3 border-b border-gray-700 shrink-0" }, /* @__PURE__ */ React5.createElement("span", { className: "text-sm font-semibold text-white" }, "Notifications"), hasUnread && /* @__PURE__ */ React5.createElement(
+    "button",
+    {
+      onClick: () => markAllAsRead(),
+      className: "text-xs text-blue-400 hover:text-blue-300 transition"
+    },
+    "Mark all as read"
+  )), /* @__PURE__ */ React5.createElement("div", { className: "overflow-y-auto flex-1" }, loading ? /* @__PURE__ */ React5.createElement("div", { className: "px-4 py-6 text-center text-sm text-gray-400" }, "Loading\u2026") : notifications.length === 0 ? /* @__PURE__ */ React5.createElement("div", { className: "px-4 py-6 text-center text-sm text-gray-400" }, "No notifications yet") : notifications.map((notification) => /* @__PURE__ */ React5.createElement(
+    "button",
+    {
+      key: notification.id,
+      onClick: () => markAsRead(notification.id),
+      className: `w-full text-left px-4 py-3 border-b border-gray-800 last:border-0 hover:bg-gray-800 transition flex items-start gap-3 ${!notification.read ? "bg-gray-800/50" : ""}`
+    },
+    /* @__PURE__ */ React5.createElement("span", { className: "shrink-0 w-2 h-2 rounded-full mt-1.5 flex items-center justify-center" }, !notification.read && /* @__PURE__ */ React5.createElement("span", { className: "block w-2 h-2 rounded-full bg-blue-500", "aria-hidden": "true" })),
+    /* @__PURE__ */ React5.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ React5.createElement("p", { className: "text-sm font-medium text-white truncate" }, notification.title), notification.body && /* @__PURE__ */ React5.createElement("p", { className: "text-xs text-gray-400 mt-0.5 line-clamp-2" }, notification.body), /* @__PURE__ */ React5.createElement("p", { className: "text-xs text-gray-500 mt-1" }, relativeTime(notification.createdAt)))
+  )))));
+}
+
+// src/nav-bar.tsx
+import { getPort } from "@imajin/config";
+function buildUrl(service, prefix, domain, overrides) {
+  const url = overrides == null ? void 0 : overrides[service];
+  if (url) return url;
+  if (domain.includes("localhost") || prefix.includes("localhost")) {
+    const port = getPort(service, "dev");
+    return port ? `http://localhost:${port}` : `http://localhost:3000`;
+  }
+  const stripped = prefix.replace(/^https?:\/\//, "");
+  if (stripped.includes(".")) {
+    const base = prefix.endsWith("/") ? prefix.slice(0, -1) : prefix;
+    if (service === "www" || service === "kernel") return base;
+    return `${base}/${service}`;
+  }
+  return `${prefix}${service}.${domain}`;
+}
+function scopeIcon2(scope) {
+  if (scope === "community") return "\u{1F3DB}\uFE0F";
+  if (scope === "org") return "\u{1F3E2}";
+  if (scope === "family") return "\u{1F468}\u200D\u{1F469}\u200D\u{1F466}";
+  if (scope === "node") return "\u{1F5A5}\uFE0F";
+  if (scope === "agent") return "\u{1F916}";
+  if (scope === "device") return "\u{1F4F1}";
+  return "\u{1F464}";
+}
+function buildUserLinks(prefix, domain, overrides) {
+  return {
+    connections: buildUrl("connections", prefix, domain, overrides),
+    messages: buildUrl("chat", prefix, domain, overrides),
+    profile: buildUrl("profile", prefix, domain, overrides)
+  };
+}
+function getLauncherTier(identity) {
+  if (!(identity == null ? void 0 : identity.isLoggedIn)) return "anonymous";
+  if (identity.tier === "soft") return "soft";
+  return "hard";
+}
+function useAutoIdentity(servicePrefix, domain, overrides) {
+  const [identity, setIdentity] = useState5(null);
+  useEffect6(() => {
+    if (typeof window === "undefined") return;
+    const authUrl = buildUrl("auth", servicePrefix, domain, overrides);
+    const profileUrl = buildUrl("profile", servicePrefix, domain, overrides);
+    async function checkSession() {
+      try {
+        const res = await fetch(`${authUrl}/api/session`, {
+          credentials: "include"
+        });
+        if (res.ok) {
+          const data = await res.json();
+          setIdentity({
+            isLoggedIn: true,
+            handle: data.handle || null,
+            did: data.did || null,
+            name: data.name || null,
+            tier: data.tier || null,
+            onLogout: async () => {
+              try {
+                await fetch(`${authUrl}/api/logout`, {
+                  method: "POST",
+                  credentials: "include"
+                });
+              } catch {
+              }
+              setIdentity({
+                isLoggedIn: false,
+                onLogin: () => {
+                  window.location.href = `${authUrl}/login?next=${encodeURIComponent(window.location.href)}`;
+                },
+                onRegister: () => {
+                  window.location.href = `${authUrl}/register`;
+                }
+              });
+            },
+            onViewProfile: data.handle ? () => {
+              window.location.href = `${profileUrl}/${data.handle}`;
+            } : data.did ? () => {
+              window.location.href = `${profileUrl}/${data.did}`;
+            } : void 0,
+            onEditProfile: () => {
+              window.location.href = `${profileUrl}/edit`;
+            },
+            onLogin: () => {
+              window.location.href = `${authUrl}/login?next=${encodeURIComponent(window.location.href)}`;
+            },
+            onRegister: () => {
+              window.location.href = `${authUrl}/register`;
+            }
+          });
+        } else {
+          setIdentity({
+            isLoggedIn: false,
+            onLogin: () => {
+              window.location.href = `${authUrl}/login?next=${encodeURIComponent(window.location.href)}`;
+            },
+            onRegister: () => {
+              window.location.href = `${authUrl}/register`;
+            }
+          });
+        }
+      } catch {
+        setIdentity(null);
+      }
+    }
+    checkSession();
+    const handler = () => checkSession();
+    window.addEventListener("imajin:session-changed", handler);
+    return () => window.removeEventListener("imajin:session-changed", handler);
+  }, [servicePrefix, domain, overrides]);
+  return identity;
+}
+function NavBar({
+  currentService,
+  servicePrefix = "https://",
+  domain = "imajin.ai",
+  identity: identityProp,
+  unreadMessages = 0,
+  serviceUrls,
+  children
+}) {
+  var _a;
+  const [isEmbed, setIsEmbed] = useState5(false);
+  useEffect6(() => {
+    if (typeof window !== "undefined") {
+      setIsEmbed(new URLSearchParams(window.location.search).get("embed") === "hub");
+    }
+  }, []);
+  const userLinks = buildUserLinks(servicePrefix, domain, serviceUrls);
+  const isDev = servicePrefix.includes("dev-");
+  const [showDropdown, setShowDropdown] = useState5(false);
+  const [showMobileMenu, setShowMobileMenu] = useState5(false);
+  const dropdownRef = useRef4(null);
+  const [theme, setTheme] = useState5("dark");
+  useEffect6(() => {
+    const saved = typeof window !== "undefined" ? localStorage.getItem("theme") : null;
+    setTheme(saved === "light" ? "light" : "dark");
+  }, []);
+  function toggleTheme() {
+    const next = theme === "dark" ? "light" : "dark";
+    setTheme(next);
+    localStorage.setItem("theme", next);
+    if (next === "dark") {
+      document.documentElement.classList.add("dark");
+    } else {
+      document.documentElement.classList.remove("dark");
+    }
+  }
+  const autoIdentity = useAutoIdentity(servicePrefix, domain, serviceUrls);
+  const identity = identityProp ?? autoIdentity;
+  const registryUrl = buildUrl("registry", servicePrefix, domain, serviceUrls);
+  const launcherTier = getLauncherTier(identity);
+  const [cashBalance, setCashBalance] = useState5(null);
+  const [mjnBalance, setMjnBalance] = useState5(null);
+  const [scopeVersion, setScopeVersion] = useState5(0);
+  useEffect6(() => {
+    const handler = () => setScopeVersion((v) => v + 1);
+    window.addEventListener("imajin:acting-as-changed", handler);
+    return () => window.removeEventListener("imajin:acting-as-changed", handler);
+  }, []);
+  useEffect6(() => {
+    if (!(identity == null ? void 0 : identity.isLoggedIn) || !(identity == null ? void 0 : identity.did)) {
+      setCashBalance(null);
+      setMjnBalance(null);
+      return;
+    }
+    const actingAs = typeof window !== "undefined" ? localStorage.getItem("imajin:acting-as") : null;
+    const effectiveDid = actingAs || identity.did;
+    const payUrl = buildUrl("pay", servicePrefix, domain, serviceUrls);
+    fetch(`${payUrl}/api/balance/${encodeURIComponent(effectiveDid)}`, { credentials: "include" }).then((r) => r.ok ? r.json() : null).then((data) => {
+      if (data) {
+        setCashBalance(data.cashAmount != null ? parseFloat(data.cashAmount) : null);
+        setMjnBalance(data.creditAmount != null ? parseFloat(data.creditAmount) : null);
+      } else {
+        setCashBalance(null);
+        setMjnBalance(null);
+      }
+    }).catch(() => {
+    });
+  }, [identity == null ? void 0 : identity.isLoggedIn, identity == null ? void 0 : identity.did, servicePrefix, domain, serviceUrls, scopeVersion]);
+  const [unread, setUnread] = useState5(unreadMessages);
+  useEffect6(() => {
+    if (!(identity == null ? void 0 : identity.isLoggedIn) || (identity == null ? void 0 : identity.tier) === "soft") {
+      setUnread(0);
+      return;
+    }
+    const chatUrl = buildUrl("chat", servicePrefix, domain, serviceUrls);
+    function fetchUnread() {
+      fetch(`${chatUrl}/api/conversations/unread`, { credentials: "include" }).then((r) => r.ok ? r.json() : null).then((data) => {
+        if ((data == null ? void 0 : data.total) != null) setUnread(data.total);
+      }).catch(() => {
+      });
+    }
+    fetchUnread();
+    const interval = setInterval(fetchUnread, 6e4);
+    return () => clearInterval(interval);
+  }, [identity == null ? void 0 : identity.isLoggedIn, identity == null ? void 0 : identity.tier, servicePrefix, domain, serviceUrls]);
+  const authUrl = buildUrl("auth", servicePrefix, domain, serviceUrls);
+  const profileUrl = buildUrl("profile", servicePrefix, domain, serviceUrls);
+  const { identities, activeIdentity, activeConfig, setActiveIdentity } = useIdentities(
+    (identity == null ? void 0 : identity.isLoggedIn) && (identity == null ? void 0 : identity.tier) !== "soft" ? authUrl : null,
+    (identity == null ? void 0 : identity.isLoggedIn) && (identity == null ? void 0 : identity.tier) !== "soft" ? profileUrl : null
+  );
+  const activeIdentityData = identities.find((f) => f.groupDid === activeIdentity) ?? null;
+  useEffect6(() => {
+    function handleClickOutside(event) {
+      if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {
+        setShowDropdown(false);
+      }
+    }
+    if (showDropdown) {
+      document.addEventListener("mousedown", handleClickOutside);
+      return () => document.removeEventListener("mousedown", handleClickOutside);
+    }
+  }, [showDropdown]);
+  return !isEmbed ? /* @__PURE__ */ React6.createElement("nav", { className: "w-full border-b border-gray-200 dark:border-gray-800 bg-white/80 dark:bg-gray-900/80 backdrop-blur-sm relative z-50" }, isDev && /* @__PURE__ */ React6.createElement("div", { className: "w-full bg-amber-500/90 text-black text-xs font-bold text-center py-1 tracking-wide" }, "\u26A0 DEVELOPMENT ENVIRONMENT"), /* @__PURE__ */ React6.createElement("div", { className: "max-w-6xl mx-auto px-4 py-3 flex items-center gap-2" }, /* @__PURE__ */ React6.createElement(
+    "a",
+    {
+      href: buildUrl("www", servicePrefix, domain, serviceUrls),
+      className: "flex items-center hover:opacity-80 transition shrink-0"
+    },
+    /* @__PURE__ */ React6.createElement("span", { className: "w-8 h-8 rounded-lg bg-amber-500/10 dark:bg-amber-500/20 flex items-center justify-center" }, /* @__PURE__ */ React6.createElement("span", { className: "text-xl font-bold text-amber-500" }, "\u4EBA"))
+  ), /* @__PURE__ */ React6.createElement("div", { className: "flex-1 min-w-0" }, children), /* @__PURE__ */ React6.createElement("div", { className: "hidden sm:flex items-center gap-1" }, /* @__PURE__ */ React6.createElement(
+    AppLauncher,
+    {
+      registryUrl,
+      currentService,
+      tier: launcherTier,
+      variant: "grid",
+      authUrl: (identity == null ? void 0 : identity.isLoggedIn) && (identity == null ? void 0 : identity.tier) !== "soft" ? authUrl : void 0,
+      enabledServices: activeConfig == null ? void 0 : activeConfig.enabledServices
+    }
+  ), (identity == null ? void 0 : identity.isLoggedIn) && (identity == null ? void 0 : identity.tier) !== "soft" && /* @__PURE__ */ React6.createElement(React6.Fragment, null, /* @__PURE__ */ React6.createElement(
+    "a",
+    {
+      href: userLinks.messages,
+      className: "relative p-2 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-800 transition no-underline",
+      title: "Messages"
+    },
+    /* @__PURE__ */ React6.createElement("span", { className: "text-lg" }, "\u{1F4AC}"),
+    unread > 0 && /* @__PURE__ */ React6.createElement("span", { className: "absolute -top-0.5 -right-0.5 bg-orange-500 text-white text-[10px] font-bold rounded-full min-w-[1.1rem] h-[1.1rem] flex items-center justify-center px-1" }, unread > 99 ? "99+" : unread)
+  ), /* @__PURE__ */ React6.createElement(
+    "a",
+    {
+      href: userLinks.connections,
+      className: "p-2 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-800 transition no-underline",
+      title: "Connections"
+    },
+    /* @__PURE__ */ React6.createElement("span", { className: "text-lg" }, "\u{1F91D}")
+  ))), process.env.NEXT_PUBLIC_NOTIFY_URL && /* @__PURE__ */ React6.createElement("div", { className: "hidden sm:flex items-center" }, /* @__PURE__ */ React6.createElement(NotificationBell, null)), /* @__PURE__ */ React6.createElement(
+    "button",
+    {
+      onClick: () => setShowMobileMenu(!showMobileMenu),
+      className: "sm:hidden p-2 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-800 transition"
+    },
+    /* @__PURE__ */ React6.createElement("span", { className: "text-xl" }, showMobileMenu ? "\u2715" : "\u2630")
+  ), /* @__PURE__ */ React6.createElement("div", { className: "flex items-center gap-2" }, (identity == null ? void 0 : identity.isLoggedIn) && (identity == null ? void 0 : identity.tier) === "soft" ? (
+    /* Soft DID — just a logout button, no dropdown */
+    /* @__PURE__ */ React6.createElement(
+      "button",
+      {
+        onClick: () => {
+          var _a2;
+          return (_a2 = identity.onLogout) == null ? void 0 : _a2.call(identity);
+        },
+        className: "px-3 py-1.5 rounded-lg text-sm text-red-600 dark:text-red-400 hover:bg-gray-100 dark:hover:bg-gray-800 transition"
+      },
+      "Logout"
+    )
+  ) : (identity == null ? void 0 : identity.isLoggedIn) ? /* @__PURE__ */ React6.createElement("div", { className: "flex items-center gap-2" }, cashBalance !== null && cashBalance > 0 && /* @__PURE__ */ React6.createElement(
+    "a",
+    {
+      href: buildUrl("pay", servicePrefix, domain, serviceUrls),
+      className: "text-sm font-medium text-green-600 dark:text-green-400 bg-green-50 dark:bg-green-900/20 px-2.5 py-1 rounded-full hover:bg-green-100 dark:hover:bg-green-900/40 transition no-underline"
+    },
+    "$",
+    cashBalance.toFixed(2)
+  ), mjnBalance !== null && mjnBalance > 0 && /* @__PURE__ */ React6.createElement(
+    "a",
+    {
+      href: buildUrl("pay", servicePrefix, domain, serviceUrls),
+      className: "text-sm font-medium text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 px-2.5 py-1 rounded-full hover:bg-amber-100 dark:hover:bg-amber-900/40 transition no-underline"
+    },
+    "\u4EBA",
+    Math.round(mjnBalance)
+  ), /* @__PURE__ */ React6.createElement("div", { className: "relative", ref: dropdownRef }, /* @__PURE__ */ React6.createElement(
+    "button",
+    {
+      onClick: () => setShowDropdown(!showDropdown),
+      className: "flex items-center gap-2 px-3 py-1.5 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-800 transition"
+    },
+    /* @__PURE__ */ React6.createElement("span", { className: "text-xl" }, activeIdentityData ? scopeIcon2(activeIdentityData.scope) : "\u{1F464}"),
+    /* @__PURE__ */ React6.createElement("span", { className: "flex flex-col items-start", style: { gap: "2px" } }, activeIdentityData && /* @__PURE__ */ React6.createElement("span", { className: "text-[10px] text-amber-600 dark:text-amber-400 font-medium leading-none" }, "acting as"), /* @__PURE__ */ React6.createElement("span", { className: "text-sm font-medium leading-none" }, activeIdentityData ? activeIdentityData.name || activeIdentityData.handle || "Identity" : identity.handle ? `@${identity.handle}` : identity.name ? identity.name : ((_a = identity.did) == null ? void 0 : _a.slice(0, 12)) + "..."))
+  ), showDropdown && /* @__PURE__ */ React6.createElement("div", { className: "absolute right-0 mt-2 w-52 bg-white dark:bg-gray-900 border border-gray-200 dark:border-gray-800 rounded-lg shadow-lg py-1 z-50" }, identity.tier !== "soft" && /* @__PURE__ */ React6.createElement(React6.Fragment, null, identity.onViewProfile && /* @__PURE__ */ React6.createElement(
+    "button",
+    {
+      onClick: () => {
+        var _a2;
+        (_a2 = identity.onViewProfile) == null ? void 0 : _a2.call(identity);
+        setShowDropdown(false);
+      },
+      className: "w-full text-left px-4 py-2 text-sm hover:bg-gray-100 dark:hover:bg-gray-800 transition flex items-center gap-2"
+    },
+    /* @__PURE__ */ React6.createElement("span", null, "\u{1F464}"),
+    " View Profile"
+  ), identity.onEditProfile && /* @__PURE__ */ React6.createElement(
+    "button",
+    {
+      onClick: () => {
+        var _a2;
+        (_a2 = identity.onEditProfile) == null ? void 0 : _a2.call(identity);
+        setShowDropdown(false);
+      },
+      className: "w-full text-left px-4 py-2 text-sm hover:bg-gray-100 dark:hover:bg-gray-800 transition flex items-center gap-2"
+    },
+    /* @__PURE__ */ React6.createElement("span", null, "\u270F\uFE0F"),
+    " Edit Profile"
+  ), /* @__PURE__ */ React6.createElement(
+    "a",
+    {
+      href: `${buildUrl("auth", servicePrefix, domain, serviceUrls)}/settings/security`,
+      className: "w-full text-left px-4 py-2 text-sm hover:bg-gray-100 dark:hover:bg-gray-800 transition flex items-center gap-2 no-underline text-inherit"
+    },
+    /* @__PURE__ */ React6.createElement("span", null, "\u{1F512}"),
+    " Security"
+  ), /* @__PURE__ */ React6.createElement(
+    "a",
+    {
+      href: `${buildUrl("notify", servicePrefix, domain, serviceUrls)}/settings`,
+      className: "w-full text-left px-4 py-2 text-sm hover:bg-gray-100 dark:hover:bg-gray-800 transition flex items-center gap-2 no-underline text-inherit"
+    },
+    /* @__PURE__ */ React6.createElement("span", null, "\u{1F514}"),
+    " Notifications"
+  ), /* @__PURE__ */ React6.createElement("hr", { className: "my-1 border-gray-200 dark:border-gray-800" }), /* @__PURE__ */ React6.createElement(
+    "a",
+    {
+      href: userLinks.messages,
+      className: "w-full text-left px-4 py-2 text-sm hover:bg-gray-100 dark:hover:bg-gray-800 transition flex items-center gap-2 no-underline text-inherit"
+    },
+    /* @__PURE__ */ React6.createElement("span", null, "\u{1F4AC}"),
+    " Messages",
+    unread > 0 && /* @__PURE__ */ React6.createElement("span", { className: "ml-auto bg-orange-500 text-white text-xs font-bold rounded-full px-2 py-0.5 min-w-[1.25rem] text-center" }, unread)
+  ), /* @__PURE__ */ React6.createElement(
+    "a",
+    {
+      href: userLinks.connections,
+      className: "w-full text-left px-4 py-2 text-sm hover:bg-gray-100 dark:hover:bg-gray-800 transition flex items-center gap-2 no-underline text-inherit"
+    },
+    /* @__PURE__ */ React6.createElement("span", null, "\u{1F91D}"),
+    " Connections"
+  ), /* @__PURE__ */ React6.createElement(
+    "a",
+    {
+      href: buildUrl("pay", servicePrefix, domain, serviceUrls),
+      className: "w-full text-left px-4 py-2 text-sm hover:bg-gray-100 dark:hover:bg-gray-800 transition flex items-center gap-2 no-underline text-inherit"
+    },
+    /* @__PURE__ */ React6.createElement("span", null, "\u{1F4B0}"),
+    " Wallet"
+  ), /* @__PURE__ */ React6.createElement(
+    "a",
+    {
+      href: buildUrl("media", servicePrefix, domain, serviceUrls),
+      className: "w-full text-left px-4 py-2 text-sm hover:bg-gray-100 dark:hover:bg-gray-800 transition flex items-center gap-2 no-underline text-inherit"
+    },
+    /* @__PURE__ */ React6.createElement("span", null, "\u{1F4C1}"),
+    " Media"
+  ), /* @__PURE__ */ React6.createElement(
+    "a",
+    {
+      href: buildUrl("auth", servicePrefix, domain, serviceUrls),
+      className: "w-full text-left px-4 py-2 text-sm hover:bg-gray-100 dark:hover:bg-gray-800 transition flex items-center gap-2 no-underline text-inherit"
+    },
+    /* @__PURE__ */ React6.createElement("span", null, "\u{1F511}"),
+    " Identities"
+  ), /* @__PURE__ */ React6.createElement("hr", { className: "my-1 border-gray-200 dark:border-gray-800" }), /* @__PURE__ */ React6.createElement("div", { className: "px-4 py-1 text-[10px] font-semibold uppercase tracking-wider text-gray-400 dark:text-gray-500" }, "Switch To"), activeIdentity && identity && /* @__PURE__ */ React6.createElement("div", { className: "flex items-center group/identity" }, /* @__PURE__ */ React6.createElement(
+    "button",
+    {
+      onClick: () => {
+        setActiveIdentity(null);
+        setShowDropdown(false);
+      },
+      className: "flex-1 text-left px-4 py-2 text-sm hover:bg-gray-100 dark:hover:bg-gray-800 transition flex items-center gap-2"
+    },
+    /* @__PURE__ */ React6.createElement("span", null, "\u{1F464}"),
+    /* @__PURE__ */ React6.createElement("span", null, identity.handle ? `@${identity.handle}` : identity.name || "Personal")
+  )), identities.slice(0, 5).map((ident) => {
+    const isActive = ident.groupDid === activeIdentity;
+    return /* @__PURE__ */ React6.createElement("div", { key: ident.groupDid, className: "flex items-center group/identity" }, /* @__PURE__ */ React6.createElement(
+      "button",
+      {
+        onClick: () => {
+          setActiveIdentity(isActive ? null : ident.groupDid);
+          setShowDropdown(false);
+        },
+        className: "flex-1 text-left px-4 py-2 text-sm hover:bg-gray-100 dark:hover:bg-gray-800 transition flex items-center gap-2"
+      },
+      /* @__PURE__ */ React6.createElement("span", null, scopeIcon2(ident.scope)),
+      /* @__PURE__ */ React6.createElement("span", { className: isActive ? "font-medium" : "" }, ident.name || ident.handle || ident.groupDid.slice(0, 12)),
+      isActive && /* @__PURE__ */ React6.createElement("span", { className: "ml-auto text-amber-600 dark:text-amber-400 font-bold text-xs" }, "\u2713")
+    ), /* @__PURE__ */ React6.createElement(
+      "a",
+      {
+        href: `${authUrl}/groups/${encodeURIComponent(ident.groupDid)}/settings`,
+        onClick: (e) => e.stopPropagation(),
+        className: "pr-3 py-2 text-gray-400 dark:text-gray-500 hover:text-gray-700 dark:hover:text-gray-300 transition opacity-0 group-hover/identity:opacity-100 no-underline text-sm",
+        title: "Settings"
+      },
+      "\u2699\uFE0F"
+    ));
+  }), identities.length > 5 && /* @__PURE__ */ React6.createElement(
+    "a",
+    {
+      href: buildUrl("auth", servicePrefix, domain, serviceUrls),
+      className: "w-full text-left px-4 py-2 text-sm hover:bg-gray-100 dark:hover:bg-gray-800 transition flex items-center gap-2 no-underline text-inherit text-gray-500 dark:text-gray-400"
+    },
+    "View all \u2192"
+  ), /* @__PURE__ */ React6.createElement("hr", { className: "my-1 border-gray-200 dark:border-gray-800" }), /* @__PURE__ */ React6.createElement(
+    "button",
+    {
+      onClick: toggleTheme,
+      className: "w-full text-left px-4 py-2 text-sm hover:bg-gray-100 dark:hover:bg-gray-800 transition flex items-center gap-2"
+    },
+    /* @__PURE__ */ React6.createElement("span", null, theme === "dark" ? "\u2600\uFE0F" : "\u{1F319}"),
+    " ",
+    theme === "dark" ? "Light Mode" : "Dark Mode"
+  ), /* @__PURE__ */ React6.createElement(
+    "a",
+    {
+      href: `${buildUrl("www", servicePrefix, domain, serviceUrls)}/bugs`,
+      className: "w-full text-left px-4 py-2 text-sm hover:bg-gray-100 dark:hover:bg-gray-800 transition flex items-center gap-2 no-underline text-inherit"
+    },
+    /* @__PURE__ */ React6.createElement("span", null, "\u{1F41B}"),
+    " Report a Bug"
+  )), identity.onLogout && /* @__PURE__ */ React6.createElement(React6.Fragment, null, identity.tier !== "soft" && /* @__PURE__ */ React6.createElement("hr", { className: "my-1 border-gray-200 dark:border-gray-800" }), /* @__PURE__ */ React6.createElement(
+    "button",
+    {
+      onClick: () => {
+        var _a2;
+        (_a2 = identity.onLogout) == null ? void 0 : _a2.call(identity);
+        setShowDropdown(false);
+      },
+      className: "w-full text-left px-4 py-2 text-sm text-red-600 dark:text-red-400 hover:bg-gray-100 dark:hover:bg-gray-800 transition flex items-center gap-2"
+    },
+    /* @__PURE__ */ React6.createElement("span", null, "\u{1F6AA}"),
+    " Logout"
+  ))))) : identity ? /* @__PURE__ */ React6.createElement(React6.Fragment, null, identity.onLogin && /* @__PURE__ */ React6.createElement(
+    "button",
+    {
+      onClick: identity.onLogin,
+      className: "px-3 py-1.5 rounded-lg text-sm bg-[#F59E0B] text-black hover:bg-[#D97706] transition font-medium"
+    },
+    "Login"
+  )) : null)), showMobileMenu && /* @__PURE__ */ React6.createElement("div", { className: "sm:hidden border-t border-gray-200 dark:border-gray-800 px-4 py-3" }, children && /* @__PURE__ */ React6.createElement("div", { className: "mb-3" }, children), /* @__PURE__ */ React6.createElement(
+    AppLauncher,
+    {
+      registryUrl,
+      currentService,
+      tier: launcherTier,
+      inline: true,
+      variant: "grid",
+      authUrl: (identity == null ? void 0 : identity.isLoggedIn) && (identity == null ? void 0 : identity.tier) !== "soft" ? authUrl : void 0,
+      enabledServices: activeConfig == null ? void 0 : activeConfig.enabledServices
+    }
+  ), (identity == null ? void 0 : identity.isLoggedIn) && (identity == null ? void 0 : identity.tier) !== "soft" && /* @__PURE__ */ React6.createElement("div", { className: "flex items-center gap-2 mt-3 pt-3 border-t border-gray-200 dark:border-gray-800" }, /* @__PURE__ */ React6.createElement(
+    "a",
+    {
+      href: userLinks.messages,
+      className: "flex items-center gap-2 px-3 py-2 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-800 transition no-underline text-sm text-inherit"
+    },
+    /* @__PURE__ */ React6.createElement("span", null, "\u{1F4AC}"),
+    " Messages",
+    unread > 0 && /* @__PURE__ */ React6.createElement("span", { className: "bg-orange-500 text-white text-xs font-bold rounded-full px-2 py-0.5 min-w-[1.25rem] text-center" }, unread)
+  ), /* @__PURE__ */ React6.createElement(
+    "a",
+    {
+      href: userLinks.connections,
+      className: "flex items-center gap-2 px-3 py-2 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-800 transition no-underline text-sm text-inherit"
+    },
+    /* @__PURE__ */ React6.createElement("span", null, "\u{1F91D}"),
+    " Connections"
+  )))) : null;
+}
+
+// src/button.tsx
+import React7 from "react";
+function Button({ variant = "primary", className = "", ...props }) {
+  const base = "px-4 py-2 rounded font-medium transition-colors";
+  const variants = {
+    primary: "bg-orange-500 text-white hover:bg-orange-600",
+    secondary: "bg-gray-200 text-gray-800 hover:bg-gray-300"
+  };
+  return /* @__PURE__ */ React7.createElement("button", { className: `${base} ${variants[variant]} ${className}`, ...props });
+}
+
+// src/balance-badge.tsx
+import React8, { useState as useState6, useEffect as useEffect7 } from "react";
+function BalanceBadge({ did, payUrl, authToken, className = "" }) {
+  const [balance, setBalance] = useState6(null);
+  const [loading, setLoading] = useState6(false);
+  useEffect7(() => {
+    if (!did || !authToken) {
+      setBalance(null);
+      return;
+    }
+    let cancelled = false;
+    async function fetchBalance() {
+      setLoading(true);
+      try {
+        const res = await fetch(`${payUrl}/api/balance/${did}`, {
+          headers: {
+            "Authorization": `Bearer ${authToken}`
+          },
+          credentials: "include"
+        });
+        if (res.ok) {
+          const data = await res.json();
+          if (!cancelled) {
+            setBalance(data);
+          }
+        } else {
+          if (!cancelled) {
+            setBalance(null);
+          }
+        }
+      } catch (error) {
+        console.error("Failed to fetch balance:", error);
+        if (!cancelled) {
+          setBalance(null);
+        }
+      } finally {
+        if (!cancelled) {
+          setLoading(false);
+        }
+      }
+    }
+    fetchBalance();
+    return () => {
+      cancelled = true;
+    };
+  }, [did, authToken, payUrl]);
+  if (!did || !authToken) {
+    return null;
+  }
+  if (loading) {
+    return null;
+  }
+  if (!balance || balance.amount <= 0) {
+    return null;
+  }
+  return /* @__PURE__ */ React8.createElement(
+    "div",
+    {
+      className: `inline-flex items-center gap-1.5 px-3 py-1.5 rounded-full bg-gradient-to-r from-orange-500/10 to-amber-500/10 border border-orange-500/20 ${className}`
+    },
+    /* @__PURE__ */ React8.createElement("span", { className: "text-sm font-medium text-green-600 dark:text-green-400" }, "$", balance.amount.toFixed(2))
+  );
+}
+
+// src/footer.tsx
+import { useEffect as useEffect8, useState as useState7 } from "react";
+
+// src/BuildInfo.tsx
+var WWW_URL = process.env.NEXT_PUBLIC_WWW_URL || "https://imajin.ai";
+function BuildInfo() {
+  const version = process.env.NEXT_PUBLIC_VERSION || "dev";
+  const hash = process.env.NEXT_PUBLIC_BUILD_HASH || "local";
+  const commitCount = process.env.NEXT_PUBLIC_COMMIT_COUNT || "";
+  const isDev = version === "dev" || version.includes("dev");
+  const display = commitCount ? `${version}+${commitCount}` : version;
+  return /* @__PURE__ */ React.createElement(
+    "a",
+    {
+      href: `${WWW_URL}/build`,
+      className: `text-xs hover:underline ${isDev ? "text-yellow-600" : "text-gray-500"}`
+    },
+    "imajin ",
+    display,
+    " \xB7 build ",
+    hash.slice(0, 7)
+  );
+}
+
+// src/footer.tsx
+function getServiceFromPathname(pathname) {
+  const segment = pathname.split("/").filter(Boolean)[0];
+  if (!segment) return "landing";
+  return segment;
+}
+function ImajinFooter({ className }) {
+  const [subscribeHref, setSubscribeHref] = useState7("/subscribe");
+  useEffect8(() => {
+    const service = getServiceFromPathname(window.location.pathname);
+    setSubscribeHref(`/subscribe?from=${service}`);
+  }, []);
+  return /* @__PURE__ */ React.createElement("div", { className: `flex flex-col items-center gap-2 ${className || ""}` }, /* @__PURE__ */ React.createElement("p", { className: "text-center text-sm text-gray-500" }, "Part of the", " ", /* @__PURE__ */ React.createElement("a", { href: "https://imajin.ai", className: "text-orange-500 hover:underline" }, "Imajin"), " ", "sovereign network"), /* @__PURE__ */ React.createElement("p", { className: "text-center text-sm text-gray-500" }, /* @__PURE__ */ React.createElement("a", { href: "https://app.dfos.com/j/c3rff6e96e4ca9hncc43en", className: "hover:underline" }, "Community"), " \xB7 ", /* @__PURE__ */ React.createElement("a", { href: "https://github.com/ima-jin/imajin-ai", className: "hover:underline" }, "GitHub"), " \xB7 ", /* @__PURE__ */ React.createElement("a", { href: "/privacy", className: "hover:underline" }, "Privacy"), " \xB7 ", /* @__PURE__ */ React.createElement("a", { href: subscribeHref, className: "hover:underline" }, "Subscribe")), /* @__PURE__ */ React.createElement(BuildInfo, null));
+}
+
+// src/brand.ts
+var BRAND = {
+  name: "Imajin",
+  nameJp: "\u4ECA\u4EBA",
+  pronunciation: "eema-gin",
+  /** Primary tagline — used on homepage hero */
+  tagline: "The internet that pays you back",
+  /** Footer line — used across all services */
+  footer: "Part of the Imajin sovereign network",
+  /** Short sovereign message — used in emails, receipts */
+  sovereign: "No platform. No middleman. Yours.",
+  /** Links */
+  url: "https://imajin.ai",
+  community: "https://app.dfos.com/j/c3rff6e96e4ca9hncc43en",
+  github: "https://github.com/ima-jin/imajin-ai"
+};
+
+// src/MarkdownEditor.tsx
+import React9 from "react";
+import {
+  MDXEditor,
+  headingsPlugin,
+  listsPlugin,
+  quotePlugin,
+  linkPlugin,
+  linkDialogPlugin,
+  toolbarPlugin,
+  markdownShortcutPlugin,
+  BoldItalicUnderlineToggles,
+  BlockTypeSelect,
+  CreateLink,
+  ListsToggle,
+  Separator
+} from "@mdxeditor/editor";
+import "@mdxeditor/editor/style.css";
+function MarkdownEditor({ value, onChange, placeholder, maxLength }) {
+  const handleChange = (md) => {
+    if (maxLength !== void 0 && md.length > maxLength) return;
+    onChange(md);
+  };
+  return /* @__PURE__ */ React9.createElement(
+    "div",
+    {
+      className: "rounded-lg border border-gray-600 overflow-hidden",
+      style: {
+        "--baseBg": "#1a1a1a",
+        "--basePageBg": "#1a1a1a",
+        "--baseTextContrast": "#e5e7eb",
+        "--baseText": "#d1d5db",
+        "--baseBorder": "#374151",
+        "--accentBase": "#f97316",
+        "--accentBgHover": "rgba(249,115,22,0.15)",
+        "--accentTextContrast": "#f97316"
+      }
+    },
+    /* @__PURE__ */ React9.createElement(
+      MDXEditor,
+      {
+        markdown: value,
+        onChange: handleChange,
+        placeholder,
+        className: "dark-theme dark-editor",
+        plugins: [
+          headingsPlugin({ allowedHeadingLevels: [1, 2, 3] }),
+          listsPlugin(),
+          quotePlugin(),
+          linkPlugin(),
+          linkDialogPlugin(),
+          markdownShortcutPlugin(),
+          toolbarPlugin({
+            toolbarContents: () => /* @__PURE__ */ React9.createElement(React9.Fragment, null, /* @__PURE__ */ React9.createElement(BlockTypeSelect, null), /* @__PURE__ */ React9.createElement(Separator, null), /* @__PURE__ */ React9.createElement(BoldItalicUnderlineToggles, { options: ["Bold", "Italic"] }), /* @__PURE__ */ React9.createElement(Separator, null), /* @__PURE__ */ React9.createElement(CreateLink, null), /* @__PURE__ */ React9.createElement(Separator, null), /* @__PURE__ */ React9.createElement(ListsToggle, null))
+          })
+        ]
+      }
+    )
+  );
+}
+
+// src/MarkdownContent.tsx
+import React10 from "react";
+import ReactMarkdown from "react-markdown";
+function MarkdownContent({ content }) {
+  return /* @__PURE__ */ React10.createElement("div", { className: "prose dark:prose-invert max-w-none" }, /* @__PURE__ */ React10.createElement(
+    ReactMarkdown,
+    {
+      components: {
+        h1: ({ children }) => /* @__PURE__ */ React10.createElement("h1", { className: "text-2xl font-bold mb-4 text-gray-900 dark:text-white" }, children),
+        h2: ({ children }) => /* @__PURE__ */ React10.createElement("h2", { className: "text-xl font-bold mb-3 text-gray-900 dark:text-white" }, children),
+        h3: ({ children }) => /* @__PURE__ */ React10.createElement("h3", { className: "text-lg font-semibold mb-2 text-gray-900 dark:text-white" }, children),
+        p: ({ children }) => /* @__PURE__ */ React10.createElement("p", { className: "mb-4 leading-relaxed text-gray-700 dark:text-gray-200" }, children),
+        a: ({ href, children }) => /* @__PURE__ */ React10.createElement(
+          "a",
+          {
+            href,
+            className: "text-orange-500 dark:text-orange-400 hover:text-orange-600 dark:hover:text-orange-300 underline",
+            target: "_blank",
+            rel: "noopener noreferrer"
+          },
+          children
+        ),
+        ul: ({ children }) => /* @__PURE__ */ React10.createElement("ul", { className: "list-disc list-inside mb-4 space-y-1 text-gray-700 dark:text-gray-200" }, children),
+        ol: ({ children }) => /* @__PURE__ */ React10.createElement("ol", { className: "list-decimal list-inside mb-4 space-y-1 text-gray-700 dark:text-gray-200" }, children),
+        li: ({ children }) => /* @__PURE__ */ React10.createElement("li", { className: "text-gray-700 dark:text-gray-200" }, children),
+        blockquote: ({ children }) => /* @__PURE__ */ React10.createElement("blockquote", { className: "border-l-4 border-orange-500 pl-4 my-4 italic text-gray-500 dark:text-gray-400" }, children),
+        strong: ({ children }) => /* @__PURE__ */ React10.createElement("strong", { className: "font-bold text-gray-900 dark:text-white" }, children),
+        em: ({ children }) => /* @__PURE__ */ React10.createElement("em", { className: "italic text-gray-700 dark:text-gray-200" }, children),
+        code: ({ children }) => /* @__PURE__ */ React10.createElement("code", { className: "bg-gray-100 dark:bg-gray-800 px-1 py-0.5 rounded text-sm font-mono text-orange-600 dark:text-orange-300" }, children)
+      }
+    },
+    content
+  ));
+}
+
+// src/connection-picker.tsx
+import { useState as useState8, useEffect as useEffect9 } from "react";
+function ConnectionPicker({
+  connectionsUrl,
+  excludeDids = [],
+  onSelect,
+  placeholder = "Search connections...",
+  disabled = false
+}) {
+  const [connections, setConnections] = useState8([]);
+  const [loading, setLoading] = useState8(true);
+  const [error, setError] = useState8(null);
+  const [search, setSearch] = useState8("");
+  useEffect9(() => {
+    fetch(connectionsUrl).then((r) => r.json()).then((data) => {
+      setConnections(data.connections || []);
+      setLoading(false);
+    }).catch(() => {
+      setError("Failed to load connections");
+      setLoading(false);
+    });
+  }, [connectionsUrl]);
+  const excludeSet = new Set(excludeDids);
+  const available = connections.filter((c) => !excludeSet.has(c.did));
+  const filtered = search ? available.filter(
+    (c) => (c.handle || "").toLowerCase().includes(search.toLowerCase()) || (c.name || "").toLowerCase().includes(search.toLowerCase())
+  ) : available;
+  return /* @__PURE__ */ React.createElement("div", { className: "space-y-2" }, /* @__PURE__ */ React.createElement(
+    "input",
+    {
+      type: "text",
+      value: search,
+      onChange: (e) => setSearch(e.target.value),
+      placeholder,
+      disabled: disabled || loading,
+      className: "w-full px-3 py-2 text-sm border border-gray-600 rounded-lg bg-gray-900 text-white placeholder-gray-500 focus:outline-none focus:ring-2 focus:ring-orange-500 disabled:opacity-50"
+    }
+  ), loading ? /* @__PURE__ */ React.createElement("p", { className: "text-sm text-gray-500 px-1" }, "Loading connections...") : error ? /* @__PURE__ */ React.createElement("p", { className: "text-sm text-red-400 px-1" }, error) : filtered.length === 0 ? /* @__PURE__ */ React.createElement("p", { className: "text-sm text-gray-500 px-1" }, available.length === 0 ? "No connections available." : "No matching connections.") : /* @__PURE__ */ React.createElement("div", { className: "space-y-0 max-h-48 overflow-y-auto rounded-lg border border-gray-700 bg-gray-900" }, filtered.map((conn) => /* @__PURE__ */ React.createElement(
+    "button",
+    {
+      key: conn.did,
+      onClick: () => {
+        onSelect(conn);
+        setSearch("");
+      },
+      disabled,
+      className: "w-full flex items-center gap-3 px-3 py-2 hover:bg-gray-800 transition text-left disabled:opacity-50"
+    },
+    conn.avatar ? /* @__PURE__ */ React.createElement(
+      "img",
+      {
+        src: conn.avatar,
+        alt: conn.name || conn.handle || conn.did,
+        className: "w-8 h-8 rounded-full object-cover flex-shrink-0"
+      }
+    ) : /* @__PURE__ */ React.createElement("div", { className: "w-8 h-8 rounded-full bg-gray-700 flex items-center justify-center text-gray-400 text-sm font-semibold flex-shrink-0" }, (conn.name || conn.handle || conn.did).charAt(0).toUpperCase()),
+    /* @__PURE__ */ React.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React.createElement("div", { className: "text-sm font-medium text-white truncate" }, conn.name || (conn.handle ? `@${conn.handle}` : conn.did.slice(0, 20) + "...")), conn.handle && conn.name && /* @__PURE__ */ React.createElement("div", { className: "text-xs text-gray-400 truncate" }, "@", conn.handle))
+  ))));
+}
+
+// src/PayoutSetupBanner.tsx
+import { useState as useState9, useEffect as useEffect10 } from "react";
+function PayoutSetupBanner({
+  did,
+  payUrl,
+  message = "Set up payouts to receive funds from events, tips, and sales",
+  viewerDid,
+  ownerHandle,
+  ownerName,
+  ownerRole = "Event creator"
+}) {
+  const [shouldShow, setShouldShow] = useState9(false);
+  const [loading, setLoading] = useState9(true);
+  const isThirdParty = !!viewerDid && viewerDid !== did;
+  const ownerLabel = ownerHandle ? `@${ownerHandle}` : ownerName || "they";
+  useEffect10(() => {
+    const dismissedKey = `payout-banner-dismissed-${did}`;
+    if (typeof window !== "undefined" && localStorage.getItem(dismissedKey) === "true") {
+      setLoading(false);
+      return;
+    }
+    const check = async () => {
+      try {
+        const res = await fetch(`${payUrl}/api/connect/status?did=${encodeURIComponent(did)}`, {
+          credentials: "include"
+        });
+        if (res.status === 404 || res.status === 403) {
+          setShouldShow(true);
+        } else if (res.ok) {
+          const data = await res.json();
+          setShouldShow(!data.onboardingComplete);
+        }
+      } catch {
+      } finally {
+        setLoading(false);
+      }
+    };
+    if (did) check();
+    else setLoading(false);
+  }, [did, payUrl]);
+  const handleDismiss = () => {
+    localStorage.setItem(`payout-banner-dismissed-${did}`, "true");
+    setShouldShow(false);
+  };
+  if (loading || !shouldShow) return null;
+  const displayMessage = isThirdParty ? `${ownerRole} ${ownerLabel} needs to connect Stripe before tickets can be sold.` : message;
+  return /* @__PURE__ */ React.createElement("div", { className: "bg-orange-900/20 border border-orange-800/50 rounded-xl p-4 mb-6" }, /* @__PURE__ */ React.createElement("div", { className: "flex items-center justify-between gap-4" }, /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-3 min-w-0" }, /* @__PURE__ */ React.createElement("div", { className: "w-2 h-2 bg-orange-500 rounded-full animate-pulse shrink-0" }), /* @__PURE__ */ React.createElement("p", { className: "text-sm text-orange-200" }, displayMessage)), /* @__PURE__ */ React.createElement("div", { className: "flex items-center gap-3 shrink-0" }, !isThirdParty && /* @__PURE__ */ React.createElement(
+    "a",
+    {
+      href: `${payUrl}/payouts`,
+      className: "text-sm text-orange-400 hover:text-orange-300 font-medium transition-colors whitespace-nowrap"
+    },
+    "Set up payouts \u2192"
+  ), /* @__PURE__ */ React.createElement(
+    "button",
+    {
+      onClick: handleDismiss,
+      className: "text-orange-400/60 hover:text-orange-400 text-lg leading-none transition-colors",
+      "aria-label": "Dismiss"
+    },
+    "\xD7"
+  ))));
+}
+
+// src/action-sheet.tsx
+import React11, { useEffect as useEffect11 } from "react";
+function Reactions({ emojis, onSelect }) {
+  return /* @__PURE__ */ React11.createElement("div", { className: "flex justify-around px-4 py-3 border-b border-gray-700" }, emojis.map((emoji) => /* @__PURE__ */ React11.createElement(
+    "button",
+    {
+      key: emoji,
+      onClick: () => onSelect(emoji),
+      className: "w-11 h-11 flex items-center justify-center text-2xl hover:bg-gray-700 rounded-full transition",
+      "aria-label": emoji
+    },
+    emoji
+  )));
+}
+function Actions({ children }) {
+  return /* @__PURE__ */ React11.createElement("div", { className: "border-b border-gray-700 last:border-b-0" }, children);
+}
+function Action({ icon, label, onPress, variant = "default" }) {
+  return /* @__PURE__ */ React11.createElement(
+    "button",
+    {
+      onClick: onPress,
+      className: `w-full flex items-center gap-3 px-5 py-3.5 text-left text-sm transition hover:bg-gray-800 ${variant === "danger" ? "text-red-400" : "text-white"}`
+    },
+    icon && /* @__PURE__ */ React11.createElement("span", { className: "text-lg w-6 text-center" }, icon),
+    /* @__PURE__ */ React11.createElement("span", null, label)
+  );
+}
+function ActionSheet({ open, onClose, title, children }) {
+  useEffect11(() => {
+    if (!open) return;
+    const handleKeyDown = (e) => {
+      if (e.key === "Escape") onClose();
+    };
+    document.addEventListener("keydown", handleKeyDown);
+    return () => document.removeEventListener("keydown", handleKeyDown);
+  }, [open, onClose]);
+  if (!open) return null;
+  return /* @__PURE__ */ React11.createElement("div", { className: "fixed inset-0 z-[9998] flex items-end" }, /* @__PURE__ */ React11.createElement("style", null, `
+        @keyframes actionSheetSlideUp {
+          from { transform: translateY(100%); }
+          to { transform: translateY(0); }
+        }
+      `), /* @__PURE__ */ React11.createElement(
+    "div",
+    {
+      className: "absolute inset-0 bg-black/60",
+      onClick: onClose,
+      "aria-hidden": "true"
+    }
+  ), /* @__PURE__ */ React11.createElement(
+    "div",
+    {
+      role: "dialog",
+      "aria-modal": "true",
+      "aria-label": title ?? "Actions",
+      className: "relative w-full bg-gray-900 rounded-t-2xl border-t border-gray-700 max-h-[70vh] overflow-y-auto",
+      style: { animation: "actionSheetSlideUp 0.25s ease-out" }
+    },
+    /* @__PURE__ */ React11.createElement("div", { className: "flex justify-center pt-3 pb-1" }, /* @__PURE__ */ React11.createElement("div", { className: "w-10 h-1 rounded-full bg-gray-600" })),
+    title && /* @__PURE__ */ React11.createElement("div", { className: "px-5 py-2 border-b border-gray-700" }, /* @__PURE__ */ React11.createElement("p", { className: "text-sm font-medium text-gray-400 text-center" }, title)),
+    children
+  ));
+}
+ActionSheet.Reactions = Reactions;
+ActionSheet.Actions = Actions;
+ActionSheet.Action = Action;
+
+// src/app-shell.tsx
+import React12 from "react";
+var AppShell = React12.forwardRef(
+  function AppShell2({ className = "", children, ...props }, ref) {
+    return /* @__PURE__ */ React12.createElement(
+      "div",
+      {
+        ref,
+        className: `h-dvh flex flex-col overflow-hidden ${className}`,
+        ...props
+      },
+      children
+    );
+  }
+);
+var AppShellHeader = React12.forwardRef(
+  function AppShellHeader2({ className = "", children, ...props }, ref) {
+    return /* @__PURE__ */ React12.createElement("div", { ref, className: `shrink-0 ${className}`, ...props }, children);
+  }
+);
+var AppShellBody = React12.forwardRef(
+  function AppShellBody2({ className = "", children, ...props }, ref) {
+    return /* @__PURE__ */ React12.createElement(
+      "div",
+      {
+        ref,
+        className: `flex-1 min-h-0 overflow-auto ${className}`,
+        ...props
+      },
+      children
+    );
+  }
+);
+var AppShellFooter = React12.forwardRef(
+  function AppShellFooter2({ className = "", children, ...props }, ref) {
+    return /* @__PURE__ */ React12.createElement("div", { ref, className: `shrink-0 ${className}`, ...props }, children);
+  }
+);
+var AppShellSplit = React12.forwardRef(
+  function AppShellSplit2({ className = "", children, ...props }, ref) {
+    return /* @__PURE__ */ React12.createElement(
+      "div",
+      {
+        ref,
+        className: `flex-1 min-h-0 flex flex-row overflow-hidden ${className}`,
+        ...props
+      },
+      children
+    );
+  }
+);
+var AppShellPane = React12.forwardRef(
+  function AppShellPane2({ width, className = "", style, children, ...props }, ref) {
+    const widthStyle = width != null ? { width, ...style } : style;
+    return /* @__PURE__ */ React12.createElement(
+      "div",
+      {
+        ref,
+        className: `flex flex-col min-h-0 overflow-hidden ${className}`,
+        style: widthStyle,
+        ...props
+      },
+      children
+    );
+  }
+);
+AppShell.displayName = "AppShell";
+AppShellHeader.displayName = "AppShell.Header";
+AppShellBody.displayName = "AppShell.Body";
+AppShellFooter.displayName = "AppShell.Footer";
+AppShellSplit.displayName = "AppShell.Split";
+AppShellPane.displayName = "AppShell.Split.Pane";
+AppShell.Header = AppShellHeader;
+AppShell.Body = AppShellBody;
+AppShell.Footer = AppShellFooter;
+AppShell.Split = AppShellSplit;
+AppShellSplit.Pane = AppShellPane;
+
+// src/DidShareListEditor.tsx
+import React13, { useEffect as useEffect12, useMemo, useRef as useRef5, useState as useState10 } from "react";
+var ROLE_OPTIONS = [
+  "creator",
+  "collaborator",
+  "producer",
+  "performer",
+  "platform",
+  "venue",
+  "distributor",
+  "label",
+  "other"
+];
+var SUM_TOLERANCE = 1e-6;
+function ResolvedDidChip({
+  did,
+  profile,
+  onClear,
+  readOnly
+}) {
+  const displayName = (profile == null ? void 0 : profile.name) || did.slice(0, 16) + "\u2026";
+  const handle = profile == null ? void 0 : profile.handle;
+  const avatar = profile == null ? void 0 : profile.avatar;
+  const handleCopy = () => {
+    navigator.clipboard.writeText(did).catch(() => {
+    });
+  };
+  return /* @__PURE__ */ React13.createElement(
+    "div",
+    {
+      className: "flex-1 flex items-center gap-2 bg-[#1a1a1a] border border-gray-700 rounded px-2 py-1 min-w-0 cursor-pointer hover:border-gray-600 transition",
+      title: did,
+      onClick: handleCopy
+    },
+    avatar ? /* @__PURE__ */ React13.createElement(
+      "img",
+      {
+        src: avatar,
+        alt: "",
+        className: "w-5 h-5 rounded-full object-cover flex-shrink-0"
+      }
+    ) : /* @__PURE__ */ React13.createElement("div", { className: "w-5 h-5 rounded-full bg-gray-700 flex items-center justify-center text-gray-400 text-[10px] font-semibold flex-shrink-0" }, displayName.charAt(0).toUpperCase()),
+    /* @__PURE__ */ React13.createElement("span", { className: "text-xs text-gray-200 truncate" }, displayName),
+    handle && /* @__PURE__ */ React13.createElement("span", { className: "text-xs text-gray-500 truncate" }, "@", handle),
+    !readOnly && /* @__PURE__ */ React13.createElement(
+      "button",
+      {
+        onClick: (e) => {
+          e.stopPropagation();
+          onClear();
+        },
+        className: "ml-auto text-gray-600 hover:text-red-400 transition text-xs px-1",
+        title: "Clear",
+        type: "button"
+      },
+      "\u2715"
+    )
+  );
+}
+function InlineDidPicker({
+  connectionsUrl,
+  onSelect,
+  readOnly
+}) {
+  const [query, setQuery] = useState10("");
+  const [open, setOpen] = useState10(false);
+  const [connections, setConnections] = useState10([]);
+  const [loading, setLoading] = useState10(false);
+  const wrapperRef = useRef5(null);
+  const inputRef = useRef5(null);
+  useEffect12(() => {
+    if (!connectionsUrl || connections.length > 0) return;
+    setLoading(true);
+    fetch(connectionsUrl).then((r) => r.json()).then((data) => {
+      const list = (data.connections || []).map((c) => ({
+        did: String(c.did || ""),
+        name: c.name ? String(c.name) : null,
+        handle: c.handle ? String(c.handle) : null,
+        avatar: c.avatar ? String(c.avatar) : null
+      }));
+      setConnections(list);
+    }).catch(() => {
+      setConnections([]);
+    }).finally(() => setLoading(false));
+  }, [connectionsUrl, connections.length]);
+  useEffect12(() => {
+    function handleClick(e) {
+      if (wrapperRef.current && !wrapperRef.current.contains(e.target)) {
+        setOpen(false);
+      }
+    }
+    document.addEventListener("mousedown", handleClick);
+    return () => document.removeEventListener("mousedown", handleClick);
+  }, []);
+  const isRawDid = query.trim().startsWith("did:");
+  const filtered = useMemo(() => {
+    const q = query.trim().toLowerCase();
+    if (!q) return connections;
+    return connections.filter(
+      (c) => (c.handle || "").toLowerCase().includes(q) || (c.name || "").toLowerCase().includes(q) || c.did.toLowerCase().includes(q)
+    );
+  }, [query, connections]);
+  const handleSelect = (did) => {
+    onSelect(did);
+    setQuery("");
+    setOpen(false);
+  };
+  const handleKeyDown = (e) => {
+    if (e.key === "Enter") {
+      e.preventDefault();
+      const trimmed = query.trim();
+      if (isRawDid) {
+        handleSelect(trimmed);
+      } else if (filtered.length > 0) {
+        handleSelect(filtered[0].did);
+      }
+    } else if (e.key === "Escape") {
+      setOpen(false);
+    }
+  };
+  const showDropdown = open && (filtered.length > 0 || isRawDid || loading);
+  return /* @__PURE__ */ React13.createElement("div", { ref: wrapperRef, className: "flex-1 relative" }, /* @__PURE__ */ React13.createElement(
+    "input",
+    {
+      ref: inputRef,
+      type: "text",
+      value: query,
+      onChange: (e) => {
+        setQuery(e.target.value);
+        setOpen(true);
+      },
+      onFocus: () => setOpen(true),
+      onKeyDown: handleKeyDown,
+      placeholder: connectionsUrl ? "Search connections or paste DID\u2026" : "did:key:...",
+      readOnly,
+      className: "w-full bg-[#1a1a1a] border border-gray-700 rounded px-2 py-1 text-xs text-gray-200 placeholder-gray-600 focus:outline-none focus:border-orange-500 read-only:opacity-60"
+    }
+  ), showDropdown && /* @__PURE__ */ React13.createElement("div", { className: "absolute z-10 top-full left-0 right-0 mt-1 bg-[#1a1a1a] border border-gray-700 rounded max-h-36 overflow-y-auto shadow-lg" }, loading ? /* @__PURE__ */ React13.createElement("div", { className: "px-3 py-2 text-xs text-gray-500" }, "Loading\u2026") : /* @__PURE__ */ React13.createElement(React13.Fragment, null, isRawDid && /* @__PURE__ */ React13.createElement(
+    "button",
+    {
+      onClick: () => handleSelect(query.trim()),
+      className: "w-full flex items-center gap-2 px-3 py-2 hover:bg-[#252525] transition text-left",
+      type: "button"
+    },
+    /* @__PURE__ */ React13.createElement("span", { className: "text-xs text-orange-400" }, "Use raw DID:"),
+    /* @__PURE__ */ React13.createElement("span", { className: "text-xs text-gray-300 truncate" }, query.trim())
+  ), filtered.map((conn) => /* @__PURE__ */ React13.createElement(
+    "button",
+    {
+      key: conn.did,
+      onClick: () => handleSelect(conn.did),
+      className: "w-full flex items-center gap-2 px-3 py-2 hover:bg-[#252525] transition text-left",
+      type: "button"
+    },
+    conn.avatar ? /* @__PURE__ */ React13.createElement(
+      "img",
+      {
+        src: conn.avatar,
+        alt: "",
+        className: "w-5 h-5 rounded-full object-cover flex-shrink-0"
+      }
+    ) : /* @__PURE__ */ React13.createElement("div", { className: "w-5 h-5 rounded-full bg-gray-700 flex items-center justify-center text-gray-400 text-[10px] font-semibold flex-shrink-0" }, (conn.name || conn.handle || conn.did).charAt(0).toUpperCase()),
+    /* @__PURE__ */ React13.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React13.createElement("span", { className: "text-xs text-gray-200 truncate" }, conn.name || (conn.handle ? `@${conn.handle}` : conn.did.slice(0, 20) + "\u2026")), conn.handle && conn.name && /* @__PURE__ */ React13.createElement("span", { className: "text-xs text-gray-500 ml-1" }, "@", conn.handle))
+  )), filtered.length === 0 && !isRawDid && /* @__PURE__ */ React13.createElement("div", { className: "px-3 py-2 text-xs text-gray-500" }, connections.length === 0 ? "No connections available." : "No matches."))));
+}
+function DidShareListEditor({
+  value,
+  onChange,
+  readOnly = false,
+  className = "",
+  defaultDid,
+  showFixed = false,
+  connectionsUrl,
+  resolveProfile
+}) {
+  const [resolvedCache, setResolvedCache] = useState10({});
+  const totalShare = useMemo(
+    () => value.reduce((sum, e) => sum + e.share, 0),
+    [value]
+  );
+  const isValid = Math.abs(totalShare - 1) <= SUM_TOLERANCE;
+  const isOver = totalShare > 1 + SUM_TOLERANCE;
+  const update = (i, patch) => {
+    const next = value.map((e, idx) => idx === i ? { ...e, ...patch } : e);
+    onChange(next);
+  };
+  const remove = (i) => {
+    onChange(value.filter((_e, idx) => idx !== i));
+  };
+  const add = () => {
+    onChange([
+      ...value,
+      {
+        did: defaultDid ?? "",
+        role: "collaborator",
+        share: 0
+      }
+    ]);
+  };
+  useEffect12(() => {
+    if (!resolveProfile) return;
+    const dids = value.map((e) => e.did).filter(Boolean);
+    const uniqueDids = [...new Set(dids)].filter((did) => !(did in resolvedCache));
+    if (uniqueDids.length === 0) return;
+    Promise.all(
+      uniqueDids.map(async (did) => {
+        try {
+          const profile = await resolveProfile(did);
+          return { did, profile };
+        } catch {
+          return { did, profile: null };
+        }
+      })
+    ).then((results) => {
+      setResolvedCache((prev) => {
+        const next = { ...prev };
+        for (const { did, profile } of results) {
+          next[did] = profile;
+        }
+        return next;
+      });
+    });
+  }, [resolveProfile, value.map((e) => e.did).join(",")]);
+  return /* @__PURE__ */ React13.createElement("div", { className: `space-y-3 ${className}` }, value.map((entry, i) => /* @__PURE__ */ React13.createElement("div", { key: i, className: "bg-[#252525] rounded-lg p-3 space-y-2" }, /* @__PURE__ */ React13.createElement("div", { className: "flex items-center gap-2" }, entry.did ? /* @__PURE__ */ React13.createElement(
+    ResolvedDidChip,
+    {
+      did: entry.did,
+      profile: resolvedCache[entry.did] ?? null,
+      onClear: () => update(i, { did: "" }),
+      readOnly
+    }
+  ) : /* @__PURE__ */ React13.createElement(
+    InlineDidPicker,
+    {
+      connectionsUrl,
+      onSelect: (did) => update(i, { did }),
+      readOnly
+    }
+  ), /* @__PURE__ */ React13.createElement(
+    "select",
+    {
+      value: entry.role,
+      onChange: (e) => update(i, { role: e.target.value }),
+      disabled: readOnly,
+      className: "bg-[#1a1a1a] border border-gray-700 rounded px-2 py-1 text-xs text-gray-200 focus:outline-none focus:border-orange-500 disabled:opacity-60"
+    },
+    ROLE_OPTIONS.map((r) => /* @__PURE__ */ React13.createElement("option", { key: r, value: r }, r))
+  ), !readOnly && /* @__PURE__ */ React13.createElement(
+    "button",
+    {
+      onClick: () => remove(i),
+      className: "text-gray-600 hover:text-red-400 transition text-sm px-1",
+      title: "Remove",
+      type: "button"
+    },
+    "\u2715"
+  )), /* @__PURE__ */ React13.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React13.createElement(
+    "input",
+    {
+      type: "range",
+      min: 0,
+      max: 100,
+      step: 0.5,
+      value: Math.round(entry.share * 1e3) / 10,
+      onChange: (e) => update(i, { share: parseFloat(e.target.value) / 100 }),
+      disabled: readOnly,
+      className: "flex-1 accent-orange-500 disabled:opacity-60"
+    }
+  ), /* @__PURE__ */ React13.createElement(
+    "input",
+    {
+      type: "number",
+      min: 0,
+      max: 100,
+      step: 0.5,
+      value: (entry.share * 100).toFixed(1),
+      onChange: (e) => update(i, { share: parseFloat(e.target.value) / 100 }),
+      readOnly,
+      className: "w-16 bg-[#1a1a1a] border border-gray-700 rounded px-2 py-1 text-xs text-gray-200 focus:outline-none focus:border-orange-500 text-right read-only:opacity-60"
+    }
+  ), /* @__PURE__ */ React13.createElement("span", { className: "text-xs text-gray-500" }, "%")), /* @__PURE__ */ React13.createElement(
+    "input",
+    {
+      type: "text",
+      value: entry.name ?? "",
+      onChange: (e) => update(i, { name: e.target.value || void 0 }),
+      placeholder: "Name (optional)",
+      readOnly,
+      className: "w-full bg-[#1a1a1a] border border-gray-700 rounded px-2 py-1 text-xs text-gray-500 placeholder-gray-700 focus:outline-none focus:border-orange-500 read-only:opacity-60"
+    }
+  ))), !readOnly && /* @__PURE__ */ React13.createElement(
+    "button",
+    {
+      onClick: add,
+      type: "button",
+      className: "w-full py-1.5 rounded border border-dashed border-gray-700 text-xs text-gray-500 hover:border-orange-500 hover:text-orange-400 transition"
+    },
+    "+ Add contributor"
+  ), /* @__PURE__ */ React13.createElement("div", { className: "flex items-center justify-between text-xs" }, /* @__PURE__ */ React13.createElement(
+    "span",
+    {
+      className: isValid ? "text-gray-500" : isOver ? "text-red-400 font-medium" : "text-orange-400 font-medium"
+    },
+    "Total: ",
+    (totalShare * 100).toFixed(1),
+    "%",
+    !isValid && /* @__PURE__ */ React13.createElement("span", { className: "ml-1" }, isOver ? "(must be \u2264 100%)" : "(must equal 100%)")
+  ), /* @__PURE__ */ React13.createElement("span", { className: "text-gray-600" }, value.length, " ", value.length === 1 ? "entry" : "entries")));
+}
+
+// src/MoneyInput.tsx
+import React14, { useMemo as useMemo2 } from "react";
+var DEFAULT_CURRENCIES = ["USD", "EUR", "GBP", "CAD", "MJNX"];
+var CURRENCY_SYMBOLS = {
+  USD: "$",
+  EUR: "\u20AC",
+  GBP: "\xA3",
+  CAD: "C$",
+  MJNX: "\u24C2"
+};
+function formatCents(cents) {
+  return (cents / 100).toFixed(2);
+}
+function parseDecimalInput(raw) {
+  const cleaned = raw.replace(/,/g, "");
+  const parsed = parseFloat(cleaned);
+  if (Number.isNaN(parsed) || parsed < 0) return null;
+  return Math.round(parsed * 100);
+}
+function MoneyInput({
+  value,
+  onChange,
+  readOnly = false,
+  className = "",
+  currencies = DEFAULT_CURRENCIES
+}) {
+  const symbol = value ? CURRENCY_SYMBOLS[value.currency] ?? value.currency : "$";
+  const formattedPreview = useMemo2(() => {
+    if (!value) return "";
+    const amt = (value.amount / 100).toFixed(2);
+    return `${symbol}${amt} ${value.currency}`;
+  }, [value, symbol]);
+  return /* @__PURE__ */ React14.createElement("div", { className: `space-y-1 ${className}` }, /* @__PURE__ */ React14.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React14.createElement("div", { className: "relative flex-1" }, /* @__PURE__ */ React14.createElement("span", { className: "absolute left-2 top-1/2 -translate-y-1/2 text-xs text-gray-500 pointer-events-none" }, symbol), /* @__PURE__ */ React14.createElement(
+    "input",
+    {
+      type: "text",
+      inputMode: "decimal",
+      value: value ? formatCents(value.amount) : "",
+      onChange: (e) => {
+        const cents = parseDecimalInput(e.target.value);
+        if (cents === null) {
+          onChange(void 0);
+          return;
+        }
+        onChange({
+          amount: cents,
+          currency: (value == null ? void 0 : value.currency) ?? currencies[0]
+        });
+      },
+      placeholder: "0.00",
+      readOnly,
+      className: "w-full bg-[#1a1a1a] border border-gray-700 rounded pl-6 pr-2 py-1.5 text-xs text-gray-200 placeholder-gray-600 focus:outline-none focus:border-orange-500 read-only:opacity-60"
+    }
+  )), /* @__PURE__ */ React14.createElement(
+    "select",
+    {
+      value: (value == null ? void 0 : value.currency) ?? currencies[0],
+      onChange: (e) => {
+        const currency = e.target.value;
+        const amount = (value == null ? void 0 : value.amount) ?? 0;
+        if (amount === 0 && !value) {
+          onChange(void 0);
+        } else {
+          onChange({ amount, currency });
+        }
+      },
+      disabled: readOnly,
+      className: "bg-[#1a1a1a] border border-gray-700 rounded px-2 py-1.5 text-xs text-gray-200 focus:outline-none focus:border-orange-500 disabled:opacity-60"
+    },
+    currencies.map((c) => /* @__PURE__ */ React14.createElement("option", { key: c, value: c }, c))
+  )), value && value.amount > 0 && /* @__PURE__ */ React14.createElement("p", { className: "text-[10px] text-gray-500" }, formattedPreview));
+}
+
+// src/theme-init.ts
+var themeInitScript = `
+  (function() {
+    var theme = localStorage.getItem('theme');
+    if (theme === 'light') {
+      document.documentElement.classList.remove('dark');
+    } else {
+      document.documentElement.classList.add('dark');
+    }
+  })()
+`;
+export {
+  ActionSheet,
+  AppLauncher,
+  AppShell,
+  BRAND,
+  BalanceBadge,
+  BuildInfo,
+  Button,
+  ConnectionPicker,
+  DidShareListEditor,
+  ImajinFooter,
+  MarkdownContent,
+  MarkdownEditor,
+  MoneyInput,
+  NavBar,
+  NotificationBell,
+  NotificationProvider,
+  PayoutSetupBanner,
+  ToastProvider,
+  getActingAs,
+  getActingAsHeaders,
+  setActingAs,
+  themeInitScript,
+  useIdentities,
+  useNotifications,
+  useToast
+};