@retinalabsllc/zairusjs 21.1.4 → 21.1.6

package/dist/index.mjs

@@ -6397,6 +6397,1038 @@ var HomeHuddleCalendar = ({
     }
   ));
 };
+
+// src/components/UniversalApplicationsPage.tsx
+import React55 from "react";
+import { HugeiconsIcon as HugeiconsIcon41 } from "@hugeicons/react";
+import {
+  ArrowLeft01Icon as ArrowLeft01Icon21,
+  ArrowRight01Icon as ArrowRight01Icon16,
+  Loading03Icon as Loading03Icon29
+} from "@hugeicons/core-free-icons";
+var formatType = (type) => {
+  if (!type) return "";
+  return type.split("_").map((word) => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase()).join(" ");
+};
+var ApplicationIcon = ({ icon, sizeClass = "w-10 h-10" }) => {
+  return /* @__PURE__ */ React55.createElement("div", { className: `relative shrink-0 aspect-square ${sizeClass}` }, /* @__PURE__ */ React55.createElement("div", { className: "w-full h-full aspect-square rounded-lg bg-neutral-50 flex items-center justify-center overflow-hidden" }, icon ? /* @__PURE__ */ React55.createElement(HugeiconsIcon41, { icon, size: 20, className: "text-stone-500" }) : /* @__PURE__ */ React55.createElement("div", { className: "w-4 h-4 rounded-sm bg-stone-300" })));
+};
+var PageSpinner9 = () => /* @__PURE__ */ React55.createElement("div", { className: "flex justify-center items-center py-12" }, /* @__PURE__ */ React55.createElement(HugeiconsIcon41, { icon: Loading03Icon29, size: 32, className: "animate-spin mb-4 text-black" }));
+var UniversalApplicationsPage = ({
+  headerTitle,
+  headerDescription,
+  applications,
+  isLoading,
+  currentPage,
+  totalPages,
+  onPageChange,
+  onApplicationClick,
+  onCreateApplication
+}) => {
+  return /* @__PURE__ */ React55.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300 relative" }, /* @__PURE__ */ React55.createElement("div", { className: "flex flex-col gap-8 p-6 rounded-2xl bg-white w-full" }, /* @__PURE__ */ React55.createElement("div", { className: "flex flex-col gap-1" }, /* @__PURE__ */ React55.createElement("div", { className: "flex flex-row items-center justify-between gap-4" }, /* @__PURE__ */ React55.createElement("h2", { className: "text-black text-xl tracking-tight" }, headerTitle), /* @__PURE__ */ React55.createElement(
+    "button",
+    {
+      onClick: () => onCreateApplication?.(),
+      className: "shrink-0 px-4 py-1.5 border border-stone-200 text-black text-xs tracking-wide rounded-full hover:bg-stone-50 transition-colors outline-none"
+    },
+    "Create new"
+  )), headerDescription && /* @__PURE__ */ React55.createElement("p", { className: "text-xs text-stone-500" }, headerDescription)), /* @__PURE__ */ React55.createElement("div", { className: "w-full overflow-hidden" }, isLoading ? /* @__PURE__ */ React55.createElement(PageSpinner9, null) : /* @__PURE__ */ React55.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ React55.createElement("div", null, applications.length === 0 ? /* @__PURE__ */ React55.createElement("p", { className: "text-xs text-stone-400 py-6 text-center" }, "No applications available") : applications.map((app) => /* @__PURE__ */ React55.createElement(
+    "div",
+    {
+      key: app.id,
+      onClick: () => onApplicationClick(app.id),
+      className: "flex flex-row items-center gap-4 py-2 hover:bg-stone-50 transition-colors cursor-pointer group min-w-0 px-3 -mx-3 rounded-xl"
+    },
+    /* @__PURE__ */ React55.createElement(ApplicationIcon, { icon: app.icon }),
+    /* @__PURE__ */ React55.createElement("div", { className: "flex flex-col min-w-0 flex-1" }, /* @__PURE__ */ React55.createElement("p", { className: "text-sm text-black tracking-tight truncate" }, formatType(app.type)), /* @__PURE__ */ React55.createElement("span", { className: "text-xs text-stone-500 truncate block mt-0.5" }, app.timeString)),
+    /* @__PURE__ */ React55.createElement(HugeiconsIcon41, { icon: ArrowRight01Icon16, size: 14, className: "shrink-0 text-stone-400" })
+  ))), /* @__PURE__ */ React55.createElement("div", { className: "flex items-center justify-between pt-6 mt-2 " }, /* @__PURE__ */ React55.createElement("span", { className: "text-xs text-stone-400 tracking-[0.2em]" }, "Page ", currentPage, " of ", totalPages === 0 ? 1 : totalPages), /* @__PURE__ */ React55.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React55.createElement(
+    "button",
+    {
+      onClick: () => onPageChange(currentPage - 1),
+      disabled: currentPage <= 1 || isLoading,
+      className: "p-2 bg-white border border-stone-200 rounded-full text-black hover:bg-stone-50 disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none"
+    },
+    /* @__PURE__ */ React55.createElement(HugeiconsIcon41, { icon: ArrowLeft01Icon21, size: 14 })
+  ), /* @__PURE__ */ React55.createElement(
+    "button",
+    {
+      onClick: () => onPageChange(currentPage + 1),
+      disabled: currentPage >= totalPages || isLoading || totalPages === 0,
+      className: "p-2 bg-white border border-stone-200 rounded-full text-black hover:bg-stone-50 disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none"
+    },
+    /* @__PURE__ */ React55.createElement(HugeiconsIcon41, { icon: ArrowRight01Icon16, size: 14 })
+  )))))));
+};
+
+// src/components/UniversalHome3.tsx
+import React56, { useState as useState40 } from "react";
+import { useRouter as useRouter5 } from "next/navigation";
+import { HugeiconsIcon as HugeiconsIcon42 } from "@hugeicons/react";
+import toast17 from "react-hot-toast";
+import {
+  Loading03Icon as Loading03Icon30,
+  Notification01Icon as Notification01Icon3,
+  ArrowLeft01Icon as ArrowLeft01Icon22,
+  ArrowRight01Icon as ArrowRight01Icon17,
+  CancelCircleIcon as CancelCircleIcon14,
+  ArrowUpRight01Icon as ArrowUpRight01Icon4,
+  Robot01Icon as Robot01Icon2,
+  SidebarLeft01Icon
+} from "@hugeicons/core-free-icons";
+var UniversalHome3 = ({
+  createApplicationAction,
+  checkApplicationAction,
+  notifications = [],
+  notificationPage = 1,
+  notificationTotalPages = 1,
+  isNotifsLoading = false,
+  onNotificationPageChange,
+  onNotificationClick,
+  onResolveInvite,
+  formatNotifDate,
+  customContent,
+  applicationsProps
+}) => {
+  const [showNotifDialog, setShowNotifDialog] = useState40(false);
+  const [selectedNotif, setSelectedNotif] = useState40(null);
+  const [isResolving, setIsResolving] = useState40(false);
+  const router = useRouter5();
+  const hasUnreadNotifs = notifications.some((n) => !n.isRead);
+  const handleResolve = async (resolution) => {
+    if (!onResolveInvite || !selectedNotif) return;
+    setIsResolving(true);
+    try {
+      await onResolveInvite(selectedNotif, resolution);
+      window.location.reload();
+    } catch (error) {
+      toast17.error("Failed to process invitation");
+      setIsResolving(false);
+    }
+  };
+  return /* @__PURE__ */ React56.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300 relative" }, /* @__PURE__ */ React56.createElement("div", { className: "flex items-center justify-between w-full pb-4" }, /* @__PURE__ */ React56.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React56.createElement(
+    "button",
+    {
+      onClick: () => window.dispatchEvent(new Event("open-sidebar")),
+      className: "md:hidden flex items-center justify-center w-7 h-7 bg-white rounded-full  text-black transition-all duration-300 outline-none hover:bg-stone-50",
+      "aria-label": "Open Menu"
+    },
+    /* @__PURE__ */ React56.createElement(HugeiconsIcon42, { icon: SidebarLeft01Icon, size: 16 })
+  )), /* @__PURE__ */ React56.createElement("div", { className: "flex items-center gap-2 shrink-0" }, /* @__PURE__ */ React56.createElement(
+    "button",
+    {
+      onClick: () => router.push("/app/ai"),
+      className: "relative w-7 h-7 flex items-center justify-center rounded-full bg-white outline-none hover:bg-stone-50 transition-colors"
+    },
+    /* @__PURE__ */ React56.createElement(HugeiconsIcon42, { icon: Robot01Icon2, size: 16, className: "text-black" })
+  ), /* @__PURE__ */ React56.createElement(
+    "button",
+    {
+      onClick: () => {
+        setShowNotifDialog(true);
+        setSelectedNotif(null);
+      },
+      className: "relative w-7 h-7 flex items-center justify-center rounded-full bg-white outline-none hover:bg-stone-50 transition-colors"
+    },
+    /* @__PURE__ */ React56.createElement(HugeiconsIcon42, { icon: Notification01Icon3, size: 16, className: "text-black" }),
+    hasUnreadNotifs && /* @__PURE__ */ React56.createElement("span", { className: "absolute top-2.5 right-2.5 w-2 h-2 bg-[#d97757] rounded-full border border-white" })
+  ))), /* @__PURE__ */ React56.createElement("div", { className: "w-full pb-6 flex flex-col gap-4" }, /* @__PURE__ */ React56.createElement("div", { className: "grid grid-cols-2 gap-2" }, /* @__PURE__ */ React56.createElement(
+    "div",
+    {
+      onClick: createApplicationAction?.onClick,
+      className: "bg-[#d97757] rounded-2xl p-5 relative overflow-hidden flex flex-col h-32 sm:h-36 cursor-pointer hover:opacity-90 transition-opacity"
+    },
+    /* @__PURE__ */ React56.createElement("div", { className: "relative z-10 flex flex-col h-full justify-between" }, /* @__PURE__ */ React56.createElement("p", { className: "text-sm sm:text-sm text-white leading-tight" }, "New", /* @__PURE__ */ React56.createElement("br", null), /* @__PURE__ */ React56.createElement("span", { className: "text-white/70" }, "Application")), /* @__PURE__ */ React56.createElement("div", { className: "w-8 h-8 rounded-full bg-white/10 flex items-center justify-center" }, /* @__PURE__ */ React56.createElement(HugeiconsIcon42, { icon: ArrowUpRight01Icon4, size: 16, className: "text-white" }))),
+    /* @__PURE__ */ React56.createElement(
+      "img",
+      {
+        src: "https://storage.googleapis.com/retina-cloud-v2/assets/images/cal_b.avif",
+        alt: "New Application",
+        className: "absolute bottom-4 right-2 translate-x-1/4 translate-y-1/2 w-32 h-auto object-contain z-0 pointer-events-none opacity-30"
+      }
+    )
+  ), /* @__PURE__ */ React56.createElement(
+    "div",
+    {
+      onClick: checkApplicationAction?.onClick,
+      className: "bg-[#ffffff] rounded-2xl p-5 relative overflow-hidden flex flex-col h-32 sm:h-36 cursor-pointer hover:opacity-90 transition-opacity"
+    },
+    /* @__PURE__ */ React56.createElement("div", { className: "relative z-10 flex flex-col h-full justify-between" }, /* @__PURE__ */ React56.createElement("p", { className: "text-sm sm:text-sm text-black leading-tight" }, "Check", /* @__PURE__ */ React56.createElement("br", null), /* @__PURE__ */ React56.createElement("span", { className: "text-black/60" }, "Application")), /* @__PURE__ */ React56.createElement("div", { className: "w-8 h-8 rounded-full bg-black/5 flex items-center justify-center" }, /* @__PURE__ */ React56.createElement(HugeiconsIcon42, { icon: ArrowRight01Icon17, size: 16, className: "text-black" }))),
+    /* @__PURE__ */ React56.createElement(
+      "img",
+      {
+        src: "https://storage.googleapis.com/retina-cloud-v2/assets/images/cam_c.avif",
+        alt: "Check Application",
+        className: "absolute bottom-4 right-2 translate-x-1/4 translate-y-1/2 w-32 h-auto object-contain z-0 pointer-events-none opacity-30"
+      }
+    )
+  ))), customContent && /* @__PURE__ */ React56.createElement("div", { className: "w-full" }, customContent), /* @__PURE__ */ React56.createElement("div", { className: "w-full mt-2" }, /* @__PURE__ */ React56.createElement(
+    UniversalApplicationsPage,
+    {
+      ...applicationsProps
+    }
+  )), showNotifDialog && /* @__PURE__ */ React56.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React56.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: () => setShowNotifDialog(false) }), /* @__PURE__ */ React56.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 max-h-[80vh] h-auto" }, /* @__PURE__ */ React56.createElement("div", { className: "flex items-center justify-between p-5 shrink-0" }, selectedNotif ? /* @__PURE__ */ React56.createElement("button", { onClick: () => setSelectedNotif(null), disabled: isResolving, className: "text-[#d97757] hover:text-[#d97757] transition-colors outline-none flex items-center gap-2 text-xs tracking-widest disabled:opacity-50" }, /* @__PURE__ */ React56.createElement(HugeiconsIcon42, { icon: ArrowLeft01Icon22, size: 14 }), " Back") : /* @__PURE__ */ React56.createElement("h3", { className: "text-sm text-black tracking-tight flex items-center gap-2" }, "Notifications"), /* @__PURE__ */ React56.createElement("button", { onClick: () => setShowNotifDialog(false), disabled: isResolving, className: "text-stone-400 hover:text-black transition-colors outline-none disabled:opacity-50" }, /* @__PURE__ */ React56.createElement(HugeiconsIcon42, { icon: CancelCircleIcon14, size: 18 }))), /* @__PURE__ */ React56.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-2 relative" }, isNotifsLoading && !selectedNotif && /* @__PURE__ */ React56.createElement("div", { className: "absolute inset-0 z-10 flex items-center justify-center" }, /* @__PURE__ */ React56.createElement(HugeiconsIcon42, { icon: Loading03Icon30, size: 28, className: "animate-spin text-black" })), selectedNotif ? /* @__PURE__ */ React56.createElement("div", { className: "p-4 text-left" }, selectedNotif.type === "HUDDLE_INVITE" && selectedNotif.meta_json?.action === "RESOLVE_INVITE" && selectedNotif.meta_json?.completed ? /* @__PURE__ */ React56.createElement("div", { className: "" }) : /* @__PURE__ */ React56.createElement("h4", { className: "text-sm text-black mb-1" }, selectedNotif.title), /* @__PURE__ */ React56.createElement("span", { className: "text-xs text-stone-400 tracking-widest mb-4 block" }, formatNotifDate(selectedNotif.createdAt)), /* @__PURE__ */ React56.createElement("p", { className: "text-xs text-stone-600 leading-relaxed whitespace-pre-wrap" }, selectedNotif.message), selectedNotif.type === "HUDDLE_INVITE" && selectedNotif.meta_json?.action === "RESOLVE_INVITE" && /* @__PURE__ */ React56.createElement("div", { className: `mt-8 flex gap-3 pt-6 ${selectedNotif.meta_json?.completed ? "opacity-40 pointer-events-none cursor-not-allowed" : ""}` }, /* @__PURE__ */ React56.createElement(
+    "button",
+    {
+      onClick: () => handleResolve("ACCEPTED"),
+      disabled: isResolving || selectedNotif.meta_json?.completed,
+      className: "flex-1 py-2.5 rounded-full bg-black text-white text-xs tracking-wide transition-all outline-none hover:bg-stone-800 flex justify-center items-center disabled:opacity-50"
+    },
+    isResolving ? /* @__PURE__ */ React56.createElement(HugeiconsIcon42, { icon: Loading03Icon30, className: "animate-spin", size: 16 }) : "Accept"
+  ), /* @__PURE__ */ React56.createElement(
+    "button",
+    {
+      onClick: () => handleResolve("REJECTED"),
+      disabled: isResolving || selectedNotif.meta_json?.completed,
+      className: "flex-1 py-2.5 rounded-full bg-white border border-stone-200 text-black text-xs tracking-wide transition-all outline-none hover:bg-stone-50 flex justify-center items-center disabled:opacity-50"
+    },
+    "Reject"
+  ))) : /* @__PURE__ */ React56.createElement("div", { className: "flex flex-col divide-y divide-stone-50/50" }, notifications?.length === 0 && !isNotifsLoading ? /* @__PURE__ */ React56.createElement("div", { className: "p-8 text-center text-xs text-stone-400" }, "You have no notifications.") : notifications?.map((notif) => /* @__PURE__ */ React56.createElement(
+    "div",
+    {
+      key: notif.id,
+      onClick: () => {
+        setSelectedNotif(notif);
+        onNotificationClick?.(notif);
+      },
+      className: `p-3 flex items-start gap-3 rounded-xl cursor-pointer transition-colors ${isNotifsLoading ? "opacity-50 pointer-events-none" : "hover:bg-stone-50"}`
+    },
+    /* @__PURE__ */ React56.createElement("div", { className: "mt-1.5 shrink-0" }, !notif.isRead ? /* @__PURE__ */ React56.createElement("div", { className: "w-1.5 h-1.5 bg-[#d97757] rounded-full" }) : /* @__PURE__ */ React56.createElement("div", { className: "w-1.5 h-1.5 bg-transparent" })),
+    /* @__PURE__ */ React56.createElement("div", { className: "flex-1 min-w-0 text-left" }, /* @__PURE__ */ React56.createElement("h5", { className: `text-xs truncate ${notif.isRead ? "text-stone-500" : "text-black"}` }, notif.title), /* @__PURE__ */ React56.createElement("p", { className: "text-xs text-stone-400 truncate mt-0.5" }, notif.message), /* @__PURE__ */ React56.createElement("span", { className: "text-xs text-stone-400 tracking-widest mt-2 block" }, formatNotifDate(notif.createdAt)))
+  )))), !selectedNotif && /* @__PURE__ */ React56.createElement("div", { className: "p-4 flex items-center justify-between shrink-0" }, /* @__PURE__ */ React56.createElement("span", { className: "text-xs text-stone-400 tracking-widest" }, "Page ", notificationPage, " of ", notificationTotalPages === 0 ? 1 : notificationTotalPages), /* @__PURE__ */ React56.createElement("div", { className: "flex gap-1" }, /* @__PURE__ */ React56.createElement(
+    "button",
+    {
+      disabled: notificationPage <= 1 || isNotifsLoading,
+      onClick: () => onNotificationPageChange?.(notificationPage - 1),
+      className: "w-7 h-7 flex items-center justify-center rounded-full bg-white border border-stone-200 text-stone-600 disabled:opacity-30 outline-none hover:bg-stone-50 transition-colors"
+    },
+    /* @__PURE__ */ React56.createElement(HugeiconsIcon42, { icon: ArrowLeft01Icon22, size: 12 })
+  ), /* @__PURE__ */ React56.createElement(
+    "button",
+    {
+      disabled: notificationPage >= notificationTotalPages || notificationTotalPages === 0 || isNotifsLoading,
+      onClick: () => onNotificationPageChange?.(notificationPage + 1),
+      className: "w-7 h-7 flex items-center justify-center rounded-full bg-white border border-stone-200 text-stone-600 disabled:opacity-30 outline-none hover:bg-stone-50 transition-colors"
+    },
+    /* @__PURE__ */ React56.createElement(HugeiconsIcon42, { icon: ArrowRight01Icon17, size: 12 })
+  ))))));
+};
+
+// src/components/RootSidebar.tsx
+import React57, { useState as useState41, useEffect as useEffect23 } from "react";
+import Link10 from "next/link";
+import { HugeiconsIcon as HugeiconsIcon43 } from "@hugeicons/react";
+import {
+  SidebarLeft01Icon as SidebarLeft01Icon2,
+  CancelCircleIcon as CancelCircleIcon15,
+  UserIcon as UserIcon3,
+  CheckmarkCircle01Icon as CheckmarkCircle01Icon2,
+  LogoutCircle02Icon as LogoutCircle02Icon3,
+  Loading03Icon as Loading03Icon31
+} from "@hugeicons/core-free-icons";
+function RootSidebar({
+  NavItem2s,
+  currentPath,
+  isMobileOpen,
+  closeMobile,
+  onNavClick,
+  avatarSrc,
+  title = "App",
+  subtitle,
+  homeUrl = "/app",
+  showWorkspaceSwitcher = false,
+  workspaces = [],
+  activeWorkspaceId,
+  onSwitchWorkspace,
+  showLogoutAction = false,
+  onLogout
+}) {
+  const [isCollapsed, setIsCollapsed] = useState41(false);
+  const [isAvatarLoaded, setIsAvatarLoaded] = useState41(false);
+  const [showSwitcherDialog, setShowSwitcherDialog] = useState41(false);
+  const [showLogoutDialog, setShowLogoutDialog] = useState41(false);
+  const [isLoggingOut, setIsLoggingOut] = useState41(false);
+  useEffect23(() => {
+    if (isMobileOpen) {
+      closeMobile();
+    }
+  }, [currentPath]);
+  const hasActiveMatch = NavItem2s.some(
+    (item) => item.path === "/applications" || item.path === "/app" ? currentPath === item.path : currentPath === item.path || currentPath?.startsWith(`${item.path}/`)
+  );
+  const handleLogoutInitiation = async () => {
+    if (isLoggingOut || !onLogout) return;
+    setIsLoggingOut(true);
+    try {
+      await onLogout();
+    } catch (error) {
+      setIsLoggingOut(false);
+      setShowLogoutDialog(false);
+    }
+  };
+  const finalAvatarSrc = avatarSrc || "https://storage.googleapis.com/retina-cloud-v2/assets/images/avatar.avif";
+  return /* @__PURE__ */ React57.createElement(React57.Fragment, null, /* @__PURE__ */ React57.createElement(
+    "div",
+    {
+      className: `fixed inset-0 bg-black/30 shadow-2xl transition-opacity duration-300 md:hidden z-90 ${isMobileOpen ? "opacity-100 pointer-events-auto" : "opacity-0 pointer-events-none"}`,
+      onClick: closeMobile
+    }
+  ), /* @__PURE__ */ React57.createElement(
+    "aside",
+    {
+      className: `
+                    fixed md:sticky rounded-2xl top-4 md:top-4 md:my-4 left-4 md:left-0 md:ml-4 h-[calc(100dvh-2rem)] bg-white  
+                    transition-all duration-300 ease-in-out shrink-0 flex flex-col z-100 md:z-10
+                    ${isMobileOpen ? "translate-x-0" : "translate-x-[-120%] md:translate-x-0"}
+                    ${isCollapsed ? "md:w-16 w-64" : "w-64"}
+                `
+    },
+    /* @__PURE__ */ React57.createElement("div", { className: `flex items-center shrink-0 p-5 ${isCollapsed && !isMobileOpen ? "justify-center" : "justify-between"}` }, /* @__PURE__ */ React57.createElement(Link10, { href: homeUrl, className: `flex items-center outline-none group min-w-0 ${isCollapsed && !isMobileOpen ? "" : "gap-3 pr-2"}` }, /* @__PURE__ */ React57.createElement("div", { className: "w-8 h-8 shrink-0 relative rounded-lg overflow-hidden bg-stone-50 flex items-center justify-center" }, !isAvatarLoaded && /* @__PURE__ */ React57.createElement(HugeiconsIcon43, { icon: Loading03Icon31, size: 14, className: "animate-spin text-stone-300 absolute" }), /* @__PURE__ */ React57.createElement(
+      "img",
+      {
+        src: finalAvatarSrc,
+        alt: "User Avatar",
+        onLoad: () => setIsAvatarLoaded(true),
+        className: `w-full h-full object-cover transition-opacity duration-300 ${isAvatarLoaded ? "opacity-100" : "opacity-0"}`
+      }
+    )), (!isCollapsed || isMobileOpen) && /* @__PURE__ */ React57.createElement("div", { className: "flex flex-col justify-center min-w-0" }, /* @__PURE__ */ React57.createElement("span", { className: "text-[13px] font-serif text-black leading-none truncate max-w-32.5 tracking-wide mb-1 group-hover:opacity-70 transition-opacity" }, title), subtitle && /* @__PURE__ */ React57.createElement("span", { className: "text-[9px] text-neutral-500 truncate max-w-32.5 tracking-[0.2em] leading-none uppercase" }, subtitle))), (!isCollapsed || isMobileOpen) && /* @__PURE__ */ React57.createElement("div", { className: "md:hidden flex shrink-0" }, /* @__PURE__ */ React57.createElement(
+      "button",
+      {
+        onClick: closeMobile,
+        className: "text-neutral-400 hover:text-black transition-colors outline-none",
+        "aria-label": "Close Menu"
+      },
+      /* @__PURE__ */ React57.createElement(HugeiconsIcon43, { icon: CancelCircleIcon15, size: 24 })
+    ))),
+    /* @__PURE__ */ React57.createElement("nav", { className: "flex-1 py-2 flex flex-col gap-1.5 px-3 overflow-y-auto custom-scrollbar" }, NavItem2s.map((item, index) => {
+      const isExactOrSubMatch = item.path === "/applications" || item.path === "/app" ? currentPath === item.path : currentPath === item.path || currentPath?.startsWith(`${item.path}/`);
+      const isCurrentRoute = isExactOrSubMatch || !hasActiveMatch && index === 0;
+      return /* @__PURE__ */ React57.createElement(
+        Link10,
+        {
+          key: item.name,
+          href: item.path,
+          onClick: (e) => onNavClick ? onNavClick(e, item.path) : void 0,
+          className: `flex items-center gap-3 px-3 py-2 rounded-full transition-all outline-none group shrink-0 ${isCurrentRoute ? "bg-neutral-100 text-black " : "text-neutral-500 hover:text-black hover:bg-neutral-50"}`,
+          title: isCollapsed && !isMobileOpen ? item.name : void 0
+        },
+        /* @__PURE__ */ React57.createElement(
+          HugeiconsIcon43,
+          {
+            icon: item.icon,
+            size: 18,
+            className: `shrink-0 transition-colors ${isCurrentRoute ? "text-black" : "text-neutral-400 group-hover:text-black"}`
+          }
+        ),
+        (!isCollapsed || isMobileOpen) && /* @__PURE__ */ React57.createElement("span", { className: "text-xs tracking-wide truncate" }, item.name)
+      );
+    })),
+    /* @__PURE__ */ React57.createElement("div", { className: "p-4 shrink-0 flex flex-col gap-2 " }, (showWorkspaceSwitcher || showLogoutAction) && /* @__PURE__ */ React57.createElement("div", { className: `flex gap-2 px-1 pb-2 ${isCollapsed && !isMobileOpen ? "flex-col items-center" : "flex-col items-start md:flex-row md:items-center"}` }, showWorkspaceSwitcher && workspaces && workspaces.length > 0 && /* @__PURE__ */ React57.createElement(
+      "button",
+      {
+        onClick: () => setShowSwitcherDialog(true),
+        className: "w-8 h-8 shrink-0 rounded-full bg-neutral-50 flex items-center justify-center text-neutral-500 hover:text-black hover:bg-neutral-100 transition-all outline-none",
+        title: "Switch Workspace"
+      },
+      /* @__PURE__ */ React57.createElement(HugeiconsIcon43, { icon: UserIcon3, size: 16 })
+    ), showLogoutAction && /* @__PURE__ */ React57.createElement(
+      "button",
+      {
+        onClick: () => setShowLogoutDialog(true),
+        className: "w-8 h-8 shrink-0 rounded-full bg-neutral-50 flex items-center justify-center text-neutral-500 hover:text-black hover:bg-neutral-100 transition-all outline-none",
+        title: "Secure Logout"
+      },
+      /* @__PURE__ */ React57.createElement(HugeiconsIcon43, { icon: LogoutCircle02Icon3, size: 16 })
+    )), /* @__PURE__ */ React57.createElement("div", { className: "hidden md:block" }, /* @__PURE__ */ React57.createElement(
+      "button",
+      {
+        onClick: () => setIsCollapsed(!isCollapsed),
+        className: "flex items-center justify-center md:justify-start gap-3 w-full p-2.5 rounded-full text-neutral-500 hover:text-black hover:bg-neutral-50 transition-colors outline-none"
+      },
+      /* @__PURE__ */ React57.createElement(HugeiconsIcon43, { icon: SidebarLeft01Icon2, size: 18, className: "shrink-0 text-neutral-400" }),
+      !isCollapsed && /* @__PURE__ */ React57.createElement("span", { className: "text-xs" }, "Collapse")
+    )))
+  ), showSwitcherDialog && showWorkspaceSwitcher && workspaces && workspaces.length > 0 && /* @__PURE__ */ React57.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React57.createElement(
+    "div",
+    {
+      className: "absolute inset-0 bg-black/30",
+      onClick: () => setShowSwitcherDialog(false)
+    }
+  ), /* @__PURE__ */ React57.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React57.createElement("div", { className: "p-5 text-center w-full" }, /* @__PURE__ */ React57.createElement("h3", { className: " font-serif text-[17px] text-black tracking-tight mb-1" }, "Switch Workspace"), /* @__PURE__ */ React57.createElement("p", { className: "text-[11px] text-neutral-500 leading-snug" }, "Select an organization to switch your current context.")), /* @__PURE__ */ React57.createElement("div", { className: "max-h-75 overflow-y-auto w-full custom-scrollbar" }, workspaces.map((org) => /* @__PURE__ */ React57.createElement(
+    "button",
+    {
+      key: org.id,
+      onClick: () => {
+        if (onSwitchWorkspace) onSwitchWorkspace(org.id);
+        setShowSwitcherDialog(false);
+      },
+      className: "w-full text-left px-5 py-4 flex items-center justify-between hover:bg-neutral-50 transition-colors group outline-none last:border-0"
+    },
+    /* @__PURE__ */ React57.createElement("div", { className: "flex flex-col truncate pr-4" }, /* @__PURE__ */ React57.createElement("span", { className: `text-[13px] truncate ${activeWorkspaceId === org.id ? "text-black" : "text-neutral-600 group-hover:text-black"}` }, org.name), /* @__PURE__ */ React57.createElement("span", { className: "text-[9px] text-neutral-400 tracking-[0.2em] mt-1 uppercase" }, "Role: ", org.role)),
+    activeWorkspaceId === org.id && /* @__PURE__ */ React57.createElement(HugeiconsIcon43, { icon: CheckmarkCircle01Icon2, size: 16, className: "text-black shrink-0" })
+  ))), /* @__PURE__ */ React57.createElement("div", { className: "w-full flex mt-auto" }, /* @__PURE__ */ React57.createElement(
+    "button",
+    {
+      onClick: () => setShowSwitcherDialog(false),
+      className: "w-full py-3.5 text-[13px] text-neutral-600 hover:bg-neutral-50 transition-colors outline-none"
+    },
+    "Cancel"
+  )))), /* @__PURE__ */ React57.createElement(
+    ConfirmationDialog,
+    {
+      isOpen: showLogoutDialog && showLogoutAction,
+      title: "Secure Logout",
+      message: "Are you sure you want to log out? You will need to authenticate to return.",
+      confirmText: "Log Out",
+      cancelText: "Cancel",
+      isProcessing: isLoggingOut,
+      isDestructive: true,
+      onClose: () => !isLoggingOut && setShowLogoutDialog(false),
+      onConfirm: handleLogoutInitiation
+    }
+  ));
+}
+
+// src/components/UniversalSettings2.tsx
+import React58, { useState as useState42, useEffect as useEffect24, useRef as useRef17 } from "react";
+import toast18 from "react-hot-toast";
+import { HugeiconsIcon as HugeiconsIcon44 } from "@hugeicons/react";
+import {
+  ArrowLeft01Icon as ArrowLeft01Icon23,
+  ArrowRight01Icon as ArrowRight01Icon18,
+  Loading03Icon as Loading03Icon32,
+  Search01Icon as Search01Icon9,
+  SearchList02Icon as SearchList02Icon4,
+  ListSettingIcon as ListSettingIcon4,
+  CircleLock02Icon as CircleLock02Icon5,
+  CloudUploadIcon as CloudUploadIcon2,
+  SidebarLeft01Icon as SidebarLeft01Icon3
+} from "@hugeicons/core-free-icons";
+var MemberAvatar5 = ({ src, status, sizeClass = "w-10 h-10" }) => {
+  const [loaded, setLoaded] = useState42(false);
+  const [error, setError] = useState42(false);
+  const defaultAvatar = "https://storage.googleapis.com/retina-cloud-v2/assets/images/avatar.avif";
+  const finalSrc = error || !src ? defaultAvatar : src;
+  const getStatusColor = () => {
+    switch (status?.toUpperCase()) {
+      case "ACTIVE":
+        return "bg-emerald-500";
+      case "BUSY":
+        return "bg-amber-500";
+      case "OFFLINE":
+        return "bg-[#d97757]";
+      case "AWAY":
+        return "bg-stone-400";
+      default:
+        return "bg-stone-200";
+    }
+  };
+  return /* @__PURE__ */ React58.createElement("div", { className: `relative shrink-0 ${sizeClass}` }, /* @__PURE__ */ React58.createElement("div", { className: "w-full h-full rounded-lg bg-stone-100 flex items-center justify-center overflow-hidden" }, !loaded && !error && /* @__PURE__ */ React58.createElement(HugeiconsIcon44, { icon: Loading03Icon32, className: "animate-spin text-stone-400 absolute", size: 14 }), /* @__PURE__ */ React58.createElement("img", { src: finalSrc, alt: "Member", className: `w-full h-full object-cover transition-opacity duration-300 ${loaded || error ? "opacity-100" : "opacity-0"}`, onLoad: () => setLoaded(true), onError: () => setError(true) })), /* @__PURE__ */ React58.createElement("div", { className: `absolute -bottom-1 -right-1 w-3.5 h-3.5 rounded-full border-2 border-white z-10 ${getStatusColor()}` }));
+};
+var OrgAvatar3 = ({ src, sizeClass = "w-10 h-10" }) => {
+  const [loaded, setLoaded] = useState42(false);
+  const [error, setError] = useState42(false);
+  const defaultAvatar = "https://storage.googleapis.com/retina-cloud-v2/assets/images/office_a.avif";
+  const finalSrc = error || !src ? defaultAvatar : src;
+  return /* @__PURE__ */ React58.createElement("div", { className: `relative shrink-0 ${sizeClass}` }, /* @__PURE__ */ React58.createElement("div", { className: "w-full h-full rounded-lg bg-stone-100 flex items-center justify-center overflow-hidden" }, !loaded && !error && /* @__PURE__ */ React58.createElement(HugeiconsIcon44, { icon: Loading03Icon32, className: "animate-spin text-stone-400 absolute", size: 14 }), /* @__PURE__ */ React58.createElement(
+    "img",
+    {
+      src: finalSrc,
+      alt: "Workspace Avatar",
+      className: `w-full h-full object-cover transition-opacity duration-300 ${loaded || error ? "opacity-100" : "opacity-0"}`,
+      onLoad: () => setLoaded(true),
+      onError: () => setError(true)
+    }
+  )));
+};
+var PageSpinner10 = () => /* @__PURE__ */ React58.createElement("div", { className: "flex justify-center items-center py-12" }, /* @__PURE__ */ React58.createElement(HugeiconsIcon44, { icon: Loading03Icon32, size: 32, className: "animate-spin mb-4 text-black" }));
+var InputSpinner4 = () => /* @__PURE__ */ React58.createElement("svg", { className: "animate-spin h-4 w-4 text-stone-400", xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24" }, /* @__PURE__ */ React58.createElement("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }), /* @__PURE__ */ React58.createElement("path", { className: "opacity-75", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" }));
+var UniversalSettings2 = ({
+  accountType,
+  userRole,
+  members = [],
+  isMembersLoading = false,
+  membersCurrentPage = 1,
+  membersTotalPages = 1,
+  onMembersPageChange = () => {
+  },
+  membersSearchQuery = "",
+  onMembersSearchChange = () => {
+  },
+  activeStatusFilter = "ALL",
+  onStatusFilterChange = () => {
+  },
+  activeRoleFilter = "ALL",
+  onRoleFilterChange = () => {
+  },
+  onRemoveMember,
+  onInviteMember,
+  onUpdateRole,
+  initialOrgName = "",
+  initialOrgSlug = "",
+  initialOrgAvatarUrl = "",
+  initialFullName = "",
+  initialEmail = "",
+  initialJobTitle = "",
+  initialDescription = "",
+  initialAvatarUrl = "",
+  onSaveProfile,
+  onSaveOrganization,
+  onCheckSlugAvailability,
+  onUploadAvatar
+}) => {
+  const isOrg = accountType === "ORGANIZATION";
+  const safeRole = String(userRole || "").toUpperCase().trim();
+  const canManage = ["ADMIN", "MANAGER", "OWNER"].includes(safeRole);
+  const [activeTab, setActiveTab] = useState42(isOrg ? "MEMBERS" : "ACCOUNT");
+  const [expandedId, setExpandedId] = useState42(null);
+  const [memberToRemove, setMemberToRemove] = useState42(null);
+  const [isRemoving, setIsRemoving] = useState42(false);
+  const [isInviteMode, setIsInviteMode] = useState42(false);
+  const [inviteEmail, setInviteEmail] = useState42("");
+  const [isInviting, setIsInviting] = useState42(false);
+  const [localSearchQuery, setLocalSearchQuery] = useState42(membersSearchQuery);
+  const [isTyping, setIsTyping] = useState42(false);
+  const isFirstSearchMount = useRef17(true);
+  const [isStatusModalOpen, setIsStatusModalOpen] = useState42(false);
+  const [isRoleModalOpen, setIsRoleModalOpen] = useState42(false);
+  const [roleEditTarget, setRoleEditTarget] = useState42(null);
+  const [isUpdatingRole, setIsUpdatingRole] = useState42(false);
+  const [orgName, setOrgName] = useState42(initialOrgName);
+  const [orgSlug, setOrgSlug] = useState42(initialOrgSlug);
+  const [orgAvatarUrl, setOrgAvatarUrl] = useState42(initialOrgAvatarUrl);
+  const [firstName, setFirstName] = useState42("");
+  const [lastName, setLastName] = useState42("");
+  const [jobTitle, setJobTitle] = useState42(initialJobTitle);
+  const [description, setDescription] = useState42(initialDescription);
+  const [avatarUrl, setAvatarUrl] = useState42(initialAvatarUrl);
+  const [isCheckingSlug, setIsCheckingSlug] = useState42(false);
+  const [slugAvailable, setSlugAvailable] = useState42(null);
+  const [isSavingOrg, setIsSavingOrg] = useState42(false);
+  const [isSavingProfile, setIsSavingProfile] = useState42(false);
+  const orgFileInputRef = useRef17(null);
+  const userFileInputRef = useRef17(null);
+  const [pendingOrgAvatar, setPendingOrgAvatar] = useState42(null);
+  const [pendingUserAvatar, setPendingUserAvatar] = useState42(null);
+  const [isUploadingOrgAvatar, setIsUploadingOrgAvatar] = useState42(false);
+  const [isUploadingUserAvatar, setIsUploadingUserAvatar] = useState42(false);
+  useEffect24(() => {
+    setOrgName(initialOrgName || "");
+    setOrgSlug(initialOrgSlug || "");
+    setOrgAvatarUrl(initialOrgAvatarUrl || "");
+    const parts = (initialFullName || "").split(" ");
+    setFirstName(parts[0] || "");
+    setLastName(parts.slice(1).join(" ") || "");
+    setJobTitle(initialJobTitle || "");
+    setDescription(initialDescription || "");
+    setAvatarUrl(initialAvatarUrl || "");
+  }, [initialOrgName, initialOrgSlug, initialOrgAvatarUrl, initialFullName, initialJobTitle, initialDescription, initialAvatarUrl]);
+  const handleFileSelect = (e, type) => {
+    const file = e.target.files?.[0];
+    if (!file) return;
+    if (file.size > 1024 * 1024) {
+      toast18.error("Image size must be less than 1MB.");
+      e.target.value = "";
+      return;
+    }
+    const validTypes = ["image/jpeg", "image/jpg", "image/png"];
+    if (!validTypes.includes(file.type)) {
+      toast18.error("Only PNG and JPEG images are allowed.");
+      e.target.value = "";
+      return;
+    }
+    const previewUrl = URL.createObjectURL(file);
+    if (type === "USER") {
+      setPendingUserAvatar(file);
+      setAvatarUrl(previewUrl);
+    } else if (type === "ORGANIZATION") {
+      setPendingOrgAvatar(file);
+      setOrgAvatarUrl(previewUrl);
+    }
+    e.target.value = "";
+  };
+  useEffect24(() => {
+    if (activeTab !== "MEMBERS") return;
+    if (isFirstSearchMount.current) {
+      isFirstSearchMount.current = false;
+      return;
+    }
+    setIsTyping(true);
+    const handler = setTimeout(() => {
+      onMembersSearchChange(localSearchQuery);
+      setIsTyping(false);
+    }, 600);
+    return () => clearTimeout(handler);
+  }, [localSearchQuery, activeTab]);
+  const cleanEmailId = (val) => val.toLowerCase().replace(/[^a-z0-9@._-]/g, "");
+  const handleOrgSlugChange = (val) => setOrgSlug(val.toLowerCase().replace(/[^a-z0-9-]/g, "").replace(/-+/g, "-").substring(0, 50));
+  const handleOrgNameChange = (val) => setOrgName(val.replace(/[^a-zA-Z0-9\s-]/g, "").substring(0, 50));
+  const handleConfirmRemove = async () => {
+    if (!memberToRemove || !onRemoveMember) return;
+    setIsRemoving(true);
+    try {
+      await onRemoveMember(memberToRemove.userId);
+      toast18.success("Member removed successfully.");
+      setExpandedId(null);
+      setMemberToRemove(null);
+    } catch (error) {
+      toast18.error(error.message || "Failed to remove member.");
+    } finally {
+      setIsRemoving(false);
+    }
+  };
+  const handleInviteSubmit = async (e) => {
+    e.preventDefault();
+    if (inviteEmail.length < 5 || isInviting || !onInviteMember) return;
+    setIsInviting(true);
+    try {
+      await onInviteMember(inviteEmail);
+      setInviteEmail("");
+      setIsInviteMode(false);
+    } catch (error) {
+      toast18.error(error.message || "Failed to send invitation.");
+    } finally {
+      setIsInviting(false);
+    }
+  };
+  const handleRoleUpdate = async (newRole) => {
+    if (!roleEditTarget || !onUpdateRole) return;
+    setIsUpdatingRole(true);
+    const targetId = roleEditTarget.userId;
+    setRoleEditTarget(null);
+    try {
+      await onUpdateRole(targetId, newRole);
+    } catch (error) {
+    } finally {
+      setIsUpdatingRole(false);
+    }
+  };
+  const activeExpandedMember = expandedId ? members.find((m) => m.id === expandedId) : null;
+  useEffect24(() => {
+    if (!isOrg || !orgSlug || orgSlug === initialOrgSlug) {
+      setSlugAvailable(null);
+      setIsCheckingSlug(false);
+      return;
+    }
+    if (orgSlug.length < 3) {
+      setSlugAvailable(false);
+      setIsCheckingSlug(false);
+      return;
+    }
+    setIsCheckingSlug(true);
+    setSlugAvailable(null);
+    const checkTimer = setTimeout(async () => {
+      try {
+        if (onCheckSlugAvailability) {
+          const res = await onCheckSlugAvailability(orgSlug);
+          setSlugAvailable(res.available);
+        }
+      } catch (error) {
+        setSlugAvailable(null);
+      } finally {
+        setIsCheckingSlug(false);
+      }
+    }, 1500);
+    return () => clearTimeout(checkTimer);
+  }, [orgSlug, initialOrgSlug, onCheckSlugAvailability, isOrg]);
+  const handleSaveOrganization = async (e) => {
+    e.preventDefault();
+    if (isSavingOrg || isCheckingSlug || !canManage || !onSaveOrganization) return;
+    if (orgSlug !== initialOrgSlug && slugAvailable === false) return toast18.error("Address handle unavailable.");
+    setIsSavingOrg(true);
+    try {
+      let finalAvatarUrl = orgAvatarUrl;
+      if (pendingOrgAvatar && onUploadAvatar) {
+        setIsUploadingOrgAvatar(true);
+        try {
+          const res2 = await onUploadAvatar(pendingOrgAvatar, "ORGANIZATION");
+          if (res2?.url) {
+            finalAvatarUrl = res2.url;
+            setOrgAvatarUrl(finalAvatarUrl);
+          }
+        } catch (err) {
+          toast18.error("Failed to securely upload workspace avatar.");
+          setIsSavingOrg(false);
+          setIsUploadingOrgAvatar(false);
+          return;
+        }
+        setPendingOrgAvatar(null);
+        setIsUploadingOrgAvatar(false);
+      }
+      const res = await onSaveOrganization({ name: orgName, slug: orgSlug, avatarUrl: finalAvatarUrl });
+      if (res.success) toast18.success("Workspace updated successfully.");
+      else toast18.error(res.error || "Failed to update workspace.");
+    } catch (error) {
+      toast18.error("Service unavailable.");
+    } finally {
+      setIsSavingOrg(false);
+      setIsUploadingOrgAvatar(false);
+    }
+  };
+  const handleSaveProfile = async (e) => {
+    e.preventDefault();
+    if (isSavingProfile || !onSaveProfile) return;
+    setIsSavingProfile(true);
+    try {
+      let finalAvatarUrl = avatarUrl;
+      if (pendingUserAvatar && onUploadAvatar) {
+        setIsUploadingUserAvatar(true);
+        try {
+          const res2 = await onUploadAvatar(pendingUserAvatar, "USER");
+          if (res2?.url) {
+            finalAvatarUrl = res2.url;
+            setAvatarUrl(finalAvatarUrl);
+          }
+        } catch (err) {
+          toast18.error("Failed to securely upload profile avatar.");
+          setIsSavingProfile(false);
+          setIsUploadingUserAvatar(false);
+          return;
+        }
+        setPendingUserAvatar(null);
+        setIsUploadingUserAvatar(false);
+      }
+      const res = await onSaveProfile({ firstName, lastName, jobTitle, description, avatarUrl: finalAvatarUrl });
+      if (res.success) toast18.success("Identity updated successfully.");
+      else toast18.error(res.error || "Failed to update identity.");
+    } catch (error) {
+      toast18.error("Service unavailable.");
+    } finally {
+      setIsSavingProfile(false);
+      setIsUploadingUserAvatar(false);
+    }
+  };
+  const hasOrgChanges = orgName !== initialOrgName || orgSlug !== initialOrgSlug || orgAvatarUrl !== initialOrgAvatarUrl;
+  const isOrgSaveDisabled = isSavingOrg || !canManage || isCheckingSlug || !hasOrgChanges || orgName.length < 3 || orgSlug.length < 3 || orgSlug !== initialOrgSlug && slugAvailable === false;
+  const hasProfileChanges = `${firstName} ${lastName}`.trim() !== initialFullName || jobTitle !== initialJobTitle || description !== initialDescription || avatarUrl !== initialAvatarUrl;
+  const isProfileSaveDisabled = isSavingProfile || !hasProfileChanges || firstName.length < 2 || lastName.length < 2;
+  const tabs = [];
+  if (isOrg) {
+    tabs.push({ id: "MEMBERS", label: "Members" });
+    tabs.push({ id: "ORGANIZATION", label: "Organization" });
+  }
+  tabs.push({ id: "ACCOUNT", label: "Profile" });
+  return /* @__PURE__ */ React58.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ React58.createElement(ManagedToaster, null), /* @__PURE__ */ React58.createElement("div", { className: "flex flex-col gap-1 mb-8 px-1" }, /* @__PURE__ */ React58.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React58.createElement(
+    "button",
+    {
+      onClick: () => window.dispatchEvent(new Event("open-sidebar")),
+      className: "md:hidden flex shrink-0 items-center justify-center w-7 h-7 bg-white rounded-full text-black transition-all duration-300 outline-none hover:bg-stone-50",
+      "aria-label": "Open Menu"
+    },
+    /* @__PURE__ */ React58.createElement(HugeiconsIcon44, { icon: SidebarLeft01Icon3, size: 16 })
+  ), /* @__PURE__ */ React58.createElement("h1", { className: "text-black text-xl tracking-tight" }, "System Settings")), /* @__PURE__ */ React58.createElement("p", { className: "text-xs text-stone-500" }, "Manage your workspace identity, team configurations, and AI billing parameters.")), /* @__PURE__ */ React58.createElement("div", { className: "flex items-center mb-4 w-full animate-in fade-in duration-300 px-2" }, /* @__PURE__ */ React58.createElement("div", { className: "flex items-center bg-white rounded-full p-1 sm:p-1.5 max-w-full overflow-x-auto custom-scrollbar" }, tabs.map((tab, idx) => {
+    const isActive = activeTab === tab.id;
+    return /* @__PURE__ */ React58.createElement(
+      "button",
+      {
+        key: idx,
+        onClick: () => {
+          setActiveTab(tab.id);
+          if (tab.id === "MEMBERS") {
+            setExpandedId(null);
+            setIsInviteMode(false);
+          }
+        },
+        className: `px-4 py-1.5 rounded-full text-xs transition-all duration-200 outline-none whitespace-nowrap shrink-0 ${isActive ? "bg-stone-50 text-black" : "text-stone-500 hover:text-black hover:bg-stone-50/50"}`
+      },
+      tab.label
+    );
+  }))), activeTab === "MEMBERS" && isOrg && /* @__PURE__ */ React58.createElement("div", { className: "flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ React58.createElement(
+    ConfirmationDialog,
+    {
+      isOpen: !!memberToRemove,
+      title: "Remove Member",
+      message: `Are you sure you want to remove ${memberToRemove?.fullName}? This action cannot be undone.`,
+      confirmText: "Remove",
+      cancelText: "Cancel",
+      isProcessing: isRemoving,
+      isDestructive: true,
+      onClose: () => setMemberToRemove(null),
+      onConfirm: handleConfirmRemove
+    }
+  ), !isInviteMode && !activeExpandedMember && /* @__PURE__ */ React58.createElement("div", { className: "flex flex-row flex-nowrap mb-4 items-center justify-between gap-4 w-full px-1" }, /* @__PURE__ */ React58.createElement("div", { className: "relative flex-1 min-w-0 max-w-full" }, /* @__PURE__ */ React58.createElement("div", { className: "absolute inset-y-0 left-0 pl-4 flex items-center pointer-events-none" }, /* @__PURE__ */ React58.createElement(HugeiconsIcon44, { icon: Search01Icon9, size: 16, className: "text-stone-400" })), /* @__PURE__ */ React58.createElement("input", { type: "text", placeholder: "Search members...", value: localSearchQuery, onChange: (e) => setLocalSearchQuery(e.target.value), className: "w-full pl-10 pr-4 py-2 bg-white rounded-full text-sm text-black placeholder-stone-400 outline-none transition-colors focus:border-[#d97757]  border border-transparent " })), /* @__PURE__ */ React58.createElement("div", { className: "flex items-center gap-3 w-auto pb-0 shrink-0" }, /* @__PURE__ */ React58.createElement("button", { onClick: () => setIsStatusModalOpen(true), className: "flex items-center justify-center bg-white w-9 h-9 rounded-full text-stone-500 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React58.createElement(HugeiconsIcon44, { icon: SearchList02Icon4, size: 16 })), /* @__PURE__ */ React58.createElement("button", { onClick: () => setIsRoleModalOpen(true), className: "flex items-center justify-center bg-white w-9 h-9 rounded-full text-stone-500 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ React58.createElement(HugeiconsIcon44, { icon: ListSettingIcon4, size: 16 })))), /* @__PURE__ */ React58.createElement("div", { className: "flex flex-col gap-8 p-6 rounded-2xl bg-white w-full" }, activeExpandedMember ? /* @__PURE__ */ React58.createElement("div", { className: "flex flex-col animate-in fade-in zoom-in-95 duration-300 w-full" }, /* @__PURE__ */ React58.createElement("div", { className: "mb-6 flex w-full items-center" }, /* @__PURE__ */ React58.createElement(
+    "button",
+    {
+      onClick: () => setExpandedId(null),
+      disabled: isUpdatingRole,
+      className: "flex items-center gap-2 text-[#d97757] hover:text-[#d97757] transition-colors text-sm outline-none disabled:opacity-50"
+    },
+    /* @__PURE__ */ React58.createElement(HugeiconsIcon44, { icon: ArrowLeft01Icon23, size: 16 }),
+    " Back"
+  )), /* @__PURE__ */ React58.createElement("div", { className: "flex flex-col gap-1 mb-8" }, /* @__PURE__ */ React58.createElement("h2", { className: "text-black text-xl tracking-tight" }, "Member Profile"), /* @__PURE__ */ React58.createElement("p", { className: "text-xs text-stone-500" }, "View and manage this member's access privileges.")), /* @__PURE__ */ React58.createElement("div", { className: "flex items-center gap-4 mb-4" }, /* @__PURE__ */ React58.createElement(MemberAvatar5, { src: activeExpandedMember.avatarUrl, status: activeExpandedMember.status, sizeClass: "w-14 h-14" }), /* @__PURE__ */ React58.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ React58.createElement("span", { className: "text-sm text-black tracking-tight truncate" }, activeExpandedMember.fullName), /* @__PURE__ */ React58.createElement("div", { className: "flex items-center gap-2 mt-0.5" }, /* @__PURE__ */ React58.createElement("span", { className: "text-xs text-stone-500 capitalize" }, activeExpandedMember.role.toLowerCase()), canManage && (isUpdatingRole ? /* @__PURE__ */ React58.createElement(HugeiconsIcon44, { icon: Loading03Icon32, size: 12, className: "animate-spin text-stone-400 ml-1" }) : /* @__PURE__ */ React58.createElement(React58.Fragment, null, /* @__PURE__ */ React58.createElement("span", { className: "text-stone-300 text-xs px-0.5" }, "\u2022"), /* @__PURE__ */ React58.createElement("button", { onClick: () => setRoleEditTarget(activeExpandedMember), className: "text-xs text-[#d97757] hover:underline outline-none" }, "Edit"), /* @__PURE__ */ React58.createElement("span", { className: "text-stone-300 text-xs px-0.5" }, "\u2022"), /* @__PURE__ */ React58.createElement(
+    "button",
+    {
+      onClick: () => setMemberToRemove(activeExpandedMember),
+      disabled: isUpdatingRole,
+      className: "text-xs text-[#d97757] hover:underline outline-none disabled:opacity-50"
+    },
+    "Remove"
+  ))))))) : /* @__PURE__ */ React58.createElement(React58.Fragment, null, /* @__PURE__ */ React58.createElement("div", { className: "flex flex-col gap-1" }, /* @__PURE__ */ React58.createElement("div", { className: "flex flex-row items-center justify-between gap-4" }, /* @__PURE__ */ React58.createElement("h2", { className: "text-black text-xl tracking-tight" }, isInviteMode ? "Add Member" : "Team Directory"), !isInviteMode && canManage && /* @__PURE__ */ React58.createElement("button", { onClick: () => setIsInviteMode(true), className: "shrink-0 px-4 py-1.5 border border-stone-200 text-black text-xs tracking-wide rounded-full hover:bg-stone-50 transition-colors outline-none" }, "Invite Team")), !isInviteMode && /* @__PURE__ */ React58.createElement("p", { className: "text-xs text-stone-500" }, "Manage members and access controls across your organization.")), /* @__PURE__ */ React58.createElement("div", { className: "w-full overflow-hidden" }, isInviteMode ? /* @__PURE__ */ React58.createElement("form", { onSubmit: handleInviteSubmit, className: "flex flex-col gap-8 animate-in fade-in duration-300" }, /* @__PURE__ */ React58.createElement("div", { className: "space-y-1.5 mt-2" }, /* @__PURE__ */ React58.createElement("label", { className: "text-xs text-stone-400 tracking-[0.2em] block" }, "Email Address"), /* @__PURE__ */ React58.createElement("input", { type: "email", value: inviteEmail, onChange: (e) => setInviteEmail(cleanEmailId(e.target.value)), required: true, autoFocus: true, className: "w-full px-2 py-3 bg-transparent text-sm border-b border-stone-200 text-black outline-none focus:border-black transition-all duration-300", placeholder: "name@company.com" })), /* @__PURE__ */ React58.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ React58.createElement(ThreeDActionButton, { type: "submit", disabled: inviteEmail.length < 5 || isInviting, isLoading: isInviting, className: "w-full" }, "Send Invitation"), /* @__PURE__ */ React58.createElement("button", { type: "button", onClick: () => {
+    setIsInviteMode(false);
+    setInviteEmail("");
+  }, disabled: isInviting, className: "w-full flex items-center justify-center py-2.5 rounded-full border border-stone-200 text-black hover:bg-stone-50 transition-colors outline-none text-xs tracking-wide" }, "Cancel"))) : isMembersLoading || isTyping ? /* @__PURE__ */ React58.createElement(PageSpinner10, null) : /* @__PURE__ */ React58.createElement("div", { className: "flex flex-col min-w-0 animate-in fade-in duration-300" }, /* @__PURE__ */ React58.createElement("div", null, members.length === 0 ? /* @__PURE__ */ React58.createElement("p", { className: "text-xs text-stone-400 py-6 text-center" }, "No members found") : members.map((member) => /* @__PURE__ */ React58.createElement("div", { key: member.id, onClick: () => setExpandedId(member.id), className: "flex items-center justify-between py-3 hover:bg-stone-50 transition-colors cursor-pointer group min-w-0 px-3 -mx-3 rounded-xl" }, /* @__PURE__ */ React58.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ React58.createElement(MemberAvatar5, { src: member.avatarUrl, status: member.status }), /* @__PURE__ */ React58.createElement("div", { className: "min-w-0 flex-1 flex flex-col gap-0.5" }, /* @__PURE__ */ React58.createElement("p", { className: "text-sm text-black truncate" }, member.fullName), /* @__PURE__ */ React58.createElement("p", { className: "text-xs text-stone-500 capitalize truncate" }, member.role.toLowerCase())))))), /* @__PURE__ */ React58.createElement("div", { className: "flex items-center justify-between pt-6 mt-2 " }, /* @__PURE__ */ React58.createElement("span", { className: "text-xs text-stone-400 tracking-[0.2em]" }, "Page ", membersCurrentPage, " of ", membersTotalPages === 0 ? 1 : membersTotalPages), /* @__PURE__ */ React58.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React58.createElement("button", { onClick: () => onMembersPageChange(membersCurrentPage - 1), disabled: membersCurrentPage <= 1 || isMembersLoading, className: "p-2 bg-white border border-stone-200 rounded-full text-black hover:bg-stone-50 disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none" }, /* @__PURE__ */ React58.createElement(HugeiconsIcon44, { icon: ArrowLeft01Icon23, size: 14 })), /* @__PURE__ */ React58.createElement("button", { onClick: () => onMembersPageChange(membersCurrentPage + 1), disabled: membersCurrentPage >= membersTotalPages || isMembersLoading || membersTotalPages === 0, className: "p-2 bg-white border border-stone-200 rounded-full text-black hover:bg-stone-50 disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none" }, /* @__PURE__ */ React58.createElement(HugeiconsIcon44, { icon: ArrowRight01Icon18, size: 14 })))))))), /* @__PURE__ */ React58.createElement(ReusableOptions, { isOpen: isStatusModalOpen, onClose: () => setIsStatusModalOpen(false), title: "Status Filter", options: ["ALL", "ACTIVE", "BUSY", "OFFLINE", "AWAY"], selectedOption: activeStatusFilter, onSelect: (status) => onStatusFilterChange(status) }), /* @__PURE__ */ React58.createElement(ReusableOptions, { isOpen: isRoleModalOpen, onClose: () => setIsRoleModalOpen(false), title: "Role Filter", options: ["ALL", "OWNER", "ADMIN", "MANAGER", "MEMBER", "GUEST"], selectedOption: activeRoleFilter, onSelect: (role) => onRoleFilterChange(role) }), /* @__PURE__ */ React58.createElement(ReusableOptions, { isOpen: !!roleEditTarget, onClose: () => setRoleEditTarget(null), title: "Modify Access Role", options: ["ADMIN", "MANAGER", "MEMBER"], selectedOption: roleEditTarget?.role || "", onSelect: handleRoleUpdate })), activeTab === "ORGANIZATION" && isOrg && /* @__PURE__ */ React58.createElement("div", { className: "flex flex-col gap-8 animate-in rounded-2xl p-6 bg-white fade-in duration-300" }, /* @__PURE__ */ React58.createElement("div", { className: "flex items-start justify-between gap-4" }, /* @__PURE__ */ React58.createElement("div", { className: "flex items-center gap-4" }, /* @__PURE__ */ React58.createElement("div", { className: "relative group cursor-pointer shrink-0", onClick: () => canManage && !isSavingOrg ? orgFileInputRef.current?.click() : void 0 }, /* @__PURE__ */ React58.createElement(OrgAvatar3, { src: orgAvatarUrl, sizeClass: "w-14 h-14" }), canManage && /* @__PURE__ */ React58.createElement("div", { className: "absolute -bottom-1 -right-1 w-6 h-6 bg-white border border-stone-200 rounded-full flex items-center justify-center text-stone-500 group-hover:text-black transition-colors z-10" }, isUploadingOrgAvatar ? /* @__PURE__ */ React58.createElement(HugeiconsIcon44, { icon: Loading03Icon32, size: 12, className: "animate-spin" }) : /* @__PURE__ */ React58.createElement(HugeiconsIcon44, { icon: CloudUploadIcon2, size: 14 })), /* @__PURE__ */ React58.createElement("input", { type: "file", ref: orgFileInputRef, className: "hidden", accept: ".png, .jpg, .jpeg", onChange: (e) => handleFileSelect(e, "ORGANIZATION") })), /* @__PURE__ */ React58.createElement("div", null, /* @__PURE__ */ React58.createElement("h2", { className: "text-black text-xl mb-1 tracking-tight" }, "Workspace Details"), /* @__PURE__ */ React58.createElement("p", { className: "text-xs text-stone-500" }, "Manage your organizational identity and handles."))), !canManage && /* @__PURE__ */ React58.createElement("span", { className: "p-2 w-9 h-9 bg-stone-100 text-stone-400 rounded-full shrink-0" }, /* @__PURE__ */ React58.createElement(HugeiconsIcon44, { icon: CircleLock02Icon5, size: 18, className: "text-current" }))), /* @__PURE__ */ React58.createElement("form", { className: "flex flex-col gap-8 w-full max-w-5xl", onSubmit: handleSaveOrganization, autoComplete: "off" }, /* @__PURE__ */ React58.createElement(TextInput, { label: "Workspace Name", value: orgName, onChange: handleOrgNameChange, disabled: !canManage || isSavingOrg, placeholder: "Acme Corporation", maxLength: 50 }), /* @__PURE__ */ React58.createElement("div", { className: "space-y-1.5 relative w-full" }, /* @__PURE__ */ React58.createElement("label", { className: "text-xs text-stone-400 tracking-[0.2em] block" }, "Workspace Handle"), /* @__PURE__ */ React58.createElement("div", { className: "flex items-center relative w-full border-b border-stone-200 focus-within:border-black transition-all duration-300 overflow-hidden" }, /* @__PURE__ */ React58.createElement("input", { type: "text", value: orgSlug, disabled: !canManage || isSavingOrg, onChange: (e) => handleOrgSlugChange(e.target.value), spellCheck: "false", autoComplete: "off", className: "w-full pr-10 pl-0 py-3 text-sm bg-transparent text-black outline-none disabled:opacity-50 disabled:cursor-not-allowed", placeholder: "workspace-handle" }), /* @__PURE__ */ React58.createElement("div", { className: "absolute right-2 top-1/2 -translate-y-1/2" }, isCheckingSlug && /* @__PURE__ */ React58.createElement(InputSpinner4, null), !isCheckingSlug && canManage && orgSlug !== initialOrgSlug && orgSlug.length >= 3 && slugAvailable === false && /* @__PURE__ */ React58.createElement("span", { className: "inline-flex items-center justify-center w-4 h-4 rounded-full bg-[#d97757]/10" }, /* @__PURE__ */ React58.createElement("svg", { className: "w-2 h-2 text-[#d97757]", viewBox: "0 0 20 20", fill: "currentColor" }, /* @__PURE__ */ React58.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" }))), !isCheckingSlug && canManage && orgSlug !== initialOrgSlug && orgSlug.length >= 3 && slugAvailable === true && /* @__PURE__ */ React58.createElement("span", { className: "inline-flex items-center justify-center w-4 h-4 rounded-full bg-green-100" }, /* @__PURE__ */ React58.createElement("svg", { className: "w-2 h-2 text-green-600", viewBox: "0 0 20 20", fill: "currentColor" }, /* @__PURE__ */ React58.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M16.707 5.293a1 1 0 00-1.414 0L8 12.586 4.707 9.293a1 1 0 10-1.414 1.414l4 4a1 1 0 001.414 0l8-8a1 1 0 000-1.414z" })))))), /* @__PURE__ */ React58.createElement("div", { className: "pt-8 mt-2 flex items-center gap-4" }, /* @__PURE__ */ React58.createElement(ThreeDActionButton, { type: "submit", disabled: isOrgSaveDisabled, isLoading: isSavingOrg, className: "min-w-32" }, "Save Changes"), hasOrgChanges && !isSavingOrg && canManage && /* @__PURE__ */ React58.createElement("button", { type: "button", onClick: () => {
+    setOrgName(initialOrgName || "");
+    setOrgSlug(initialOrgSlug || "");
+    setOrgAvatarUrl(initialOrgAvatarUrl || "");
+    setPendingOrgAvatar(null);
+  }, className: "text-xs tracking-widest text-stone-400 hover:text-black transition-colors outline-none" }, "Cancel")))), activeTab === "ACCOUNT" && /* @__PURE__ */ React58.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in duration-300" }, /* @__PURE__ */ React58.createElement("div", { className: "flex flex-col gap-8 rounded-2xl p-6 bg-white w-full" }, /* @__PURE__ */ React58.createElement("div", { className: "flex items-start justify-between gap-4" }, /* @__PURE__ */ React58.createElement("div", { className: "flex items-center gap-4" }, /* @__PURE__ */ React58.createElement("div", { className: "relative group cursor-pointer shrink-0", onClick: () => !isSavingProfile ? userFileInputRef.current?.click() : void 0 }, /* @__PURE__ */ React58.createElement(MemberAvatar5, { src: avatarUrl, status: "ACTIVE", sizeClass: "w-14 h-14" }), /* @__PURE__ */ React58.createElement("div", { className: "absolute -bottom-1 -right-1 w-6 h-6 bg-white border border-stone-200 rounded-full flex items-center justify-center text-stone-500  group-hover:text-black transition-colors z-20" }, isUploadingUserAvatar ? /* @__PURE__ */ React58.createElement(HugeiconsIcon44, { icon: Loading03Icon32, size: 12, className: "animate-spin" }) : /* @__PURE__ */ React58.createElement(HugeiconsIcon44, { icon: CloudUploadIcon2, size: 14 })), /* @__PURE__ */ React58.createElement("input", { type: "file", ref: userFileInputRef, className: "hidden", accept: ".png, .jpg, .jpeg", onChange: (e) => handleFileSelect(e, "USER") })), /* @__PURE__ */ React58.createElement("div", null, /* @__PURE__ */ React58.createElement("h2", { className: "text-black text-xl mb-1 tracking-tight" }, "Personal Identity"), /* @__PURE__ */ React58.createElement("p", { className: "text-xs text-stone-500" }, "Update your system display name and contact email.")))), /* @__PURE__ */ React58.createElement("form", { className: "flex flex-col gap-6 w-full max-w-5xl", onSubmit: handleSaveProfile, autoComplete: "off" }, /* @__PURE__ */ React58.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-6" }, /* @__PURE__ */ React58.createElement(TextInput, { label: "First Name", value: firstName, onChange: (v) => setFirstName(v.replace(/[^a-zA-Z\s-]/g, "").substring(0, 50)), disabled: isSavingProfile, placeholder: "First name", maxLength: 50 }), /* @__PURE__ */ React58.createElement(TextInput, { label: "Last Name", value: lastName, onChange: (v) => setLastName(v.replace(/[^a-zA-Z\s-]/g, "").substring(0, 50)), disabled: isSavingProfile, placeholder: "Last name", maxLength: 50 })), /* @__PURE__ */ React58.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-6" }, /* @__PURE__ */ React58.createElement(TextInput, { label: "Job Title", value: jobTitle, onChange: (v) => setJobTitle(v.substring(0, 50)), disabled: isSavingProfile, placeholder: "e.g. HR Manager, CEO", maxLength: 50 }), /* @__PURE__ */ React58.createElement("div", { className: "space-y-1.5 w-full" }, /* @__PURE__ */ React58.createElement("label", { className: "text-xs text-stone-400 tracking-[0.2em] block" }, "Email Address"), /* @__PURE__ */ React58.createElement("input", { type: "email", value: initialEmail, disabled: true, className: "w-full pb-3 pt-3 text-sm bg-transparent text-stone-400 border-b border-stone-200 outline-none cursor-not-allowed" }))), /* @__PURE__ */ React58.createElement("div", { className: "space-y-1.5 w-full" }, /* @__PURE__ */ React58.createElement("label", { className: "text-xs text-stone-400 tracking-[0.2em] block" }, "About Me"), /* @__PURE__ */ React58.createElement(
+    "textarea",
+    {
+      value: description,
+      onChange: (e) => setDescription(e.target.value.substring(0, 300)),
+      disabled: isSavingProfile,
+      placeholder: "A short shout about yourself...",
+      className: "w-full pb-3 pt-3 text-sm bg-transparent text-black border-b border-stone-200 outline-none focus:border-[#d97757] transition-all duration-300 resize-none h-20 custom-scrollbar",
+      maxLength: 300
+    }
+  )), /* @__PURE__ */ React58.createElement("div", { className: "pt-4 flex items-center gap-4" }, /* @__PURE__ */ React58.createElement(ThreeDActionButton, { type: "submit", disabled: isProfileSaveDisabled, isLoading: isSavingProfile, className: "min-w-32" }, "Update Identity"))))));
+};
+
+// src/components/UniversalDeveloperSettings.tsx
+import React59, { useState as useState43, useEffect as useEffect25 } from "react";
+import { toast as toast19 } from "react-hot-toast";
+import { HugeiconsIcon as HugeiconsIcon45 } from "@hugeicons/react";
+import { SidebarLeft01Icon as SidebarLeft01Icon4 } from "@hugeicons/core-free-icons";
+var UniversalDeveloperSettings = ({
+  initialPublicKey,
+  initialWebhookUrl,
+  isReadOnly = false,
+  onGenerateKeys,
+  onSaveWebhook
+}) => {
+  const [publicKey, setPublicKey] = useState43(initialPublicKey);
+  const [webhookUrl, setWebhookUrl] = useState43(initialWebhookUrl);
+  const [isGenerating, setIsGenerating] = useState43(false);
+  const [isSavingWebhook, setIsSavingWebhook] = useState43(false);
+  const [isRollModalOpen, setIsRollModalOpen] = useState43(false);
+  useEffect25(() => {
+    setPublicKey(initialPublicKey || "");
+    setWebhookUrl(initialWebhookUrl || "");
+  }, [initialPublicKey, initialWebhookUrl]);
+  const handleWebhookChange = (val) => {
+    setWebhookUrl(val.trim());
+  };
+  const downloadEnvironmentFile = (pubKey, secKey) => {
+    const envContent = `AUDDITUR_PUBLIC_KEY="${pubKey}"
+AUDDITUR_SECRET_KEY="${secKey}"
+`;
+    const blob = new Blob([envContent], { type: "text/plain" });
+    const url = URL.createObjectURL(blob);
+    const link = document.createElement("a");
+    link.href = url;
+    link.download = "audditur_credentials.txt";
+    document.body.appendChild(link);
+    link.click();
+    document.body.removeChild(link);
+    URL.revokeObjectURL(url);
+  };
+  const handleGenerateKeys = async () => {
+    if (isGenerating || isReadOnly) return;
+    setIsGenerating(true);
+    try {
+      const res = await onGenerateKeys();
+      if (res.success && res.data) {
+        setPublicKey(res.data.publicKey);
+        downloadEnvironmentFile(res.data.publicKey, res.data.secretKey);
+        toast19.success("Keys generated. Check your downloads folder.");
+        setIsRollModalOpen(false);
+      } else {
+        toast19.error(res.error || "Uh oh! Something went wrong.");
+      }
+    } catch (error) {
+      toast19.error("Uh oh! Something went wrong.");
+    } finally {
+      setIsGenerating(false);
+    }
+  };
+  const handleSaveWebhook = async (e) => {
+    e.preventDefault();
+    if (isSavingWebhook || isReadOnly) return;
+    setIsSavingWebhook(true);
+    try {
+      const res = await onSaveWebhook(webhookUrl);
+      if (res.success && res.data) {
+        setWebhookUrl(res.data.webhookUrl || "");
+        toast19.success("Webhook URL updated.");
+      } else {
+        toast19.error(res.error || "Uh oh! Something went wrong.");
+      }
+    } catch (error) {
+      toast19.error("Uh oh! Something went wrong.");
+    } finally {
+      setIsSavingWebhook(false);
+    }
+  };
+  const hasWebhookChanges = webhookUrl !== initialWebhookUrl;
+  const isWebhookSaveDisabled = isSavingWebhook || isReadOnly || !hasWebhookChanges;
+  return /* @__PURE__ */ React59.createElement("div", { className: "flex flex-col max-w-3xl rounded-2xl p-6 bg-white gap-8 animate-in fade-in duration-300 min-h-full" }, /* @__PURE__ */ React59.createElement(ManagedToaster, null), /* @__PURE__ */ React59.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-3 sm:gap-4" }, /* @__PURE__ */ React59.createElement("div", { className: "flex flex-col min-w-0 gap-1" }, /* @__PURE__ */ React59.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React59.createElement(
+    "button",
+    {
+      onClick: () => window.dispatchEvent(new Event("open-sidebar")),
+      className: "md:hidden flex shrink-0 items-center justify-center w-7 h-7 bg-white rounded-full text-black transition-all duration-300 outline-none hover:bg-stone-50",
+      "aria-label": "Open Menu"
+    },
+    /* @__PURE__ */ React59.createElement(HugeiconsIcon45, { icon: SidebarLeft01Icon4, size: 16 })
+  ), /* @__PURE__ */ React59.createElement("h1", { className: "font-serif text-xl text-black truncate tracking-tight" }, "Developer Settings")), /* @__PURE__ */ React59.createElement("p", { className: "text-xs text-neutral-500 truncate" }, "Manage your API credentials and webhook integrations.")), isReadOnly && /* @__PURE__ */ React59.createElement("span", { className: "px-3 py-1 bg-neutral-50 text-neutral-500 rounded-full text-[10px] tracking-[0.2em] shrink-0 w-fit sm:mt-1" }, "Read Only Access")), /* @__PURE__ */ React59.createElement("div", { className: "w-full max-w-2xl flex flex-col gap-12" }, /* @__PURE__ */ React59.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ React59.createElement("div", { className: "space-y-2 min-w-0" }, /* @__PURE__ */ React59.createElement(
+    TextInput,
+    {
+      label: "Public Key",
+      value: publicKey || "No key generated yet",
+      onChange: () => {
+      },
+      disabled: true
+    }
+  ), /* @__PURE__ */ React59.createElement("p", { className: "text-[10px] text-neutral-400 mt-1 leading-snug" }, "Your public key is used to identify your application. Your secret key will only be shown once upon generation.")), /* @__PURE__ */ React59.createElement("div", { className: "flex items-center gap-4" }, /* @__PURE__ */ React59.createElement(
+    ThreeDActionButton,
+    {
+      onClick: () => {
+        if (publicKey) setIsRollModalOpen(true);
+        else handleGenerateKeys();
+      },
+      disabled: isGenerating || isReadOnly,
+      isLoading: isGenerating,
+      className: "w-fit"
+    },
+    publicKey ? "Roll API Keys" : "Generate Keys"
+  ))), /* @__PURE__ */ React59.createElement("form", { className: "flex flex-col gap-6 border-t border-neutral-100 pt-8", onSubmit: handleSaveWebhook, autoComplete: "off" }, /* @__PURE__ */ React59.createElement("div", { className: "space-y-2 min-w-0" }, /* @__PURE__ */ React59.createElement(
+    TextInput,
+    {
+      label: "Webhook URL",
+      value: webhookUrl,
+      onChange: handleWebhookChange,
+      disabled: isReadOnly || isSavingWebhook,
+      placeholder: "https://your-domain.com/webhook",
+      type: "url"
+    }
+  ), /* @__PURE__ */ React59.createElement("p", { className: "text-[10px] text-neutral-400 mt-1 leading-snug" }, "We will send secure POST requests to this endpoint when significant events occur. Must use HTTPS.")), /* @__PURE__ */ React59.createElement("div", { className: "flex flex-col sm:flex-row sm:items-center justify-between mt-2 gap-6 sm:gap-4" }, /* @__PURE__ */ React59.createElement("div", { className: "flex items-center gap-6 min-w-0" }, /* @__PURE__ */ React59.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React59.createElement("span", { className: "text-[10px] text-neutral-400 tracking-[0.2em] block truncate uppercase" }, "Webhook Status"), /* @__PURE__ */ React59.createElement("span", { className: `text-xs block truncate ${webhookUrl ? "text-emerald-600" : "text-neutral-400"}` }, webhookUrl ? "Active" : "Inactive"))), /* @__PURE__ */ React59.createElement("div", { className: "flex flex-col-reverse sm:flex-row items-center gap-3 sm:gap-4 w-full sm:w-auto shrink-0" }, hasWebhookChanges && !isSavingWebhook && !isReadOnly && /* @__PURE__ */ React59.createElement(
+    "button",
+    {
+      type: "button",
+      onClick: () => setWebhookUrl(initialWebhookUrl),
+      className: "text-[11px] tracking-widest text-neutral-500 hover:text-black transition-colors w-full sm:w-auto py-2 sm:py-0 outline-none"
+    },
+    "Cancel"
+  ), /* @__PURE__ */ React59.createElement(
+    ThreeDActionButton,
+    {
+      type: "submit",
+      disabled: isWebhookSaveDisabled,
+      isLoading: isSavingWebhook,
+      className: "min-w-32 w-full sm:w-auto"
+    },
+    "Save Webhook"
+  ))))), /* @__PURE__ */ React59.createElement(
+    ConfirmationDialog,
+    {
+      isOpen: isRollModalOpen && !isReadOnly,
+      title: "Roll API Keys",
+      message: "Are you sure you want to roll your keys? This will permanently invalidate your current secret key and active MCP tokens.",
+      confirmText: "Roll Keys",
+      cancelText: "Cancel",
+      isProcessing: isGenerating,
+      isDestructive: true,
+      onClose: () => !isGenerating && setIsRollModalOpen(false),
+      onConfirm: handleGenerateKeys
+    }
+  ));
+};
+
+// src/components/UniversalApplicationPage2.tsx
+import React60, { useState as useState44, useRef as useRef18 } from "react";
+import { HugeiconsIcon as HugeiconsIcon46 } from "@hugeicons/react";
+import {
+  Search01Icon as Search01Icon10,
+  SearchList02Icon as SearchList02Icon5,
+  SidebarLeft01Icon as SidebarLeft01Icon5
+} from "@hugeicons/core-free-icons";
+var UniversalApplicationPage2 = ({
+  userRole = "MEMBER",
+  applications,
+  isLoading,
+  currentPage,
+  totalPages,
+  onPageChange,
+  searchQuery,
+  onSearchChange,
+  activeStatusFilter,
+  onStatusFilterChange,
+  onApplicationClick,
+  onCreateApplication
+}) => {
+  const canManage = userRole === "ADMIN" || userRole === "MANAGER" || userRole === "OWNER";
+  const [showStatusModal, setShowStatusModal] = useState44(false);
+  const [localSearchQuery, setLocalSearchQuery] = useState44(searchQuery);
+  const typingTimer = useRef18(null);
+  const handleSearchInput = (e) => {
+    const val = e.target.value;
+    setLocalSearchQuery(val);
+    if (typingTimer.current) clearTimeout(typingTimer.current);
+    typingTimer.current = setTimeout(() => {
+      onSearchChange(val);
+    }, 600);
+  };
+  const APPLICATION_STATUSES = [
+    "ALL",
+    "DRAFT",
+    "COMPLETED",
+    "PENDING",
+    "REJECTED",
+    "QUERIED",
+    "AWAITING_PAYMENT"
+  ];
+  return /* @__PURE__ */ React60.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300 relative" }, /* @__PURE__ */ React60.createElement("div", { className: "flex flex-col gap-1 mb-8 px-1" }, /* @__PURE__ */ React60.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React60.createElement(
+    "button",
+    {
+      onClick: () => window.dispatchEvent(new Event("open-sidebar")),
+      className: "md:hidden flex shrink-0 items-center justify-center w-7 h-7 bg-white rounded-full text-black transition-all duration-300 outline-none hover:bg-stone-50",
+      "aria-label": "Open Menu"
+    },
+    /* @__PURE__ */ React60.createElement(HugeiconsIcon46, { icon: SidebarLeft01Icon5, size: 16 })
+  ), /* @__PURE__ */ React60.createElement("h1", { className: "text-black text-xl tracking-tight" }, "Applications Directory")), /* @__PURE__ */ React60.createElement("p", { className: "text-xs text-stone-500" }, "Search, filter, and track all your organizational applications.")), /* @__PURE__ */ React60.createElement("div", { className: "flex flex-row flex-nowrap mb-2 items-center justify-between gap-4 w-full px-1" }, /* @__PURE__ */ React60.createElement("div", { className: "relative flex-1 min-w-0 max-w-full" }, /* @__PURE__ */ React60.createElement("div", { className: "absolute inset-y-0 left-0 pl-4 flex items-center pointer-events-none" }, /* @__PURE__ */ React60.createElement(HugeiconsIcon46, { icon: Search01Icon10, size: 16, className: "text-stone-400" })), /* @__PURE__ */ React60.createElement(
+    "input",
+    {
+      type: "text",
+      placeholder: "Search applications...",
+      value: localSearchQuery,
+      onChange: handleSearchInput,
+      className: "w-full pl-10 pr-4 py-2.5 bg-white rounded-full text-sm text-black placeholder-stone-400 outline-none transition-colors focus:border-[#d97757] border border-transparent shadow-[0_2px_10px_rgba(0,0,0,0.02)]"
+    }
+  )), /* @__PURE__ */ React60.createElement("div", { className: "flex items-center gap-3 w-auto pb-0 shrink-0" }, /* @__PURE__ */ React60.createElement(
+    "button",
+    {
+      onClick: () => setShowStatusModal(true),
+      className: "flex items-center justify-center bg-white shadow-[0_2px_10px_rgba(0,0,0,0.02)] w-10 h-10 rounded-full text-stone-500 hover:text-black transition-colors outline-none relative"
+    },
+    /* @__PURE__ */ React60.createElement(HugeiconsIcon46, { icon: SearchList02Icon5, size: 18 }),
+    activeStatusFilter !== "ALL" && /* @__PURE__ */ React60.createElement("span", { className: "absolute top-2 right-2 w-2 h-2 bg-[#d97757] rounded-full border border-white" })
+  ))), /* @__PURE__ */ React60.createElement("div", { className: "w-full mt-2" }, /* @__PURE__ */ React60.createElement(
+    UniversalApplicationsPage,
+    {
+      headerTitle: "Recent Filings",
+      headerDescription: "",
+      applications,
+      isLoading,
+      currentPage,
+      totalPages,
+      onPageChange,
+      onApplicationClick,
+      onCreateApplication: canManage ? onCreateApplication : void 0
+    }
+  )), /* @__PURE__ */ React60.createElement(
+    ReusableOptions,
+    {
+      isOpen: showStatusModal,
+      onClose: () => setShowStatusModal(false),
+      title: "Filter by Status",
+      options: APPLICATION_STATUSES,
+      selectedOption: activeStatusFilter,
+      onSelect: (status) => {
+        onStatusFilterChange(status);
+        setShowStatusModal(false);
+      }
+    }
+  ));
+};
 export {
   AppBento2,
   CardInfoDialog,
@@ -6426,15 +7458,20 @@ export {
   PipleAuth,
   PlatformFeatures,
   PortfolioHero,
+  RootSidebar,
   TextInput,
   ThreeDActionButton,
   ThreeDButton,
+  UniversalApplicationPage2,
+  UniversalApplicationsPage,
   UniversalBuyCryptoPage,
   UniversalCardActionPage,
   UniversalCardPage,
   UniversalCreateHuddle,
+  UniversalDeveloperSettings,
   UniversalErrorView,
   UniversalHome2,
+  UniversalHome3,
   UniversalHomeView,
   UniversalHuddleDetails,
   UniversalHuddlesPage,
@@ -6446,6 +7483,7 @@ export {
   UniversalRewardPage,
   UniversalSecurityPage,
   UniversalSettings,
+  UniversalSettings2,
   UniversalSidebar,
   UniversalTransactionPage,
   UniversalVerificationPage,