@retinalabsllc/zairusjs 0.6.0 → 0.6.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.mts +15 -21
- package/dist/index.d.ts +15 -21
- package/dist/index.js +351 -356
- package/dist/index.mjs +329 -332
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -664,13 +664,13 @@ import React9, { useRef as useRef2, useState as useState4, useEffect as useEffec
|
|
|
664
664
|
import Image3 from "next/image";
|
|
665
665
|
import { HugeiconsIcon as HugeiconsIcon5 } from "@hugeicons/react";
|
|
666
666
|
import { ArrowLeft01Icon, ArrowRight01Icon, Loading03Icon as Loading03Icon2 } from "@hugeicons/core-free-icons";
|
|
667
|
-
var FeatureCard = ({ feature }) => {
|
|
667
|
+
var FeatureCard = ({ feature, bgImage }) => {
|
|
668
668
|
const [isBgLoading, setIsBgLoading] = useState4(true);
|
|
669
669
|
const [isFgLoading, setIsFgLoading] = useState4(!!feature.image);
|
|
670
670
|
return /* @__PURE__ */ React9.createElement("div", { className: "flex flex-col shrink-0 w-[90vw] sm:w-150 snap-center md:snap-start group cursor-grab active:cursor-grabbing" }, /* @__PURE__ */ React9.createElement("div", { className: "relative w-full aspect-16/10 bg-neutral-100 rounded-2xl overflow-hidden mb-6 flex items-center justify-center" }, /* @__PURE__ */ React9.createElement(
|
|
671
671
|
Image3,
|
|
672
672
|
{
|
|
673
|
-
src:
|
|
673
|
+
src: bgImage,
|
|
674
674
|
alt: "Card Background",
|
|
675
675
|
fill: true,
|
|
676
676
|
sizes: "(max-width: 768px) 90vw, 600px",
|
|
@@ -725,6 +725,11 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
725
725
|
scrollRef.current.scrollBy({ left: scrollAmount, behavior: "smooth" });
|
|
726
726
|
}
|
|
727
727
|
};
|
|
728
|
+
const bgImages = [
|
|
729
|
+
"/assets/webp/card-bg.webp",
|
|
730
|
+
"/assets/webp/card-bg2.webp",
|
|
731
|
+
"/assets/webp/card-bg3.webp"
|
|
732
|
+
];
|
|
728
733
|
return /* @__PURE__ */ React9.createElement("section", { className: "py-24 w-full flex justify-center relative z-10 overflow-hidden" }, /* @__PURE__ */ React9.createElement("div", { className: "max-w-6xl w-full flex flex-col px-4 md:px-8" }, /* @__PURE__ */ React9.createElement("div", { className: "flex flex-col md:flex-row md:items-end justify-between gap-6 mb-12" }, /* @__PURE__ */ React9.createElement("div", { className: "relative z-10 text-left" }, /* @__PURE__ */ React9.createElement("span", { className: "text-[10px] tracking-[0.4em] text-neutral-500 block mb-4" }, tagline), /* @__PURE__ */ React9.createElement("h2", { className: " font-serif text-3xl md:text-5xl tracking-tight text-black leading-[1.05]" }, headline)), /* @__PURE__ */ React9.createElement("div", { className: "hidden md:flex items-center gap-3" }, /* @__PURE__ */ React9.createElement(
|
|
729
734
|
"button",
|
|
730
735
|
{
|
|
@@ -750,7 +755,7 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
750
755
|
onScroll: checkScroll,
|
|
751
756
|
className: "flex gap-6 overflow-x-auto snap-x snap-mandatory [&::-webkit-scrollbar]:hidden [-ms-overflow-style:none] scrollbar-none pb-8 -mx-4 px-4 md:mx-0 md:px-0"
|
|
752
757
|
},
|
|
753
|
-
features.map((feature, idx) => /* @__PURE__ */ React9.createElement(FeatureCard, { key: idx, feature }))
|
|
758
|
+
features.slice(0, 3).map((feature, idx) => /* @__PURE__ */ React9.createElement(FeatureCard, { key: idx, feature, bgImage: bgImages[idx] }))
|
|
754
759
|
), /* @__PURE__ */ React9.createElement("div", { className: "flex md:hidden items-center justify-center gap-4 mt-2" }, /* @__PURE__ */ React9.createElement(
|
|
755
760
|
"button",
|
|
756
761
|
{
|
|
@@ -1444,13 +1449,35 @@ var GifFeatureCard = ({
|
|
|
1444
1449
|
import React25, { useState as useState9, useEffect as useEffect6 } from "react";
|
|
1445
1450
|
import Link9 from "next/link";
|
|
1446
1451
|
import { HugeiconsIcon as HugeiconsIcon13 } from "@hugeicons/react";
|
|
1447
|
-
import {
|
|
1452
|
+
import {
|
|
1453
|
+
SidebarLeft01Icon,
|
|
1454
|
+
CancelCircleIcon,
|
|
1455
|
+
UserIcon,
|
|
1456
|
+
CheckmarkCircle01Icon,
|
|
1457
|
+
LogoutCircle02Icon,
|
|
1458
|
+
ArrowLeft01Icon as ArrowLeft01Icon2
|
|
1459
|
+
} from "@hugeicons/core-free-icons";
|
|
1460
|
+
var ButtonSpinner = () => /* @__PURE__ */ React25.createElement("svg", { className: "animate-spin h-4 w-4 text-neutral-400", xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24" }, /* @__PURE__ */ React25.createElement("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }), /* @__PURE__ */ React25.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" }));
|
|
1448
1461
|
var UniversalSidebar = ({
|
|
1449
1462
|
navItems,
|
|
1450
1463
|
currentPath,
|
|
1451
1464
|
isMobileOpen,
|
|
1452
1465
|
closeMobile,
|
|
1466
|
+
openMobile,
|
|
1453
1467
|
onNavClick,
|
|
1468
|
+
// Header integrations
|
|
1469
|
+
title = "App",
|
|
1470
|
+
subtitle,
|
|
1471
|
+
homeUrl = "/app",
|
|
1472
|
+
showBackButton = false,
|
|
1473
|
+
backUrl = "/app",
|
|
1474
|
+
showWorkspaceSwitcher = false,
|
|
1475
|
+
workspaces = [],
|
|
1476
|
+
activeWorkspaceId,
|
|
1477
|
+
onSwitchWorkspace,
|
|
1478
|
+
showLogoutAction = false,
|
|
1479
|
+
onLogout,
|
|
1480
|
+
// Intercept
|
|
1454
1481
|
showInterceptDialog = false,
|
|
1455
1482
|
onCancelIntercept,
|
|
1456
1483
|
onConfirmIntercept,
|
|
@@ -1458,6 +1485,9 @@ var UniversalSidebar = ({
|
|
|
1458
1485
|
interceptMessage = "Are you sure you want to leave? All unsaved changes will be lost."
|
|
1459
1486
|
}) => {
|
|
1460
1487
|
const [isCollapsed, setIsCollapsed] = useState9(false);
|
|
1488
|
+
const [showSwitcherDialog, setShowSwitcherDialog] = useState9(false);
|
|
1489
|
+
const [showLogoutDialog, setShowLogoutDialog] = useState9(false);
|
|
1490
|
+
const [isLoggingOut, setIsLoggingOut] = useState9(false);
|
|
1461
1491
|
useEffect6(() => {
|
|
1462
1492
|
if (isMobileOpen) {
|
|
1463
1493
|
closeMobile();
|
|
@@ -1466,7 +1496,25 @@ var UniversalSidebar = ({
|
|
|
1466
1496
|
const hasActiveMatch = navItems.some(
|
|
1467
1497
|
(item) => item.path === "/mod" || item.path === "/app" ? currentPath === item.path : currentPath === item.path || currentPath?.startsWith(`${item.path}/`)
|
|
1468
1498
|
);
|
|
1499
|
+
const handleLogoutInitiation = async () => {
|
|
1500
|
+
if (isLoggingOut || !onLogout) return;
|
|
1501
|
+
setIsLoggingOut(true);
|
|
1502
|
+
try {
|
|
1503
|
+
await onLogout();
|
|
1504
|
+
} catch (error) {
|
|
1505
|
+
setIsLoggingOut(false);
|
|
1506
|
+
setShowLogoutDialog(false);
|
|
1507
|
+
}
|
|
1508
|
+
};
|
|
1469
1509
|
return /* @__PURE__ */ React25.createElement(React25.Fragment, null, /* @__PURE__ */ React25.createElement(
|
|
1510
|
+
"button",
|
|
1511
|
+
{
|
|
1512
|
+
onClick: openMobile,
|
|
1513
|
+
className: `md:hidden fixed top-4 left-4 z-40 w-10 h-10 bg-white rounded-full flex items-center justify-center shadow-[0_4px_20px_rgba(0,0,0,0.08)] border border-neutral-100 text-black transition-all duration-300 outline-none ${isMobileOpen ? "opacity-0 pointer-events-none scale-90" : "opacity-100 scale-100"}`,
|
|
1514
|
+
"aria-label": "Open Menu"
|
|
1515
|
+
},
|
|
1516
|
+
/* @__PURE__ */ React25.createElement(HugeiconsIcon13, { icon: SidebarLeft01Icon, size: 18 })
|
|
1517
|
+
), /* @__PURE__ */ React25.createElement(
|
|
1470
1518
|
"div",
|
|
1471
1519
|
{
|
|
1472
1520
|
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"}`,
|
|
@@ -1482,16 +1530,16 @@ var UniversalSidebar = ({
|
|
|
1482
1530
|
${isCollapsed ? "md:w-16 w-64" : "w-64"}
|
|
1483
1531
|
`
|
|
1484
1532
|
},
|
|
1485
|
-
/* @__PURE__ */ React25.createElement("div", { className: "
|
|
1533
|
+
/* @__PURE__ */ React25.createElement("div", { className: `flex items-center shrink-0 p-5 ${isCollapsed && !isMobileOpen ? "justify-center" : "justify-between"}` }, !isCollapsed || isMobileOpen ? /* @__PURE__ */ React25.createElement(Link9, { href: homeUrl, className: "flex flex-col justify-center outline-none group min-w-0 pr-2" }, /* @__PURE__ */ React25.createElement("span", { className: "text-[13px] font-serif text-black leading-none truncate tracking-wide mb-1 group-hover:opacity-70 transition-opacity" }, title), subtitle && /* @__PURE__ */ React25.createElement("span", { className: "text-[9px] text-neutral-500 truncate tracking-[0.2em] leading-none" }, subtitle)) : /* @__PURE__ */ React25.createElement(Link9, { href: homeUrl, className: "w-8 h-8 bg-neutral-100 rounded-full flex items-center justify-center text-black font-serif text-xs font-medium hover:opacity-70 transition-opacity outline-none" }, title.charAt(0).toUpperCase()), /* @__PURE__ */ React25.createElement("div", { className: "md:hidden flex shrink-0" }, /* @__PURE__ */ React25.createElement(
|
|
1486
1534
|
"button",
|
|
1487
1535
|
{
|
|
1488
1536
|
onClick: closeMobile,
|
|
1489
1537
|
className: "text-neutral-400 hover:text-black transition-colors outline-none",
|
|
1490
1538
|
"aria-label": "Close Menu"
|
|
1491
1539
|
},
|
|
1492
|
-
/* @__PURE__ */ React25.createElement(HugeiconsIcon13, { icon: CancelCircleIcon, size:
|
|
1493
|
-
)),
|
|
1494
|
-
/* @__PURE__ */ React25.createElement("nav", { className: "flex-1 py-
|
|
1540
|
+
/* @__PURE__ */ React25.createElement(HugeiconsIcon13, { icon: CancelCircleIcon, size: 24 })
|
|
1541
|
+
))),
|
|
1542
|
+
/* @__PURE__ */ React25.createElement("nav", { className: "flex-1 py-2 flex flex-col gap-1.5 px-3 overflow-y-auto custom-scrollbar" }, navItems.map((item, index) => {
|
|
1495
1543
|
const isExactOrSubMatch = item.path === "/mod" || item.path === "/app" ? currentPath === item.path : currentPath === item.path || currentPath?.startsWith(`${item.path}/`);
|
|
1496
1544
|
const isCurrentRoute = isExactOrSubMatch || !hasActiveMatch && index === 0;
|
|
1497
1545
|
return /* @__PURE__ */ React25.createElement(
|
|
@@ -1500,7 +1548,7 @@ var UniversalSidebar = ({
|
|
|
1500
1548
|
key: item.name,
|
|
1501
1549
|
href: item.path,
|
|
1502
1550
|
onClick: (e) => onNavClick ? onNavClick(e, item.path) : void 0,
|
|
1503
|
-
className: `flex items-center gap-3 px-3 py-2 rounded-full transition-all outline-none group ${isCurrentRoute ? "bg-neutral-100 text-black " : "text-neutral-500 hover:text-black hover:bg-neutral-50"}`,
|
|
1551
|
+
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"}`,
|
|
1504
1552
|
title: isCollapsed && !isMobileOpen ? item.name : void 0
|
|
1505
1553
|
},
|
|
1506
1554
|
/* @__PURE__ */ React25.createElement(
|
|
@@ -1514,7 +1562,31 @@ var UniversalSidebar = ({
|
|
|
1514
1562
|
(!isCollapsed || isMobileOpen) && /* @__PURE__ */ React25.createElement("span", { className: "text-xs tracking-wide truncate" }, item.name)
|
|
1515
1563
|
);
|
|
1516
1564
|
})),
|
|
1517
|
-
/* @__PURE__ */ React25.createElement("div", { className: "p-4
|
|
1565
|
+
/* @__PURE__ */ React25.createElement("div", { className: "p-4 shrink-0 flex flex-col gap-2 border-t border-neutral-100/50" }, (showBackButton || showWorkspaceSwitcher || showLogoutAction) && /* @__PURE__ */ React25.createElement("div", { className: `flex gap-2 px-1 pb-2 ${isCollapsed && !isMobileOpen ? "flex-col items-center" : "items-center"}` }, showBackButton && /* @__PURE__ */ React25.createElement(
|
|
1566
|
+
Link9,
|
|
1567
|
+
{
|
|
1568
|
+
href: backUrl,
|
|
1569
|
+
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 group",
|
|
1570
|
+
title: "Go Back"
|
|
1571
|
+
},
|
|
1572
|
+
/* @__PURE__ */ React25.createElement(HugeiconsIcon13, { icon: ArrowLeft01Icon2, size: 16, className: "transition-transform group-hover:-translate-x-0.5" })
|
|
1573
|
+
), showWorkspaceSwitcher && workspaces && workspaces.length > 0 && /* @__PURE__ */ React25.createElement(
|
|
1574
|
+
"button",
|
|
1575
|
+
{
|
|
1576
|
+
onClick: () => setShowSwitcherDialog(true),
|
|
1577
|
+
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",
|
|
1578
|
+
title: "Switch Workspace"
|
|
1579
|
+
},
|
|
1580
|
+
/* @__PURE__ */ React25.createElement(HugeiconsIcon13, { icon: UserIcon, size: 16 })
|
|
1581
|
+
), showLogoutAction && /* @__PURE__ */ React25.createElement(
|
|
1582
|
+
"button",
|
|
1583
|
+
{
|
|
1584
|
+
onClick: () => setShowLogoutDialog(true),
|
|
1585
|
+
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",
|
|
1586
|
+
title: "Secure Logout"
|
|
1587
|
+
},
|
|
1588
|
+
/* @__PURE__ */ React25.createElement(HugeiconsIcon13, { icon: LogoutCircle02Icon, size: 16 })
|
|
1589
|
+
)), /* @__PURE__ */ React25.createElement("div", { className: "hidden md:block" }, /* @__PURE__ */ React25.createElement(
|
|
1518
1590
|
"button",
|
|
1519
1591
|
{
|
|
1520
1592
|
onClick: () => setIsCollapsed(!isCollapsed),
|
|
@@ -1522,108 +1594,14 @@ var UniversalSidebar = ({
|
|
|
1522
1594
|
},
|
|
1523
1595
|
/* @__PURE__ */ React25.createElement(HugeiconsIcon13, { icon: SidebarLeft01Icon, size: 18, className: "shrink-0 text-neutral-400" }),
|
|
1524
1596
|
!isCollapsed && /* @__PURE__ */ React25.createElement("span", { className: "text-xs" }, "Collapse")
|
|
1525
|
-
))
|
|
1526
|
-
),
|
|
1527
|
-
"div",
|
|
1528
|
-
{
|
|
1529
|
-
className: "absolute inset-0 bg-black/30",
|
|
1530
|
-
onClick: onCancelIntercept
|
|
1531
|
-
}
|
|
1532
|
-
), /* @__PURE__ */ React25.createElement("div", { className: "relative w-72 bg-white rounded-2xl flex flex-col items-center overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React25.createElement("div", { className: "p-6 text-center w-full" }, /* @__PURE__ */ React25.createElement("h3", { className: " font-serif text-[17px] text-black tracking-tight mb-1" }, interceptTitle), /* @__PURE__ */ React25.createElement("p", { className: "text-[12px] text-neutral-500 leading-snug mt-2" }, interceptMessage)), /* @__PURE__ */ React25.createElement("div", { className: "w-full flex" }, /* @__PURE__ */ React25.createElement(
|
|
1533
|
-
"button",
|
|
1534
|
-
{
|
|
1535
|
-
onClick: onCancelIntercept,
|
|
1536
|
-
className: "flex-1 py-2 text-[13px] text-neutral-600 hover:bg-neutral-50 transition-colors outline-none"
|
|
1537
|
-
},
|
|
1538
|
-
"Cancel"
|
|
1539
|
-
), /* @__PURE__ */ React25.createElement(
|
|
1540
|
-
"button",
|
|
1541
|
-
{
|
|
1542
|
-
onClick: onConfirmIntercept,
|
|
1543
|
-
className: "flex-1 py-2 text-[13px] text-[#F16A50] hover:bg-neutral-50 transition-colors flex justify-center items-center outline-none"
|
|
1544
|
-
},
|
|
1545
|
-
"Leave"
|
|
1546
|
-
)))));
|
|
1547
|
-
};
|
|
1548
|
-
|
|
1549
|
-
// src/components/UniversalHeader.tsx
|
|
1550
|
-
import React26, { useState as useState10 } from "react";
|
|
1551
|
-
import Link10 from "next/link";
|
|
1552
|
-
import { HugeiconsIcon as HugeiconsIcon14 } from "@hugeicons/react";
|
|
1553
|
-
import {
|
|
1554
|
-
UserIcon,
|
|
1555
|
-
SidebarLeft01Icon as SidebarLeft01Icon2,
|
|
1556
|
-
CheckmarkCircle01Icon,
|
|
1557
|
-
LogoutCircle02Icon,
|
|
1558
|
-
ArrowLeft01Icon as ArrowLeft01Icon2
|
|
1559
|
-
} from "@hugeicons/core-free-icons";
|
|
1560
|
-
var ButtonSpinner = () => /* @__PURE__ */ React26.createElement("svg", { className: "animate-spin h-4 w-4 text-neutral-400", xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24" }, /* @__PURE__ */ React26.createElement("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }), /* @__PURE__ */ React26.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" }));
|
|
1561
|
-
var UniversalHeader = ({
|
|
1562
|
-
onOpenMobile,
|
|
1563
|
-
title,
|
|
1564
|
-
subtitle,
|
|
1565
|
-
homeUrl = "/app",
|
|
1566
|
-
showBackButton = false,
|
|
1567
|
-
backUrl = "/app",
|
|
1568
|
-
showWorkspaceSwitcher = false,
|
|
1569
|
-
workspaces = [],
|
|
1570
|
-
activeWorkspaceId,
|
|
1571
|
-
onSwitchWorkspace,
|
|
1572
|
-
showLogoutAction = false,
|
|
1573
|
-
onLogout
|
|
1574
|
-
}) => {
|
|
1575
|
-
const [showSwitcherDialog, setShowSwitcherDialog] = useState10(false);
|
|
1576
|
-
const [showLogoutDialog, setShowLogoutDialog] = useState10(false);
|
|
1577
|
-
const [isLoggingOut, setIsLoggingOut] = useState10(false);
|
|
1578
|
-
const handleLogoutInitiation = async () => {
|
|
1579
|
-
if (isLoggingOut || !onLogout) return;
|
|
1580
|
-
setIsLoggingOut(true);
|
|
1581
|
-
try {
|
|
1582
|
-
await onLogout();
|
|
1583
|
-
} catch (error) {
|
|
1584
|
-
setIsLoggingOut(false);
|
|
1585
|
-
setShowLogoutDialog(false);
|
|
1586
|
-
}
|
|
1587
|
-
};
|
|
1588
|
-
return /* @__PURE__ */ React26.createElement("div", { className: "w-full shrink-0 z-50 flex flex-col absolute top-0 left-0 pointer-events-none" }, /* @__PURE__ */ React26.createElement("div", { className: "w-full pointer-events-auto relative z-20" }, /* @__PURE__ */ React26.createElement("header", { className: "w-full pt-6 pb-3" }, /* @__PURE__ */ React26.createElement("div", { className: "max-w-7xl mx-auto px-6 flex justify-between items-center" }, /* @__PURE__ */ React26.createElement("div", { className: "flex items-center gap-4" }, /* @__PURE__ */ React26.createElement(
|
|
1589
|
-
"button",
|
|
1590
|
-
{
|
|
1591
|
-
className: "md:hidden bg-white rounded-full w-8 h-8 text-neutral-500 hover:text-black transition-colors outline-none",
|
|
1592
|
-
onClick: onOpenMobile,
|
|
1593
|
-
"aria-label": "Open Menu"
|
|
1594
|
-
},
|
|
1595
|
-
/* @__PURE__ */ React26.createElement(HugeiconsIcon14, { icon: SidebarLeft01Icon2, size: 16 })
|
|
1596
|
-
), /* @__PURE__ */ React26.createElement(Link10, { href: homeUrl, className: "flex items-center gap-3 transition-opacity hover:opacity-70 outline-none" }, /* @__PURE__ */ React26.createElement("div", { className: "flex flex-col justify-center" }, /* @__PURE__ */ React26.createElement("span", { className: "text-[13px] font-serif text-black leading-none truncate tracking-wide mb-1" }, title), subtitle && /* @__PURE__ */ React26.createElement("span", { className: "text-[9px] text-neutral-500 truncate tracking-[0.2em] leading-none" }, subtitle)))), /* @__PURE__ */ React26.createElement("div", { className: "flex items-center gap-3" }, showWorkspaceSwitcher && workspaces.length > 0 && /* @__PURE__ */ React26.createElement(
|
|
1597
|
-
"button",
|
|
1598
|
-
{
|
|
1599
|
-
onClick: () => setShowSwitcherDialog(true),
|
|
1600
|
-
className: "w-8 h-8 rounded-full bg-white flex items-center justify-center text-black transition-all group outline-none",
|
|
1601
|
-
"aria-label": "Switch Workspace"
|
|
1602
|
-
},
|
|
1603
|
-
/* @__PURE__ */ React26.createElement(HugeiconsIcon14, { icon: UserIcon, size: 16, className: "transition-transform group-hover:-translate-x-0.5" })
|
|
1604
|
-
), showLogoutAction && /* @__PURE__ */ React26.createElement(
|
|
1605
|
-
"button",
|
|
1606
|
-
{
|
|
1607
|
-
onClick: () => setShowLogoutDialog(true),
|
|
1608
|
-
className: "w-8 h-8 rounded-full bg-white flex items-center justify-center text-black transition-all group outline-none",
|
|
1609
|
-
"aria-label": "Secure Logout"
|
|
1610
|
-
},
|
|
1611
|
-
/* @__PURE__ */ React26.createElement(HugeiconsIcon14, { icon: LogoutCircle02Icon, size: 16, className: "transition-transform group-hover:-translate-x-0.5" })
|
|
1612
|
-
), showBackButton && /* @__PURE__ */ React26.createElement(
|
|
1613
|
-
Link10,
|
|
1614
|
-
{
|
|
1615
|
-
href: backUrl,
|
|
1616
|
-
className: "flex items-center bg-white justify-center w-8 h-8 rounded-full text-black transition-all group outline-none",
|
|
1617
|
-
"aria-label": "Go Back"
|
|
1618
|
-
},
|
|
1619
|
-
/* @__PURE__ */ React26.createElement(HugeiconsIcon14, { icon: ArrowLeft01Icon2, size: 16, className: "transition-transform group-hover:-translate-x-0.5" })
|
|
1620
|
-
))))), showSwitcherDialog && showWorkspaceSwitcher && workspaces.length > 0 && /* @__PURE__ */ React26.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React26.createElement(
|
|
1597
|
+
)))
|
|
1598
|
+
), showSwitcherDialog && showWorkspaceSwitcher && workspaces && workspaces.length > 0 && /* @__PURE__ */ React25.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React25.createElement(
|
|
1621
1599
|
"div",
|
|
1622
1600
|
{
|
|
1623
1601
|
className: "absolute inset-0 bg-black/30",
|
|
1624
1602
|
onClick: () => setShowSwitcherDialog(false)
|
|
1625
1603
|
}
|
|
1626
|
-
), /* @__PURE__ */
|
|
1604
|
+
), /* @__PURE__ */ React25.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__ */ React25.createElement("div", { className: "p-5 text-center w-full" }, /* @__PURE__ */ React25.createElement("h3", { className: " font-serif text-[17px] text-black tracking-tight mb-1" }, "Switch Workspace"), /* @__PURE__ */ React25.createElement("p", { className: "text-[11px] text-neutral-500 leading-snug" }, "Select an organization to switch your current context.")), /* @__PURE__ */ React25.createElement("div", { className: "max-h-75 overflow-y-auto w-full custom-scrollbar" }, workspaces.map((org) => /* @__PURE__ */ React25.createElement(
|
|
1627
1605
|
"button",
|
|
1628
1606
|
{
|
|
1629
1607
|
key: org.id,
|
|
@@ -1633,22 +1611,22 @@ var UniversalHeader = ({
|
|
|
1633
1611
|
},
|
|
1634
1612
|
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"
|
|
1635
1613
|
},
|
|
1636
|
-
/* @__PURE__ */
|
|
1637
|
-
activeWorkspaceId === org.id && /* @__PURE__ */
|
|
1638
|
-
))), /* @__PURE__ */
|
|
1614
|
+
/* @__PURE__ */ React25.createElement("div", { className: "flex flex-col truncate pr-4" }, /* @__PURE__ */ React25.createElement("span", { className: `text-[13px] truncate ${activeWorkspaceId === org.id ? "text-black" : "text-neutral-600 group-hover:text-black"}` }, org.name), /* @__PURE__ */ React25.createElement("span", { className: "text-[9px] text-neutral-400 tracking-[0.2em] mt-1" }, "Role: ", org.role)),
|
|
1615
|
+
activeWorkspaceId === org.id && /* @__PURE__ */ React25.createElement(HugeiconsIcon13, { icon: CheckmarkCircle01Icon, size: 16, className: "text-black shrink-0" })
|
|
1616
|
+
))), /* @__PURE__ */ React25.createElement("div", { className: "w-full flex mt-auto" }, /* @__PURE__ */ React25.createElement(
|
|
1639
1617
|
"button",
|
|
1640
1618
|
{
|
|
1641
1619
|
onClick: () => setShowSwitcherDialog(false),
|
|
1642
1620
|
className: "w-full py-2.5 text-[13px] text-neutral-600 hover:bg-neutral-50 transition-colors outline-none"
|
|
1643
1621
|
},
|
|
1644
1622
|
"Cancel"
|
|
1645
|
-
)))), showLogoutDialog && showLogoutAction && /* @__PURE__ */
|
|
1623
|
+
)))), showLogoutDialog && showLogoutAction && /* @__PURE__ */ React25.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React25.createElement(
|
|
1646
1624
|
"div",
|
|
1647
1625
|
{
|
|
1648
1626
|
className: "absolute inset-0 bg-black/30",
|
|
1649
1627
|
onClick: () => !isLoggingOut && setShowLogoutDialog(false)
|
|
1650
1628
|
}
|
|
1651
|
-
), /* @__PURE__ */
|
|
1629
|
+
), /* @__PURE__ */ React25.createElement("div", { className: "relative w-72 bg-white rounded-2xl flex flex-col items-center overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React25.createElement("div", { className: "p-6 text-center w-full" }, /* @__PURE__ */ React25.createElement("h3", { className: " font-serif text-[17px] text-black tracking-tight mb-1" }, "Secure Logout"), /* @__PURE__ */ React25.createElement("p", { className: "text-[12px] text-neutral-500 leading-snug mt-2" }, "Are you sure you want to log out? You will need to authenticate to return.")), /* @__PURE__ */ React25.createElement("div", { className: "w-full flex" }, /* @__PURE__ */ React25.createElement(
|
|
1652
1630
|
"button",
|
|
1653
1631
|
{
|
|
1654
1632
|
onClick: () => setShowLogoutDialog(false),
|
|
@@ -1656,21 +1634,41 @@ var UniversalHeader = ({
|
|
|
1656
1634
|
className: "flex-1 py-2 text-[13px] text-neutral-600 hover:bg-neutral-50 transition-colors disabled:opacity-50 outline-none"
|
|
1657
1635
|
},
|
|
1658
1636
|
"Cancel"
|
|
1659
|
-
), /* @__PURE__ */
|
|
1637
|
+
), /* @__PURE__ */ React25.createElement(
|
|
1660
1638
|
"button",
|
|
1661
1639
|
{
|
|
1662
1640
|
onClick: handleLogoutInitiation,
|
|
1663
1641
|
disabled: isLoggingOut,
|
|
1664
1642
|
className: "flex-1 py-2 text-[13px] text-[#F16A50] hover:bg-neutral-50 transition-colors disabled:opacity-50 flex justify-center items-center outline-none"
|
|
1665
1643
|
},
|
|
1666
|
-
isLoggingOut ? /* @__PURE__ */
|
|
1644
|
+
isLoggingOut ? /* @__PURE__ */ React25.createElement(ButtonSpinner, null) : "Log Out"
|
|
1645
|
+
)))), showInterceptDialog && /* @__PURE__ */ React25.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ React25.createElement(
|
|
1646
|
+
"div",
|
|
1647
|
+
{
|
|
1648
|
+
className: "absolute inset-0 bg-black/30",
|
|
1649
|
+
onClick: onCancelIntercept
|
|
1650
|
+
}
|
|
1651
|
+
), /* @__PURE__ */ React25.createElement("div", { className: "relative w-72 bg-white rounded-2xl flex flex-col items-center overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React25.createElement("div", { className: "p-6 text-center w-full" }, /* @__PURE__ */ React25.createElement("h3", { className: " font-serif text-[17px] text-black tracking-tight mb-1" }, interceptTitle), /* @__PURE__ */ React25.createElement("p", { className: "text-[12px] text-neutral-500 leading-snug mt-2" }, interceptMessage)), /* @__PURE__ */ React25.createElement("div", { className: "w-full flex" }, /* @__PURE__ */ React25.createElement(
|
|
1652
|
+
"button",
|
|
1653
|
+
{
|
|
1654
|
+
onClick: onCancelIntercept,
|
|
1655
|
+
className: "flex-1 py-2 text-[13px] text-neutral-600 hover:bg-neutral-50 transition-colors outline-none"
|
|
1656
|
+
},
|
|
1657
|
+
"Cancel"
|
|
1658
|
+
), /* @__PURE__ */ React25.createElement(
|
|
1659
|
+
"button",
|
|
1660
|
+
{
|
|
1661
|
+
onClick: onConfirmIntercept,
|
|
1662
|
+
className: "flex-1 py-2 text-[13px] text-[#F16A50] hover:bg-neutral-50 transition-colors flex justify-center items-center outline-none"
|
|
1663
|
+
},
|
|
1664
|
+
"Leave"
|
|
1667
1665
|
)))));
|
|
1668
1666
|
};
|
|
1669
1667
|
|
|
1670
1668
|
// src/components/UniversalOrganizationPage.tsx
|
|
1671
|
-
import
|
|
1669
|
+
import React26, { useState as useState10, useEffect as useEffect7 } from "react";
|
|
1672
1670
|
import toast2 from "react-hot-toast";
|
|
1673
|
-
var InputSpinner2 = () => /* @__PURE__ */
|
|
1671
|
+
var InputSpinner2 = () => /* @__PURE__ */ React26.createElement("svg", { className: "animate-spin h-4 w-4 text-neutral-400", xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24" }, /* @__PURE__ */ React26.createElement("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }), /* @__PURE__ */ React26.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" }));
|
|
1674
1672
|
var UniversalOrganizationPage = ({
|
|
1675
1673
|
initialOrgName,
|
|
1676
1674
|
initialSlug,
|
|
@@ -1680,11 +1678,11 @@ var UniversalOrganizationPage = ({
|
|
|
1680
1678
|
onSaveConfiguration,
|
|
1681
1679
|
onCheckSlugAvailability
|
|
1682
1680
|
}) => {
|
|
1683
|
-
const [orgName, setOrgName] =
|
|
1684
|
-
const [slug, setSlug] =
|
|
1685
|
-
const [isCheckingSlug, setIsCheckingSlug] =
|
|
1686
|
-
const [slugAvailable, setSlugAvailable] =
|
|
1687
|
-
const [isSubmitting, setIsSubmitting] =
|
|
1681
|
+
const [orgName, setOrgName] = useState10(initialOrgName);
|
|
1682
|
+
const [slug, setSlug] = useState10(initialSlug);
|
|
1683
|
+
const [isCheckingSlug, setIsCheckingSlug] = useState10(false);
|
|
1684
|
+
const [slugAvailable, setSlugAvailable] = useState10(null);
|
|
1685
|
+
const [isSubmitting, setIsSubmitting] = useState10(false);
|
|
1688
1686
|
useEffect7(() => {
|
|
1689
1687
|
setOrgName(initialOrgName || "");
|
|
1690
1688
|
setSlug(initialSlug || "");
|
|
@@ -1749,7 +1747,7 @@ var UniversalOrganizationPage = ({
|
|
|
1749
1747
|
};
|
|
1750
1748
|
const hasChanges = orgName !== initialOrgName || slug !== initialSlug;
|
|
1751
1749
|
const isSaveDisabled = isSubmitting || isReadOnly || isCheckingSlug || !hasChanges || orgName.length < 3 || slug.length < 3 || slug !== initialSlug && slugAvailable === false;
|
|
1752
|
-
return /* @__PURE__ */
|
|
1750
|
+
return /* @__PURE__ */ React26.createElement("div", { className: "flex flex-col gap-8 animate-in max-w-3xl rounded-2xl p-6 bg-white fade-in duration-300 " }, /* @__PURE__ */ React26.createElement(ManagedToaster, null), /* @__PURE__ */ React26.createElement("div", { className: "flex items-start justify-between gap-4" }, /* @__PURE__ */ React26.createElement("div", null, /* @__PURE__ */ React26.createElement("h1", { className: " font-serif text-xl text-black mb-1 tracking-tight" }, "Organization"), /* @__PURE__ */ React26.createElement("p", { className: "text-xs text-neutral-500" }, "Manage your tenant workspace details and identity.")), isReadOnly && /* @__PURE__ */ React26.createElement("span", { className: "px-3 py-1 bg-neutral-50 text-neutral-500 rounded-full text-[10px] tracking-[0.2em] shrink-0" }, "Read Only Access")), /* @__PURE__ */ React26.createElement("div", { className: "w-full max-w-2xl" }, /* @__PURE__ */ React26.createElement("form", { className: "flex flex-col gap-8", onSubmit: handleSave, autoComplete: "off" }, /* @__PURE__ */ React26.createElement(
|
|
1753
1751
|
TextInput,
|
|
1754
1752
|
{
|
|
1755
1753
|
label: "Organization Name",
|
|
@@ -1759,7 +1757,7 @@ var UniversalOrganizationPage = ({
|
|
|
1759
1757
|
placeholder: "Acme Corporation",
|
|
1760
1758
|
maxLength: 50
|
|
1761
1759
|
}
|
|
1762
|
-
), /* @__PURE__ */
|
|
1760
|
+
), /* @__PURE__ */ React26.createElement("div", { className: "space-y-2 relative w-full" }, /* @__PURE__ */ React26.createElement("label", { className: "text-[10px] text-neutral-400 tracking-[0.2em] block uppercase" }, "Organization Slug"), /* @__PURE__ */ React26.createElement("div", { className: "flex items-center relative w-full" }, /* @__PURE__ */ React26.createElement("span", { className: "text-neutral-400 text-sm py-3 pr-2 border-b border-neutral-100 shrink-0" }, slugPrefixUrl), /* @__PURE__ */ React26.createElement(
|
|
1763
1761
|
"input",
|
|
1764
1762
|
{
|
|
1765
1763
|
type: "text",
|
|
@@ -1771,7 +1769,7 @@ var UniversalOrganizationPage = ({
|
|
|
1771
1769
|
className: "w-full px-2 py-3 text-sm bg-transparent border-b border-neutral-100 text-black transition-all outline-none focus:border-black pr-8 disabled:opacity-50 disabled:cursor-not-allowed",
|
|
1772
1770
|
placeholder: "acme-corp"
|
|
1773
1771
|
}
|
|
1774
|
-
), /* @__PURE__ */
|
|
1772
|
+
), /* @__PURE__ */ React26.createElement("div", { className: "absolute right-2 top-1/2 -translate-y-1/2" }, isCheckingSlug && /* @__PURE__ */ React26.createElement(InputSpinner2, null), !isCheckingSlug && !isReadOnly && slug !== initialSlug && slug.length >= 3 && slugAvailable === false && /* @__PURE__ */ React26.createElement("span", { className: "inline-flex items-center justify-center w-4 h-4 rounded-full bg-red-100" }, /* @__PURE__ */ React26.createElement("svg", { className: "w-2 h-2 text-red-600", viewBox: "0 0 20 20", fill: "currentColor" }, /* @__PURE__ */ React26.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 && !isReadOnly && slug !== initialSlug && slug.length >= 3 && slugAvailable === true && /* @__PURE__ */ React26.createElement("span", { className: "inline-flex items-center justify-center w-4 h-4 rounded-full bg-green-100" }, /* @__PURE__ */ React26.createElement("svg", { className: "w-2 h-2 text-green-600", viewBox: "0 0 20 20", fill: "currentColor" }, /* @__PURE__ */ React26.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__ */ React26.createElement("div", { className: "pt-8 mt-2 flex items-center gap-4" }, /* @__PURE__ */ React26.createElement(
|
|
1775
1773
|
ThreeDActionButton,
|
|
1776
1774
|
{
|
|
1777
1775
|
type: "submit",
|
|
@@ -1780,7 +1778,7 @@ var UniversalOrganizationPage = ({
|
|
|
1780
1778
|
className: "min-w-32"
|
|
1781
1779
|
},
|
|
1782
1780
|
"Save Changes"
|
|
1783
|
-
), hasChanges && !isSubmitting && !isReadOnly && /* @__PURE__ */
|
|
1781
|
+
), hasChanges && !isSubmitting && !isReadOnly && /* @__PURE__ */ React26.createElement(
|
|
1784
1782
|
"button",
|
|
1785
1783
|
{
|
|
1786
1784
|
type: "button",
|
|
@@ -1795,9 +1793,9 @@ var UniversalOrganizationPage = ({
|
|
|
1795
1793
|
};
|
|
1796
1794
|
|
|
1797
1795
|
// src/components/UniversalIdentityPage.tsx
|
|
1798
|
-
import
|
|
1796
|
+
import React27, { useState as useState11, useEffect as useEffect8 } from "react";
|
|
1799
1797
|
import toast3 from "react-hot-toast";
|
|
1800
|
-
var ButtonSpinner2 = () => /* @__PURE__ */
|
|
1798
|
+
var ButtonSpinner2 = () => /* @__PURE__ */ React27.createElement("svg", { className: "animate-spin h-4 w-4 text-neutral-400", xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24" }, /* @__PURE__ */ React27.createElement("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }), /* @__PURE__ */ React27.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" }));
|
|
1801
1799
|
var UniversalIdentityPage = ({
|
|
1802
1800
|
headerTitle,
|
|
1803
1801
|
headerDescription,
|
|
@@ -1813,11 +1811,11 @@ var UniversalIdentityPage = ({
|
|
|
1813
1811
|
onDeleteResource,
|
|
1814
1812
|
onSuccessfulDeleteRedirect = "/app"
|
|
1815
1813
|
}) => {
|
|
1816
|
-
const [primaryValue, setPrimaryValue] =
|
|
1817
|
-
const [secondaryValue, setSecondaryValue] =
|
|
1818
|
-
const [isSubmitting, setIsSubmitting] =
|
|
1819
|
-
const [isDeleteModalOpen, setIsDeleteModalOpen] =
|
|
1820
|
-
const [isDeleting, setIsDeleting] =
|
|
1814
|
+
const [primaryValue, setPrimaryValue] = useState11(initialPrimaryValue);
|
|
1815
|
+
const [secondaryValue, setSecondaryValue] = useState11(initialSecondaryValue);
|
|
1816
|
+
const [isSubmitting, setIsSubmitting] = useState11(false);
|
|
1817
|
+
const [isDeleteModalOpen, setIsDeleteModalOpen] = useState11(false);
|
|
1818
|
+
const [isDeleting, setIsDeleting] = useState11(false);
|
|
1821
1819
|
useEffect8(() => {
|
|
1822
1820
|
setPrimaryValue(initialPrimaryValue || "");
|
|
1823
1821
|
setSecondaryValue(initialSecondaryValue || "");
|
|
@@ -1869,7 +1867,7 @@ var UniversalIdentityPage = ({
|
|
|
1869
1867
|
};
|
|
1870
1868
|
const hasChanges = primaryValue !== initialPrimaryValue || secondaryValue !== initialSecondaryValue;
|
|
1871
1869
|
const isSaveDisabled = isSubmitting || isReadOnly || !hasChanges || primaryValue.trim().length < 3;
|
|
1872
|
-
return /* @__PURE__ */
|
|
1870
|
+
return /* @__PURE__ */ React27.createElement("div", { className: "flex flex-col gap-8 animate-in max-w-3xl rounded-2xl p-6 bg-white fade-in duration-300 " }, /* @__PURE__ */ React27.createElement(ManagedToaster, null), /* @__PURE__ */ React27.createElement("div", { className: "flex items-start justify-between gap-4" }, /* @__PURE__ */ React27.createElement("div", null, /* @__PURE__ */ React27.createElement("h1", { className: " font-serif text-xl text-black mb-1 tracking-tight" }, headerTitle), /* @__PURE__ */ React27.createElement("p", { className: "text-xs text-neutral-500" }, headerDescription)), isReadOnly && /* @__PURE__ */ React27.createElement("span", { className: "px-3 py-1 bg-neutral-50 text-neutral-500 rounded-full text-[10px] tracking-[0.2em] shrink-0" }, "Read Only Access")), /* @__PURE__ */ React27.createElement("div", { className: "w-full max-w-2xl" }, /* @__PURE__ */ React27.createElement("form", { className: "flex flex-col gap-8", onSubmit: handleSave, autoComplete: "off" }, /* @__PURE__ */ React27.createElement(
|
|
1873
1871
|
TextInput,
|
|
1874
1872
|
{
|
|
1875
1873
|
label: primaryInputLabel,
|
|
@@ -1878,7 +1876,7 @@ var UniversalIdentityPage = ({
|
|
|
1878
1876
|
disabled: isReadOnly || isSubmitting,
|
|
1879
1877
|
maxLength: 50
|
|
1880
1878
|
}
|
|
1881
|
-
), secondaryInputLabel && /* @__PURE__ */
|
|
1879
|
+
), secondaryInputLabel && /* @__PURE__ */ React27.createElement(
|
|
1882
1880
|
TextInput,
|
|
1883
1881
|
{
|
|
1884
1882
|
label: secondaryInputLabel,
|
|
@@ -1887,7 +1885,7 @@ var UniversalIdentityPage = ({
|
|
|
1887
1885
|
disabled: isReadOnly || isSubmitting,
|
|
1888
1886
|
maxLength: 150
|
|
1889
1887
|
}
|
|
1890
|
-
), !isReadOnly && /* @__PURE__ */
|
|
1888
|
+
), !isReadOnly && /* @__PURE__ */ React27.createElement("div", { className: "pt-8 mt-2 flex flex-col sm:flex-row sm:items-center justify-between gap-6" }, /* @__PURE__ */ React27.createElement("div", { className: "flex items-center gap-4 w-full sm:w-auto" }, /* @__PURE__ */ React27.createElement(
|
|
1891
1889
|
ThreeDActionButton,
|
|
1892
1890
|
{
|
|
1893
1891
|
type: "submit",
|
|
@@ -1896,7 +1894,7 @@ var UniversalIdentityPage = ({
|
|
|
1896
1894
|
className: "min-w-32 w-full sm:w-auto"
|
|
1897
1895
|
},
|
|
1898
1896
|
"Save Changes"
|
|
1899
|
-
), hasChanges && !isSubmitting && /* @__PURE__ */
|
|
1897
|
+
), hasChanges && !isSubmitting && /* @__PURE__ */ React27.createElement(
|
|
1900
1898
|
"button",
|
|
1901
1899
|
{
|
|
1902
1900
|
type: "button",
|
|
@@ -1907,7 +1905,7 @@ var UniversalIdentityPage = ({
|
|
|
1907
1905
|
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"
|
|
1908
1906
|
},
|
|
1909
1907
|
"Cancel"
|
|
1910
|
-
)), allowDeletion && /* @__PURE__ */
|
|
1908
|
+
)), allowDeletion && /* @__PURE__ */ React27.createElement(
|
|
1911
1909
|
"button",
|
|
1912
1910
|
{
|
|
1913
1911
|
type: "button",
|
|
@@ -1916,7 +1914,7 @@ var UniversalIdentityPage = ({
|
|
|
1916
1914
|
},
|
|
1917
1915
|
"Delete ",
|
|
1918
1916
|
headerTitle.split(" ")[0]
|
|
1919
|
-
)))), isDeleteModalOpen && !isReadOnly && allowDeletion && /* @__PURE__ */
|
|
1917
|
+
)))), isDeleteModalOpen && !isReadOnly && allowDeletion && /* @__PURE__ */ React27.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ React27.createElement("div", { className: "absolute inset-0 bg-black/30 shadow-2xl", onClick: () => !isDeleting && setIsDeleteModalOpen(false) }), /* @__PURE__ */ React27.createElement("div", { className: "relative w-72 bg-white shadow-2xl rounded-2xl flex flex-col items-center overflow-hidden animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React27.createElement("div", { className: "p-6 text-center w-full" }, /* @__PURE__ */ React27.createElement("h3", { className: " font-serif text-[17px] text-black tracking-tight mb-1" }, "Confirm Deletion"), /* @__PURE__ */ React27.createElement("p", { className: "text-[12px] text-neutral-500 leading-snug mt-2" }, deleteWarningText)), /* @__PURE__ */ React27.createElement("div", { className: "w-full flex" }, /* @__PURE__ */ React27.createElement(
|
|
1920
1918
|
"button",
|
|
1921
1919
|
{
|
|
1922
1920
|
type: "button",
|
|
@@ -1925,7 +1923,7 @@ var UniversalIdentityPage = ({
|
|
|
1925
1923
|
className: "flex-1 py-2 text-[13px] text-neutral-600 hover:bg-neutral-50 transition-colors disabled:opacity-50 outline-none"
|
|
1926
1924
|
},
|
|
1927
1925
|
"Cancel"
|
|
1928
|
-
), /* @__PURE__ */
|
|
1926
|
+
), /* @__PURE__ */ React27.createElement(
|
|
1929
1927
|
"button",
|
|
1930
1928
|
{
|
|
1931
1929
|
type: "button",
|
|
@@ -1933,14 +1931,14 @@ var UniversalIdentityPage = ({
|
|
|
1933
1931
|
disabled: isDeleting,
|
|
1934
1932
|
className: "flex-1 py-2 text-[13px] text-red-600 hover:bg-neutral-50 transition-colors disabled:opacity-50 flex justify-center items-center outline-none"
|
|
1935
1933
|
},
|
|
1936
|
-
isDeleting ? /* @__PURE__ */
|
|
1934
|
+
isDeleting ? /* @__PURE__ */ React27.createElement(ButtonSpinner2, null) : "Delete"
|
|
1937
1935
|
)))));
|
|
1938
1936
|
};
|
|
1939
1937
|
|
|
1940
1938
|
// src/components/UniversalMembersPage.tsx
|
|
1941
|
-
import
|
|
1939
|
+
import React28, { useState as useState12, useEffect as useEffect9, useRef as useRef4 } from "react";
|
|
1942
1940
|
import toast4 from "react-hot-toast";
|
|
1943
|
-
import { HugeiconsIcon as
|
|
1941
|
+
import { HugeiconsIcon as HugeiconsIcon14 } from "@hugeicons/react";
|
|
1944
1942
|
import {
|
|
1945
1943
|
UserAdd01Icon,
|
|
1946
1944
|
ArrowLeft01Icon as ArrowLeft01Icon3,
|
|
@@ -1949,8 +1947,8 @@ import {
|
|
|
1949
1947
|
ArrowDown01Icon as ArrowDown01Icon2,
|
|
1950
1948
|
Loading03Icon as Loading03Icon6
|
|
1951
1949
|
} from "@hugeicons/core-free-icons";
|
|
1952
|
-
var ButtonSpinner3 = () => /* @__PURE__ */
|
|
1953
|
-
var PageSpinner2 = () => /* @__PURE__ */
|
|
1950
|
+
var ButtonSpinner3 = () => /* @__PURE__ */ React28.createElement(HugeiconsIcon14, { icon: Loading03Icon6, size: 16, className: "animate-spin text-white" });
|
|
1951
|
+
var PageSpinner2 = () => /* @__PURE__ */ React28.createElement("div", { className: "flex justify-center items-center py-12" }, /* @__PURE__ */ React28.createElement(HugeiconsIcon14, { icon: Loading03Icon6, size: 32, className: "animate-spin mb-4 text-black" }));
|
|
1954
1952
|
var getInitials = (name) => {
|
|
1955
1953
|
if (!name) return "U";
|
|
1956
1954
|
const parts = name.trim().split(" ");
|
|
@@ -1993,16 +1991,16 @@ var UniversalMembersPage = ({
|
|
|
1993
1991
|
onRemoveMember,
|
|
1994
1992
|
onUpdateRole
|
|
1995
1993
|
}) => {
|
|
1996
|
-
const [currentView, setCurrentView] =
|
|
1997
|
-
const [selectedMember, setSelectedMember] =
|
|
1998
|
-
const [inviteEmail, setInviteEmail] =
|
|
1999
|
-
const [inviteFirst, setInviteFirst] =
|
|
2000
|
-
const [inviteLast, setInviteLast] =
|
|
2001
|
-
const [isInviting, setIsInviting] =
|
|
2002
|
-
const [isRoleModalOpen, setIsRoleModalOpen] =
|
|
2003
|
-
const [isUpdatingRole, setIsUpdatingRole] =
|
|
2004
|
-
const [memberToDelete, setMemberToDelete] =
|
|
2005
|
-
const [isDeleting, setIsDeleting] =
|
|
1994
|
+
const [currentView, setCurrentView] = useState12("list");
|
|
1995
|
+
const [selectedMember, setSelectedMember] = useState12(null);
|
|
1996
|
+
const [inviteEmail, setInviteEmail] = useState12("");
|
|
1997
|
+
const [inviteFirst, setInviteFirst] = useState12("");
|
|
1998
|
+
const [inviteLast, setInviteLast] = useState12("");
|
|
1999
|
+
const [isInviting, setIsInviting] = useState12(false);
|
|
2000
|
+
const [isRoleModalOpen, setIsRoleModalOpen] = useState12(false);
|
|
2001
|
+
const [isUpdatingRole, setIsUpdatingRole] = useState12(false);
|
|
2002
|
+
const [memberToDelete, setMemberToDelete] = useState12(null);
|
|
2003
|
+
const [isDeleting, setIsDeleting] = useState12(false);
|
|
2006
2004
|
const dropdownRef = useRef4(null);
|
|
2007
2005
|
useEffect9(() => {
|
|
2008
2006
|
function handleClickOutside(event) {
|
|
@@ -2078,15 +2076,15 @@ var UniversalMembersPage = ({
|
|
|
2078
2076
|
setSelectedMember(null);
|
|
2079
2077
|
setIsRoleModalOpen(false);
|
|
2080
2078
|
};
|
|
2081
|
-
return /* @__PURE__ */
|
|
2079
|
+
return /* @__PURE__ */ React28.createElement("div", { className: "flex flex-col gap-8 animate-in max-w-3xl fade-in duration-300 p-6 rounded-2xl bg-white " }, /* @__PURE__ */ React28.createElement(ManagedToaster, null), /* @__PURE__ */ React28.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-4" }, currentView === "list" && /* @__PURE__ */ React28.createElement(React28.Fragment, null, /* @__PURE__ */ React28.createElement("div", null, /* @__PURE__ */ React28.createElement("h1", { className: " font-serif text-xl text-black mb-1 tracking-tight" }, headerTitle), /* @__PURE__ */ React28.createElement("p", { className: "text-xs text-neutral-500" }, headerDescription)), canManage && /* @__PURE__ */ React28.createElement(
|
|
2082
2080
|
ThreeDActionButton,
|
|
2083
2081
|
{
|
|
2084
2082
|
onClick: () => setCurrentView("invite"),
|
|
2085
2083
|
className: "w-fit shrink-0 gap-2"
|
|
2086
2084
|
},
|
|
2087
|
-
/* @__PURE__ */
|
|
2085
|
+
/* @__PURE__ */ React28.createElement(HugeiconsIcon14, { icon: UserAdd01Icon, size: 12 }),
|
|
2088
2086
|
"Add Member"
|
|
2089
|
-
)), currentView !== "list" && /* @__PURE__ */
|
|
2087
|
+
)), currentView !== "list" && /* @__PURE__ */ React28.createElement("div", { className: "flex flex-col items-start gap-3" }, /* @__PURE__ */ React28.createElement("button", { onClick: goBack, className: "text-[10px] text-neutral-400 hover:text-black tracking-[0.2em] flex items-center gap-1.5 transition-colors outline-none" }, /* @__PURE__ */ React28.createElement(HugeiconsIcon14, { icon: ArrowLeft01Icon3, size: 12 }), " Back"), /* @__PURE__ */ React28.createElement("h1", { className: " font-serif text-lg text-black tracking-tight" }, currentView === "invite" ? "Add New Member" : "Member Profile"))), currentView === "list" && /* @__PURE__ */ React28.createElement("div", { className: "w-full overflow-hidden" }, isLoading ? /* @__PURE__ */ React28.createElement(PageSpinner2, null) : /* @__PURE__ */ React28.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ React28.createElement("div", { className: "divide-y divide-neutral-100" }, members.map((member) => /* @__PURE__ */ React28.createElement(
|
|
2090
2088
|
"div",
|
|
2091
2089
|
{
|
|
2092
2090
|
key: member.id,
|
|
@@ -2096,7 +2094,7 @@ var UniversalMembersPage = ({
|
|
|
2096
2094
|
},
|
|
2097
2095
|
className: "flex items-center justify-between p-4 sm:p-5 hover:bg-neutral-50/50 transition-colors cursor-pointer group min-w-0"
|
|
2098
2096
|
},
|
|
2099
|
-
/* @__PURE__ */
|
|
2097
|
+
/* @__PURE__ */ React28.createElement("div", { className: "flex items-center gap-3 sm:gap-4 min-w-0 flex-1" }, member.displayImage && member.displayImage !== "NO_IMAGE" ? /* @__PURE__ */ React28.createElement("div", { className: "w-10 h-10 shrink-0 rounded-full overflow-hidden bg-neutral-100" }, /* @__PURE__ */ React28.createElement(
|
|
2100
2098
|
"img",
|
|
2101
2099
|
{
|
|
2102
2100
|
src: member.displayImage,
|
|
@@ -2104,25 +2102,25 @@ var UniversalMembersPage = ({
|
|
|
2104
2102
|
className: "w-full h-full object-cover blur-sm transition-all duration-300",
|
|
2105
2103
|
onLoad: (e) => e.currentTarget.classList.remove("blur-sm")
|
|
2106
2104
|
}
|
|
2107
|
-
)) : /* @__PURE__ */
|
|
2108
|
-
/* @__PURE__ */
|
|
2109
|
-
))), /* @__PURE__ */
|
|
2105
|
+
)) : /* @__PURE__ */ React28.createElement("div", { className: `w-10 h-10 shrink-0 rounded-full flex items-center justify-center text-black text-xs ${resolveThemeColor(member.profileColor)}` }, getInitials(member.fullName)), /* @__PURE__ */ React28.createElement("div", { className: "min-w-0 flex-1" }, /* @__PURE__ */ React28.createElement("p", { className: "text-sm text-black truncate pr-2 sm:pr-4" }, member.fullName, " ", member.userId === currentUserId && /* @__PURE__ */ React28.createElement("span", { className: "text-neutral-400 ml-1 sm:ml-2" }, "(You)")), /* @__PURE__ */ React28.createElement("p", { className: "text-xs text-neutral-500 truncate pr-2 sm:pr-4 mt-0.5" }, member.email))),
|
|
2106
|
+
/* @__PURE__ */ React28.createElement("div", { className: `shrink-0 pl-2 sm:pl-4 transition-opacity hidden sm:block ${canManage ? "opacity-0 group-hover:opacity-100" : "opacity-100"}` }, /* @__PURE__ */ React28.createElement("span", { className: "text-[10px] tracking-[0.2em] text-black border border-neutral-100 px-4 py-2 rounded-full bg-white whitespace-nowrap" }, canManage ? "Manage" : "View"))
|
|
2107
|
+
))), /* @__PURE__ */ React28.createElement("div", { className: "flex items-center justify-between p-4 sm:p-5" }, /* @__PURE__ */ React28.createElement("span", { className: "text-[10px] text-neutral-400 tracking-[0.2em]" }, "Page ", currentPage, " of ", totalPages), /* @__PURE__ */ React28.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React28.createElement(
|
|
2110
2108
|
"button",
|
|
2111
2109
|
{
|
|
2112
2110
|
onClick: () => onPageChange(currentPage - 1),
|
|
2113
2111
|
disabled: currentPage === 1 || isLoading,
|
|
2114
2112
|
className: "p-2 border border-neutral-100 rounded-full bg-white text-neutral-500 hover:text-black hover:border-black disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none"
|
|
2115
2113
|
},
|
|
2116
|
-
/* @__PURE__ */
|
|
2117
|
-
), /* @__PURE__ */
|
|
2114
|
+
/* @__PURE__ */ React28.createElement(HugeiconsIcon14, { icon: ArrowLeft01Icon3, size: 14 })
|
|
2115
|
+
), /* @__PURE__ */ React28.createElement(
|
|
2118
2116
|
"button",
|
|
2119
2117
|
{
|
|
2120
2118
|
onClick: () => onPageChange(currentPage + 1),
|
|
2121
2119
|
disabled: currentPage >= totalPages || isLoading,
|
|
2122
2120
|
className: "p-2 border border-neutral-100 rounded-full bg-white text-neutral-500 hover:text-black hover:border-black disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none"
|
|
2123
2121
|
},
|
|
2124
|
-
/* @__PURE__ */
|
|
2125
|
-
))))), currentView === "details" && selectedMember && /* @__PURE__ */
|
|
2122
|
+
/* @__PURE__ */ React28.createElement(HugeiconsIcon14, { icon: ArrowRight01Icon3, size: 14 })
|
|
2123
|
+
))))), currentView === "details" && selectedMember && /* @__PURE__ */ React28.createElement("div", { className: "w-full max-w-2xl text-left" }, /* @__PURE__ */ React28.createElement("div", { className: "flex flex-col gap-8" }, /* @__PURE__ */ React28.createElement("div", { className: "flex items-center gap-5" }, selectedMember.displayImage && selectedMember.displayImage !== "NO_IMAGE" ? /* @__PURE__ */ React28.createElement("div", { className: "w-16 h-16 shrink-0 rounded-full overflow-hidden bg-neutral-100" }, /* @__PURE__ */ React28.createElement(
|
|
2126
2124
|
"img",
|
|
2127
2125
|
{
|
|
2128
2126
|
src: selectedMember.displayImage,
|
|
@@ -2130,7 +2128,7 @@ var UniversalMembersPage = ({
|
|
|
2130
2128
|
className: "w-full h-full object-cover blur-sm transition-all duration-300",
|
|
2131
2129
|
onLoad: (e) => e.currentTarget.classList.remove("blur-sm")
|
|
2132
2130
|
}
|
|
2133
|
-
)) : /* @__PURE__ */
|
|
2131
|
+
)) : /* @__PURE__ */ React28.createElement("div", { className: `w-16 h-16 shrink-0 rounded-full flex items-center justify-center text-black text-sm ${resolveThemeColor(selectedMember.profileColor)}` }, getInitials(selectedMember.fullName)), /* @__PURE__ */ React28.createElement("div", null, /* @__PURE__ */ React28.createElement("h2", { className: " font-serif text-lg text-black" }, selectedMember.fullName), /* @__PURE__ */ React28.createElement("p", { className: "text-sm text-neutral-500 mt-1" }, selectedMember.email))), /* @__PURE__ */ React28.createElement("div", { className: "grid grid-cols-2 gap-6 border-t border-neutral-100 pt-8" }, /* @__PURE__ */ React28.createElement("div", null, /* @__PURE__ */ React28.createElement("span", { className: "text-[10px] tracking-[0.2em] text-neutral-400 block mb-3" }, "Role"), canChangeRoles && selectedMember.userId !== currentUserId ? /* @__PURE__ */ React28.createElement(
|
|
2134
2132
|
"button",
|
|
2135
2133
|
{
|
|
2136
2134
|
onClick: () => !isUpdatingRole && setIsRoleModalOpen(true),
|
|
@@ -2138,16 +2136,16 @@ var UniversalMembersPage = ({
|
|
|
2138
2136
|
className: `flex items-center gap-3 text-xs text-black pl-4 pr-3 py-2 border rounded-full transition-colors disabled:opacity-50 outline-none ${isRoleModalOpen ? "bg-neutral-50 border-neutral-300" : "bg-white border-neutral-100 hover:bg-neutral-50"}`
|
|
2139
2137
|
},
|
|
2140
2138
|
selectedMember.role,
|
|
2141
|
-
isUpdatingRole ? /* @__PURE__ */
|
|
2142
|
-
) : /* @__PURE__ */
|
|
2139
|
+
isUpdatingRole ? /* @__PURE__ */ React28.createElement(ButtonSpinner3, null) : /* @__PURE__ */ React28.createElement(HugeiconsIcon14, { icon: ArrowDown01Icon2, size: 14, className: "text-neutral-400" })
|
|
2140
|
+
) : /* @__PURE__ */ React28.createElement("span", { className: "text-xs text-black bg-neutral-50 px-4 py-2 rounded-full inline-block" }, selectedMember.role)), /* @__PURE__ */ React28.createElement("div", null, /* @__PURE__ */ React28.createElement("span", { className: "text-[10px] tracking-[0.2em] text-neutral-400 block mb-3" }, "Joined Date"), /* @__PURE__ */ React28.createElement("span", { className: "text-sm text-black" }, new Date(selectedMember.joinedAt).toLocaleDateString()))), canManage && selectedMember.userId !== currentUserId && /* @__PURE__ */ React28.createElement("div", { className: "pt-8 mt-2 border-t border-neutral-100" }, /* @__PURE__ */ React28.createElement(
|
|
2143
2141
|
"button",
|
|
2144
2142
|
{
|
|
2145
2143
|
onClick: () => setMemberToDelete(selectedMember),
|
|
2146
2144
|
className: "flex items-center gap-2 text-[11px] tracking-widest text-red-600 hover:text-red-700 transition-colors w-fit outline-none"
|
|
2147
2145
|
},
|
|
2148
|
-
/* @__PURE__ */
|
|
2146
|
+
/* @__PURE__ */ React28.createElement(HugeiconsIcon14, { icon: Delete01Icon, size: 14 }),
|
|
2149
2147
|
" Remove Member"
|
|
2150
|
-
)))), currentView === "invite" && canManage && /* @__PURE__ */
|
|
2148
|
+
)))), currentView === "invite" && canManage && /* @__PURE__ */ React28.createElement("div", { className: "w-full max-w-2xl text-left" }, /* @__PURE__ */ React28.createElement("form", { onSubmit: handleInvite, className: "space-y-8", autoComplete: "off" }, /* @__PURE__ */ React28.createElement(
|
|
2151
2149
|
TextInput,
|
|
2152
2150
|
{
|
|
2153
2151
|
label: "Email Address",
|
|
@@ -2156,7 +2154,7 @@ var UniversalMembersPage = ({
|
|
|
2156
2154
|
disabled: isInviting,
|
|
2157
2155
|
placeholder: "developer@acme.com"
|
|
2158
2156
|
}
|
|
2159
|
-
), requireNamesForInvite && /* @__PURE__ */
|
|
2157
|
+
), requireNamesForInvite && /* @__PURE__ */ React28.createElement("div", { className: "flex flex-col sm:flex-row gap-6" }, /* @__PURE__ */ React28.createElement(
|
|
2160
2158
|
TextInput,
|
|
2161
2159
|
{
|
|
2162
2160
|
label: "First Name",
|
|
@@ -2165,7 +2163,7 @@ var UniversalMembersPage = ({
|
|
|
2165
2163
|
disabled: isInviting,
|
|
2166
2164
|
placeholder: "Jane"
|
|
2167
2165
|
}
|
|
2168
|
-
), /* @__PURE__ */
|
|
2166
|
+
), /* @__PURE__ */ React28.createElement(
|
|
2169
2167
|
TextInput,
|
|
2170
2168
|
{
|
|
2171
2169
|
label: "Last Name",
|
|
@@ -2174,7 +2172,7 @@ var UniversalMembersPage = ({
|
|
|
2174
2172
|
disabled: isInviting,
|
|
2175
2173
|
placeholder: "Doe"
|
|
2176
2174
|
}
|
|
2177
|
-
)), /* @__PURE__ */
|
|
2175
|
+
)), /* @__PURE__ */ React28.createElement("div", { className: "pt-8 mt-2" }, /* @__PURE__ */ React28.createElement(
|
|
2178
2176
|
ThreeDActionButton,
|
|
2179
2177
|
{
|
|
2180
2178
|
type: "submit",
|
|
@@ -2183,7 +2181,7 @@ var UniversalMembersPage = ({
|
|
|
2183
2181
|
className: "min-w-40"
|
|
2184
2182
|
},
|
|
2185
2183
|
"Send Invitation"
|
|
2186
|
-
)))), isRoleModalOpen && canChangeRoles && /* @__PURE__ */
|
|
2184
|
+
)))), isRoleModalOpen && canChangeRoles && /* @__PURE__ */ React28.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ React28.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: () => !isUpdatingRole && setIsRoleModalOpen(false) }), /* @__PURE__ */ React28.createElement("div", { ref: dropdownRef, className: "relative w-72 bg-white shadow-2xl rounded-2xl flex flex-col items-center overflow-hidden animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React28.createElement("div", { className: "p-6 text-center w-full" }, /* @__PURE__ */ React28.createElement("h3", { className: " font-serif text-[14px] text-black tracking-tight" }, "Update Role")), /* @__PURE__ */ React28.createElement("div", { className: "w-full flex flex-col pl-2 pr-2" }, availableRoles.map((roleOption) => /* @__PURE__ */ React28.createElement(
|
|
2187
2185
|
"button",
|
|
2188
2186
|
{
|
|
2189
2187
|
key: roleOption,
|
|
@@ -2191,9 +2189,9 @@ var UniversalMembersPage = ({
|
|
|
2191
2189
|
disabled: isUpdatingRole,
|
|
2192
2190
|
className: `text-left px-4 py-3 text-[12px] tracking-wide transition-colors rounded-full flex items-center justify-between outline-none ${selectedMember?.role === roleOption ? "bg-neutral-100 text-black" : "text-neutral-500 hover:bg-neutral-50 hover:text-black"}`
|
|
2193
2191
|
},
|
|
2194
|
-
/* @__PURE__ */
|
|
2195
|
-
selectedMember?.role === roleOption && /* @__PURE__ */
|
|
2196
|
-
))), /* @__PURE__ */
|
|
2192
|
+
/* @__PURE__ */ React28.createElement("span", { className: "truncate pr-2" }, roleOption),
|
|
2193
|
+
selectedMember?.role === roleOption && /* @__PURE__ */ React28.createElement("div", { className: "w-1.5 h-1.5 rounded-full shrink-0 bg-black" })
|
|
2194
|
+
))), /* @__PURE__ */ React28.createElement("div", { className: "w-full flex" }, /* @__PURE__ */ React28.createElement(
|
|
2197
2195
|
"button",
|
|
2198
2196
|
{
|
|
2199
2197
|
onClick: () => setIsRoleModalOpen(false),
|
|
@@ -2201,11 +2199,11 @@ var UniversalMembersPage = ({
|
|
|
2201
2199
|
className: "w-full py-2.5 text-[13px] text-neutral-600 hover:bg-neutral-50 transition-colors disabled:opacity-50 outline-none"
|
|
2202
2200
|
},
|
|
2203
2201
|
"Cancel"
|
|
2204
|
-
)))), memberToDelete && canManage && /* @__PURE__ */
|
|
2202
|
+
)))), memberToDelete && canManage && /* @__PURE__ */ React28.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ React28.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: () => !isDeleting && setMemberToDelete(null) }), /* @__PURE__ */ React28.createElement("div", { className: "relative w-72 bg-white shadow-2xl rounded-2xl flex flex-col items-center overflow-hidden animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React28.createElement("div", { className: "p-6 text-center w-full" }, /* @__PURE__ */ React28.createElement("h3", { className: " font-serif text-[17px] text-black tracking-tight mb-1" }, "Remove Member"), /* @__PURE__ */ React28.createElement("p", { className: "text-[12px] text-neutral-500 leading-snug mt-2" }, "Are you sure you want to remove this member? They will lose access instantly.")), /* @__PURE__ */ React28.createElement("div", { className: "w-full flex" }, /* @__PURE__ */ React28.createElement("button", { onClick: () => setMemberToDelete(null), disabled: isDeleting, className: "flex-1 py-2 text-[13px] text-neutral-600 hover:bg-neutral-50 transition-colors disabled:opacity-50 outline-none" }, "Cancel"), /* @__PURE__ */ React28.createElement("button", { onClick: handleDelete, disabled: isDeleting, className: "flex-1 py-2 text-[13px] text-red-600 hover:bg-neutral-50 transition-colors disabled:opacity-50 flex justify-center outline-none" }, isDeleting ? /* @__PURE__ */ React28.createElement(ButtonSpinner3, null) : "Remove")))));
|
|
2205
2203
|
};
|
|
2206
2204
|
|
|
2207
2205
|
// src/components/UniversalProfileSettings.tsx
|
|
2208
|
-
import
|
|
2206
|
+
import React29, { useState as useState13, useEffect as useEffect10 } from "react";
|
|
2209
2207
|
import toast5 from "react-hot-toast";
|
|
2210
2208
|
var UniversalProfileSettings = ({
|
|
2211
2209
|
initialFirstName,
|
|
@@ -2216,9 +2214,9 @@ var UniversalProfileSettings = ({
|
|
|
2216
2214
|
isReadOnly = false,
|
|
2217
2215
|
onSaveProfile
|
|
2218
2216
|
}) => {
|
|
2219
|
-
const [firstName, setFirstName] =
|
|
2220
|
-
const [lastName, setLastName] =
|
|
2221
|
-
const [isSubmitting, setIsSubmitting] =
|
|
2217
|
+
const [firstName, setFirstName] = useState13(initialFirstName);
|
|
2218
|
+
const [lastName, setLastName] = useState13(initialLastName);
|
|
2219
|
+
const [isSubmitting, setIsSubmitting] = useState13(false);
|
|
2222
2220
|
useEffect10(() => {
|
|
2223
2221
|
setFirstName(initialFirstName || "");
|
|
2224
2222
|
setLastName(initialLastName || "");
|
|
@@ -2249,7 +2247,7 @@ var UniversalProfileSettings = ({
|
|
|
2249
2247
|
};
|
|
2250
2248
|
const hasChanges = firstName !== initialFirstName || lastName !== initialLastName;
|
|
2251
2249
|
const isSaveDisabled = isSubmitting || isReadOnly || !hasChanges || firstName.trim().length === 0 || lastName.trim().length === 0;
|
|
2252
|
-
return /* @__PURE__ */
|
|
2250
|
+
return /* @__PURE__ */ React29.createElement("div", { className: "flex flex-col max-w-3xl rounded-2xl p-6 bg-white gap-8 animate-in fade-in duration-300 " }, /* @__PURE__ */ React29.createElement(ManagedToaster, null), /* @__PURE__ */ React29.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-3 sm:gap-4" }, /* @__PURE__ */ React29.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React29.createElement("h1", { className: " font-serif text-xl text-black mb-1 truncate tracking-tight" }, "Personal Settings"), /* @__PURE__ */ React29.createElement("p", { className: "text-xs text-neutral-500 truncate" }, "Manage your personal account profile.")), isReadOnly && /* @__PURE__ */ React29.createElement("span", { className: "px-3 py-1 bg-neutral-50 text-neutral-500 rounded-full text-[10px] tracking-[0.2em] shrink-0 w-fit" }, "Read Only Access")), /* @__PURE__ */ React29.createElement("div", { className: "w-full max-w-2xl" }, /* @__PURE__ */ React29.createElement("form", { className: "flex flex-col gap-8", onSubmit: handleSave, autoComplete: "off" }, /* @__PURE__ */ React29.createElement("div", { className: "flex flex-col sm:flex-row gap-6" }, /* @__PURE__ */ React29.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ React29.createElement(
|
|
2253
2251
|
TextInput,
|
|
2254
2252
|
{
|
|
2255
2253
|
label: "First Name",
|
|
@@ -2258,7 +2256,7 @@ var UniversalProfileSettings = ({
|
|
|
2258
2256
|
disabled: isReadOnly || isSubmitting,
|
|
2259
2257
|
placeholder: "System"
|
|
2260
2258
|
}
|
|
2261
|
-
)), /* @__PURE__ */
|
|
2259
|
+
)), /* @__PURE__ */ React29.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ React29.createElement(
|
|
2262
2260
|
TextInput,
|
|
2263
2261
|
{
|
|
2264
2262
|
label: "Last Name",
|
|
@@ -2267,7 +2265,7 @@ var UniversalProfileSettings = ({
|
|
|
2267
2265
|
disabled: isReadOnly || isSubmitting,
|
|
2268
2266
|
placeholder: "Admin"
|
|
2269
2267
|
}
|
|
2270
|
-
))), /* @__PURE__ */
|
|
2268
|
+
))), /* @__PURE__ */ React29.createElement("div", { className: "space-y-2 min-w-0" }, /* @__PURE__ */ React29.createElement(
|
|
2271
2269
|
TextInput,
|
|
2272
2270
|
{
|
|
2273
2271
|
label: "Email ID",
|
|
@@ -2276,7 +2274,7 @@ var UniversalProfileSettings = ({
|
|
|
2276
2274
|
},
|
|
2277
2275
|
disabled: true
|
|
2278
2276
|
}
|
|
2279
|
-
), /* @__PURE__ */
|
|
2277
|
+
), /* @__PURE__ */ React29.createElement("p", { className: "text-[10px] text-neutral-400 mt-1 truncate" }, "To change your email address, please contact support.")), /* @__PURE__ */ React29.createElement("div", { className: "flex flex-col sm:flex-row sm:items-center justify-between pt-8 mt-2 gap-6 sm:gap-4 border-t border-neutral-100" }, /* @__PURE__ */ React29.createElement("div", { className: "flex items-center gap-6 min-w-0" }, /* @__PURE__ */ React29.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React29.createElement("span", { className: "text-[10px] text-neutral-400 tracking-[0.2em] block truncate uppercase" }, "Account Status"), /* @__PURE__ */ React29.createElement("span", { className: "text-xs text-black block truncate" }, accountStatus)), /* @__PURE__ */ React29.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React29.createElement("span", { className: "text-[10px] text-neutral-400 tracking-[0.2em] block truncate uppercase" }, "Member Since"), /* @__PURE__ */ React29.createElement("span", { className: "text-xs text-black block truncate" }, memberSince ? new Date(memberSince).toLocaleDateString("en-US", { month: "long", day: "numeric", year: "numeric" }) : "N/A"))), /* @__PURE__ */ React29.createElement("div", { className: "flex flex-col-reverse sm:flex-row items-center gap-3 sm:gap-4 w-full sm:w-auto shrink-0" }, hasChanges && !isSubmitting && !isReadOnly && /* @__PURE__ */ React29.createElement(
|
|
2280
2278
|
"button",
|
|
2281
2279
|
{
|
|
2282
2280
|
type: "button",
|
|
@@ -2287,7 +2285,7 @@ var UniversalProfileSettings = ({
|
|
|
2287
2285
|
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"
|
|
2288
2286
|
},
|
|
2289
2287
|
"Cancel"
|
|
2290
|
-
), /* @__PURE__ */
|
|
2288
|
+
), /* @__PURE__ */ React29.createElement(
|
|
2291
2289
|
ThreeDActionButton,
|
|
2292
2290
|
{
|
|
2293
2291
|
type: "submit",
|
|
@@ -2300,16 +2298,16 @@ var UniversalProfileSettings = ({
|
|
|
2300
2298
|
};
|
|
2301
2299
|
|
|
2302
2300
|
// src/components/UniversalBillingPage.tsx
|
|
2303
|
-
import
|
|
2304
|
-
import { HugeiconsIcon as
|
|
2301
|
+
import React30, { useState as useState14 } from "react";
|
|
2302
|
+
import { HugeiconsIcon as HugeiconsIcon15 } from "@hugeicons/react";
|
|
2305
2303
|
import {
|
|
2306
2304
|
ArrowLeft01Icon as ArrowLeft01Icon4,
|
|
2307
2305
|
ArrowRight01Icon as ArrowRight01Icon4,
|
|
2308
2306
|
Loading03Icon as Loading03Icon7,
|
|
2309
2307
|
ArrowDown01Icon as ArrowDown01Icon3
|
|
2310
2308
|
} from "@hugeicons/core-free-icons";
|
|
2311
|
-
var PageSpinner3 = () => /* @__PURE__ */
|
|
2312
|
-
var ButtonSpinner4 = () => /* @__PURE__ */
|
|
2309
|
+
var PageSpinner3 = () => /* @__PURE__ */ React30.createElement("div", { className: "flex justify-center items-center py-12" }, /* @__PURE__ */ React30.createElement(HugeiconsIcon15, { icon: Loading03Icon7, size: 32, className: "animate-spin mb-4 text-neutral-400" }));
|
|
2310
|
+
var ButtonSpinner4 = () => /* @__PURE__ */ React30.createElement(HugeiconsIcon15, { icon: Loading03Icon7, size: 16, className: "animate-spin text-neutral-500" });
|
|
2313
2311
|
var formatDate = (dateString) => {
|
|
2314
2312
|
if (!dateString) return "N/A";
|
|
2315
2313
|
return new Date(dateString).toLocaleDateString("en-US", {
|
|
@@ -2351,13 +2349,13 @@ var UniversalBillingPage = ({
|
|
|
2351
2349
|
onPayInvoice,
|
|
2352
2350
|
onUpdateInvoiceStatus
|
|
2353
2351
|
}) => {
|
|
2354
|
-
const [currentView, setCurrentView] =
|
|
2355
|
-
const [selectedInvoice, setSelectedInvoice] =
|
|
2356
|
-
const [isTimeframeModalOpen, setIsTimeframeModalOpen] =
|
|
2357
|
-
const [isPaying, setIsPaying] =
|
|
2358
|
-
const [isActionModalOpen, setIsActionModalOpen] =
|
|
2359
|
-
const [isUpdating, setIsUpdating] =
|
|
2360
|
-
const [twoFactorCode, setTwoFactorCode] =
|
|
2352
|
+
const [currentView, setCurrentView] = useState14("list");
|
|
2353
|
+
const [selectedInvoice, setSelectedInvoice] = useState14(null);
|
|
2354
|
+
const [isTimeframeModalOpen, setIsTimeframeModalOpen] = useState14(false);
|
|
2355
|
+
const [isPaying, setIsPaying] = useState14(false);
|
|
2356
|
+
const [isActionModalOpen, setIsActionModalOpen] = useState14(false);
|
|
2357
|
+
const [isUpdating, setIsUpdating] = useState14(false);
|
|
2358
|
+
const [twoFactorCode, setTwoFactorCode] = useState14("");
|
|
2361
2359
|
const handlePayment = async () => {
|
|
2362
2360
|
if (!selectedInvoice || isReadOnly || !onPayInvoice || isPaying) return;
|
|
2363
2361
|
setIsPaying(true);
|
|
@@ -2384,14 +2382,14 @@ var UniversalBillingPage = ({
|
|
|
2384
2382
|
setIsUpdating(false);
|
|
2385
2383
|
}
|
|
2386
2384
|
};
|
|
2387
|
-
return /* @__PURE__ */
|
|
2385
|
+
return /* @__PURE__ */ React30.createElement("div", { className: "flex max-w-3xl rounded-2xl bg-white p-6 flex-col gap-8 animate-in fade-in duration-300 " }, /* @__PURE__ */ React30.createElement(ManagedToaster, null), /* @__PURE__ */ React30.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-3 sm:gap-4" }, currentView === "list" ? /* @__PURE__ */ React30.createElement("div", { className: "min-w-0 w-full" }, /* @__PURE__ */ React30.createElement("h1", { className: " font-serif text-xl text-black mb-1 truncate tracking-tight" }, headerTitle), /* @__PURE__ */ React30.createElement("p", { className: "text-xs text-neutral-500 truncate mb-6" }, headerDescription), showSearchAndFilter && onSearchChange && onTimeframeChange && /* @__PURE__ */ React30.createElement("div", { className: "flex flex-col sm:flex-row gap-4 mb-4" }, /* @__PURE__ */ React30.createElement(
|
|
2388
2386
|
TextInput,
|
|
2389
2387
|
{
|
|
2390
2388
|
placeholder: "Search by ID or Name...",
|
|
2391
2389
|
value: searchQuery,
|
|
2392
2390
|
onChange: onSearchChange
|
|
2393
2391
|
}
|
|
2394
|
-
), /* @__PURE__ */
|
|
2392
|
+
), /* @__PURE__ */ React30.createElement(
|
|
2395
2393
|
"button",
|
|
2396
2394
|
{
|
|
2397
2395
|
type: "button",
|
|
@@ -2399,10 +2397,10 @@ var UniversalBillingPage = ({
|
|
|
2399
2397
|
className: "px-4 py-3 text-sm bg-transparent border-b border-neutral-100 text-black outline-none focus:border-black shrink-0 text-left"
|
|
2400
2398
|
},
|
|
2401
2399
|
timeframe === "ALL" ? "All Time" : timeframe === "24H" ? "Past 24 Hours" : timeframe === "7D" ? "Past 7 Days" : "Past 30 Days"
|
|
2402
|
-
))) : /* @__PURE__ */
|
|
2400
|
+
))) : /* @__PURE__ */ React30.createElement("div", { className: "flex flex-col items-start gap-3" }, /* @__PURE__ */ React30.createElement("button", { onClick: () => setCurrentView("list"), className: "text-[10px] text-neutral-400 hover:text-black tracking-[0.2em] flex items-center gap-1.5 transition-colors outline-none" }, /* @__PURE__ */ React30.createElement(HugeiconsIcon15, { icon: ArrowLeft01Icon4, size: 12 }), " Back")), isReadOnly && currentView === "list" && /* @__PURE__ */ React30.createElement("span", { className: "px-3 py-1 bg-neutral-50 text-neutral-500 rounded-full text-[10px] tracking-[0.2em] shrink-0 w-fit" }, "Read Only Access")), currentView === "list" && /* @__PURE__ */ React30.createElement("div", { className: "w-full max-w-2xl" }, /* @__PURE__ */ React30.createElement("div", { className: "flex flex-col gap-8 w-full" }, (metricPrimaryLabel || metricSecondaryLabel) && /* @__PURE__ */ React30.createElement("div", { className: "flex flex-col sm:flex-row sm:justify-between sm:items-start pb-8 border-b border-neutral-100 gap-6 sm:gap-0" }, metricPrimaryLabel && /* @__PURE__ */ React30.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React30.createElement("h3", { className: " font-serif text-[10px] text-neutral-400 tracking-[0.2em] mb-2 truncate block uppercase" }, metricPrimaryLabel), /* @__PURE__ */ React30.createElement("div", { className: "text-xl text-black tracking-tight truncate" }, formatNaira(metricPrimaryValue)), metricPrimarySubtext && /* @__PURE__ */ React30.createElement("p", { className: "text-[10px] text-neutral-500 mt-1 tracking-widest uppercase" }, metricPrimarySubtext)), metricSecondaryLabel && /* @__PURE__ */ React30.createElement("div", { className: "min-w-0 sm:text-right" }, /* @__PURE__ */ React30.createElement("h3", { className: " font-serif text-[10px] text-neutral-400 tracking-[0.2em] mb-2 truncate block uppercase" }, metricSecondaryLabel), /* @__PURE__ */ React30.createElement("div", { className: "text-xl text-emerald-600 tracking-tight truncate" }, formatNaira(metricSecondaryValue)), metricSecondarySubtext && /* @__PURE__ */ React30.createElement("p", { className: "text-[10px] text-neutral-500 mt-1 tracking-widest uppercase" }, metricSecondarySubtext))), !isReadOnly && showBillingOverview && /* @__PURE__ */ React30.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-3 gap-8 sm:gap-4" }, /* @__PURE__ */ React30.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React30.createElement("h3", { className: " font-serif text-[10px] text-neutral-400 tracking-[0.2em] mb-3 truncate block uppercase" }, "Billing Status"), /* @__PURE__ */ React30.createElement("div", { className: "flex items-center gap-2 min-w-0" }, /* @__PURE__ */ React30.createElement("div", { className: `w-2 h-2 rounded-full shrink-0 ${billingStatus === "ACTIVE" ? "bg-green-500" : "bg-neutral-300"}` }), /* @__PURE__ */ React30.createElement("p", { className: "text-xs text-black tracking-widest truncate" }, billingStatus || "UNKNOWN"))), /* @__PURE__ */ React30.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React30.createElement("h3", { className: " font-serif text-[10px] text-neutral-400 tracking-[0.2em] mb-3 truncate block uppercase" }, "Next Billing Date"), /* @__PURE__ */ React30.createElement("p", { className: "text-sm text-black truncate" }, formatDate(nextBillingDate))), lastPaidDate && /* @__PURE__ */ React30.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React30.createElement("h3", { className: " font-serif text-[10px] text-neutral-400 tracking-[0.2em] mb-3 truncate block uppercase" }, "Last Paid Date"), /* @__PURE__ */ React30.createElement("p", { className: "text-sm text-neutral-600 truncate" }, formatDate(lastPaidDate)))), !isReadOnly && showUsageMetrics && usageMetrics.length > 0 && /* @__PURE__ */ React30.createElement("div", { className: "pt-8 border-t border-neutral-100" }, /* @__PURE__ */ React30.createElement("h3", { className: " font-serif text-[10px] text-neutral-400 tracking-[0.2em] mb-6 truncate block uppercase" }, "Usage & Limits"), /* @__PURE__ */ React30.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-x-8 gap-y-4 text-sm text-black" }, usageMetrics.map((metric, idx) => /* @__PURE__ */ React30.createElement("div", { key: idx, className: "flex justify-between border-b border-neutral-50 pb-2" }, /* @__PURE__ */ React30.createElement("span", { className: "text-neutral-500 text-xs" }, metric.label), /* @__PURE__ */ React30.createElement("span", { className: "text-xs text-black" }, metric.value))))), /* @__PURE__ */ React30.createElement("div", { className: "pt-8 border-t border-neutral-100" }, /* @__PURE__ */ React30.createElement("h3", { className: " font-serif text-[10px] text-neutral-400 tracking-[0.2em] mb-4 truncate block uppercase" }, "Transaction History"), isLoading ? /* @__PURE__ */ React30.createElement(PageSpinner3, null) : invoices.length === 0 ? /* @__PURE__ */ React30.createElement(React30.Fragment, null, /* @__PURE__ */ React30.createElement("p", { className: "text-xs text-neutral-500 py-4" }, "No records found.")) : /* @__PURE__ */ React30.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ React30.createElement("div", { className: "divide-y divide-neutral-100" }, invoices.map((inv) => /* @__PURE__ */ React30.createElement("div", { key: inv.id, onClick: () => {
|
|
2403
2401
|
setSelectedInvoice(inv);
|
|
2404
2402
|
setCurrentView("details");
|
|
2405
|
-
}, className: "flex items-center justify-between py-4 hover:bg-neutral-50/50 cursor-pointer group min-w-0 px-2 transition-colors" }, /* @__PURE__ */
|
|
2403
|
+
}, className: "flex items-center justify-between py-4 hover:bg-neutral-50/50 cursor-pointer group min-w-0 px-2 transition-colors" }, /* @__PURE__ */ React30.createElement("div", { className: "flex flex-col gap-1 min-w-0 flex-1" }, /* @__PURE__ */ React30.createElement("p", { className: "text-sm text-black truncate pr-4" }, inv.name), /* @__PURE__ */ React30.createElement("p", { className: "text-xs text-neutral-500 truncate" }, inv.subtext)), /* @__PURE__ */ React30.createElement("div", { className: "flex flex-col items-end gap-1 shrink-0 pl-4" }, /* @__PURE__ */ React30.createElement("p", { className: "text-sm text-black" }, formatNaira(inv.amountDue)), /* @__PURE__ */ React30.createElement("span", { className: `text-[9px] tracking-widest px-2 py-0.5 rounded-full ${inv.status === "PAID" ? "bg-emerald-50 text-emerald-600" : "bg-neutral-50 text-neutral-600"}` }, inv.status))))), totalPages > 1 && /* @__PURE__ */ React30.createElement("div", { className: "flex items-center justify-between pt-4 mt-2" }, /* @__PURE__ */ React30.createElement("span", { className: "text-[10px] text-neutral-400 tracking-[0.2em]" }, "Page ", currentPage, " of ", totalPages), /* @__PURE__ */ React30.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React30.createElement("button", { onClick: () => onPageChange(currentPage - 1), disabled: currentPage === 1 || isLoading, className: "p-2 border border-neutral-100 rounded-full bg-white text-neutral-500 hover:text-black outline-none disabled:opacity-30" }, /* @__PURE__ */ React30.createElement(HugeiconsIcon15, { icon: ArrowLeft01Icon4, size: 14 })), /* @__PURE__ */ React30.createElement("button", { onClick: () => onPageChange(currentPage + 1), disabled: currentPage >= totalPages || isLoading, className: "p-2 border border-neutral-100 rounded-full bg-white text-neutral-500 hover:text-black outline-none disabled:opacity-30" }, /* @__PURE__ */ React30.createElement(HugeiconsIcon15, { icon: ArrowRight01Icon4, size: 14 })))))))), currentView === "details" && selectedInvoice && /* @__PURE__ */ React30.createElement("div", { className: "w-full max-w-2xl animate-in fade-in duration-300" }, /* @__PURE__ */ React30.createElement("div", { className: "flex flex-col gap-6 w-full" }, /* @__PURE__ */ React30.createElement("div", null, /* @__PURE__ */ React30.createElement("span", { className: "text-[10px] tracking-[0.2em] text-neutral-400 block mb-1 uppercase" }, "Breakdown"), /* @__PURE__ */ React30.createElement("h2", { className: " font-serif text-xl text-black mb-1" }, selectedInvoice.name), /* @__PURE__ */ React30.createElement("p", { className: "text-xs text-neutral-500" }, "Generated on ", formatDate(selectedInvoice.createdAt))), /* @__PURE__ */ React30.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6 p-6 sm:p-8 rounded-2xl border border-neutral-100" }, /* @__PURE__ */ React30.createElement("div", null, /* @__PURE__ */ React30.createElement("span", { className: "text-[10px] tracking-[0.2em] text-neutral-400 block mb-1 uppercase" }, "Amount"), /* @__PURE__ */ React30.createElement("p", { className: "text-xl text-black" }, formatNaira(selectedInvoice.amountDue))), /* @__PURE__ */ React30.createElement("div", null, /* @__PURE__ */ React30.createElement("span", { className: "text-[10px] tracking-[0.2em] text-neutral-400 block mb-1 uppercase" }, "Status"), isModMode ? /* @__PURE__ */ React30.createElement(
|
|
2406
2404
|
"button",
|
|
2407
2405
|
{
|
|
2408
2406
|
onClick: () => !isUpdating && setIsActionModalOpen(true),
|
|
@@ -2410,8 +2408,8 @@ var UniversalBillingPage = ({
|
|
|
2410
2408
|
className: `flex items-center gap-3 text-xs text-black px-3 py-1.5 mt-1 border rounded-full transition-colors disabled:opacity-50 outline-none ${isActionModalOpen ? "bg-neutral-50 border-neutral-300" : "bg-white border-neutral-100 hover:bg-neutral-50"}`
|
|
2411
2409
|
},
|
|
2412
2410
|
selectedInvoice.status,
|
|
2413
|
-
isUpdating ? /* @__PURE__ */
|
|
2414
|
-
) : /* @__PURE__ */
|
|
2411
|
+
isUpdating ? /* @__PURE__ */ React30.createElement(ButtonSpinner4, null) : /* @__PURE__ */ React30.createElement(HugeiconsIcon15, { icon: ArrowDown01Icon3, size: 14, className: "text-neutral-400" })
|
|
2412
|
+
) : /* @__PURE__ */ React30.createElement("span", { className: `text-[10px] tracking-widest px-3 py-1 mt-1 inline-block rounded-full ${selectedInvoice.status === "PAID" ? "bg-emerald-100 text-emerald-700" : "bg-neutral-100 text-neutral-700"}` }, selectedInvoice.status)), /* @__PURE__ */ React30.createElement("div", { className: "md:col-span-2 pt-4 border-t border-neutral-100/60 mt-2" }, /* @__PURE__ */ React30.createElement("span", { className: "text-[10px] tracking-[0.2em] text-neutral-400 block mb-1 uppercase" }, "Reference ID"), /* @__PURE__ */ React30.createElement("p", { className: "text-xs text-neutral-500 bg-white px-3 py-2 rounded-full border border-neutral-100 inline-block" }, selectedInvoice.id))), /* @__PURE__ */ React30.createElement("div", { className: "flex flex-col sm:flex-row sm:items-center justify-end gap-4 pt-4" }, !isModMode && selectedInvoice.status === "SCHEDULED" && onPayInvoice && /* @__PURE__ */ React30.createElement("div", { className: "flex flex-col items-end gap-2 w-full sm:w-auto" }, /* @__PURE__ */ React30.createElement(
|
|
2415
2413
|
ThreeDActionButton,
|
|
2416
2414
|
{
|
|
2417
2415
|
onClick: handlePayment,
|
|
@@ -2420,12 +2418,12 @@ var UniversalBillingPage = ({
|
|
|
2420
2418
|
className: "w-full sm:w-auto"
|
|
2421
2419
|
},
|
|
2422
2420
|
"Pay Invoice"
|
|
2423
|
-
)), !isModMode && selectedInvoice.status === "PAID" && /* @__PURE__ */
|
|
2421
|
+
)), !isModMode && selectedInvoice.status === "PAID" && /* @__PURE__ */ React30.createElement("span", { className: "text-[11px] tracking-widest text-emerald-600 px-6 py-3 bg-emerald-50 rounded-full" }, "Invoice Completed")))), isTimeframeModalOpen && showSearchAndFilter && onTimeframeChange && /* @__PURE__ */ React30.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ React30.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: () => setIsTimeframeModalOpen(false) }), /* @__PURE__ */ React30.createElement("div", { className: "relative w-80 bg-white shadow-2xl rounded-2xl flex flex-col items-center overflow-hidden animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React30.createElement("div", { className: "p-6 text-center w-full" }, /* @__PURE__ */ React30.createElement("h3", { className: " font-serif text-[14px] text-black tracking-tight mb-2" }, "Select Timeframe"), /* @__PURE__ */ React30.createElement("p", { className: "text-[12px] text-neutral-500" }, "Choose the range of transactions to display.")), /* @__PURE__ */ React30.createElement("div", { className: "w-full flex flex-col pl-2 pr-2" }, [
|
|
2424
2422
|
{ value: "ALL", label: "All Time" },
|
|
2425
2423
|
{ value: "24H", label: "Past 24 Hours" },
|
|
2426
2424
|
{ value: "7D", label: "Past 7 Days" },
|
|
2427
2425
|
{ value: "30D", label: "Past 30 Days" }
|
|
2428
|
-
].map((option) => /* @__PURE__ */
|
|
2426
|
+
].map((option) => /* @__PURE__ */ React30.createElement(
|
|
2429
2427
|
"button",
|
|
2430
2428
|
{
|
|
2431
2429
|
key: option.value,
|
|
@@ -2436,9 +2434,9 @@ var UniversalBillingPage = ({
|
|
|
2436
2434
|
},
|
|
2437
2435
|
className: `text-left px-4 py-3 text-[12px] tracking-wide transition-colors rounded-full flex items-center justify-between outline-none ${timeframe === option.value ? "bg-neutral-100 text-black" : "text-neutral-500 hover:bg-neutral-50 hover:text-black"}`
|
|
2438
2436
|
},
|
|
2439
|
-
/* @__PURE__ */
|
|
2440
|
-
timeframe === option.value && /* @__PURE__ */
|
|
2441
|
-
))), /* @__PURE__ */
|
|
2437
|
+
/* @__PURE__ */ React30.createElement("span", { className: "truncate pr-2" }, option.label),
|
|
2438
|
+
timeframe === option.value && /* @__PURE__ */ React30.createElement("div", { className: "w-1.5 h-1.5 bg-black rounded-full shrink-0" })
|
|
2439
|
+
))), /* @__PURE__ */ React30.createElement("div", { className: "w-full flex mt-2" }, /* @__PURE__ */ React30.createElement("button", { onClick: () => setIsTimeframeModalOpen(false), className: "w-full py-2.5 text-[13px] text-neutral-600 hover:bg-neutral-50 transition-colors outline-none" }, "Cancel")))), isActionModalOpen && isModMode && /* @__PURE__ */ React30.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ React30.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: () => !isUpdating && setIsActionModalOpen(false) }), /* @__PURE__ */ React30.createElement("div", { className: "relative w-80 bg-white shadow-2xl rounded-2xl flex flex-col items-center overflow-hidden animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React30.createElement("div", { className: "p-6 text-center w-full" }, /* @__PURE__ */ React30.createElement("h3", { className: " font-serif text-[14px] text-black tracking-tight mb-2" }, "Update Invoice Status"), /* @__PURE__ */ React30.createElement(
|
|
2442
2440
|
TextInput,
|
|
2443
2441
|
{
|
|
2444
2442
|
placeholder: "Enter 2FA Code...",
|
|
@@ -2446,7 +2444,7 @@ var UniversalBillingPage = ({
|
|
|
2446
2444
|
onChange: setTwoFactorCode,
|
|
2447
2445
|
type: "password"
|
|
2448
2446
|
}
|
|
2449
|
-
)), /* @__PURE__ */
|
|
2447
|
+
)), /* @__PURE__ */ React30.createElement("div", { className: "w-full flex flex-col pl-2 pr-2" }, ["SCHEDULED", "PAID", "FAILED", "CANCELED"].map((statusOption) => /* @__PURE__ */ React30.createElement(
|
|
2450
2448
|
"button",
|
|
2451
2449
|
{
|
|
2452
2450
|
key: statusOption,
|
|
@@ -2454,14 +2452,14 @@ var UniversalBillingPage = ({
|
|
|
2454
2452
|
disabled: isUpdating || !twoFactorCode,
|
|
2455
2453
|
className: `text-left px-4 py-3 text-[12px] tracking-wide transition-colors rounded-full flex items-center justify-between outline-none ${selectedInvoice?.status === statusOption ? "bg-neutral-100 text-black" : "text-neutral-500 hover:bg-neutral-50 hover:text-black"}`
|
|
2456
2454
|
},
|
|
2457
|
-
/* @__PURE__ */
|
|
2458
|
-
selectedInvoice?.status === statusOption && /* @__PURE__ */
|
|
2459
|
-
))), /* @__PURE__ */
|
|
2455
|
+
/* @__PURE__ */ React30.createElement("span", { className: "truncate pr-2" }, statusOption),
|
|
2456
|
+
selectedInvoice?.status === statusOption && /* @__PURE__ */ React30.createElement("div", { className: "w-1.5 h-1.5 bg-black rounded-full shrink-0" })
|
|
2457
|
+
))), /* @__PURE__ */ React30.createElement("div", { className: "w-full flex mt-2" }, /* @__PURE__ */ React30.createElement("button", { onClick: () => setIsActionModalOpen(false), disabled: isUpdating, className: "w-full py-2.5 text-[13px] text-neutral-600 hover:bg-neutral-50 transition-colors disabled:opacity-50 outline-none" }, "Cancel")))));
|
|
2460
2458
|
};
|
|
2461
2459
|
|
|
2462
2460
|
// src/components/UniversalDashboardPage.tsx
|
|
2463
|
-
import
|
|
2464
|
-
import { HugeiconsIcon as
|
|
2461
|
+
import React31, { useState as useState15 } from "react";
|
|
2462
|
+
import { HugeiconsIcon as HugeiconsIcon16 } from "@hugeicons/react";
|
|
2465
2463
|
import { ArrowDown01Icon as ArrowDown01Icon4, Loading03Icon as Loading03Icon8 } from "@hugeicons/core-free-icons";
|
|
2466
2464
|
var UniversalDashboardPage = ({
|
|
2467
2465
|
headerTitle,
|
|
@@ -2473,20 +2471,20 @@ var UniversalDashboardPage = ({
|
|
|
2473
2471
|
lists,
|
|
2474
2472
|
isLoading = false
|
|
2475
2473
|
}) => {
|
|
2476
|
-
const [isTimeframeModalOpen, setIsTimeframeModalOpen] =
|
|
2474
|
+
const [isTimeframeModalOpen, setIsTimeframeModalOpen] = useState15(false);
|
|
2477
2475
|
const selectedTimeframe = timeframes.find((t) => t.id === activeTimeframe) || timeframes[0];
|
|
2478
2476
|
if (isLoading) {
|
|
2479
|
-
return /* @__PURE__ */
|
|
2477
|
+
return /* @__PURE__ */ React31.createElement("div", { className: "flex justify-center items-center py-12" }, /* @__PURE__ */ React31.createElement(HugeiconsIcon16, { icon: Loading03Icon8, size: 32, className: "animate-spin mb-4 text-black" }));
|
|
2480
2478
|
}
|
|
2481
|
-
return /* @__PURE__ */
|
|
2479
|
+
return /* @__PURE__ */ React31.createElement("div", { className: "flex flex-col gap-8 animate-in fade-in duration-300 pb-10" }, /* @__PURE__ */ React31.createElement(ManagedToaster, null), /* @__PURE__ */ React31.createElement("div", { className: "flex flex-col sm:flex-row items-start sm:items-center justify-between gap-4" }, /* @__PURE__ */ React31.createElement("div", null, /* @__PURE__ */ React31.createElement("h1", { className: " font-serif text-xl text-black mb-1 tracking-tight" }, headerTitle), /* @__PURE__ */ React31.createElement("p", { className: "text-xs text-neutral-500" }, headerDescription)), timeframes.length > 0 && selectedTimeframe && onTimeframeChange && /* @__PURE__ */ React31.createElement(
|
|
2482
2480
|
"button",
|
|
2483
2481
|
{
|
|
2484
2482
|
onClick: () => setIsTimeframeModalOpen(true),
|
|
2485
2483
|
className: "flex items-center gap-3 px-4 py-2 text-xs bg-white text-black outline-none rounded-full transition-colors hover:bg-neutral-50 shrink-0"
|
|
2486
2484
|
},
|
|
2487
|
-
/* @__PURE__ */
|
|
2488
|
-
/* @__PURE__ */
|
|
2489
|
-
)), stats.length > 0 && /* @__PURE__ */
|
|
2485
|
+
/* @__PURE__ */ React31.createElement("span", null, selectedTimeframe.label),
|
|
2486
|
+
/* @__PURE__ */ React31.createElement(HugeiconsIcon16, { icon: ArrowDown01Icon4, size: 14, className: "text-neutral-400" })
|
|
2487
|
+
)), stats.length > 0 && /* @__PURE__ */ React31.createElement("div", { className: "w-full rounded-2xl overflow-hidden bg-white" }, /* @__PURE__ */ React31.createElement("div", { className: "grid grid-cols-2 md:grid-cols-5 divide-y md:divide-y-0 md:divide-x divide-neutral-100" }, stats.map((stat, idx) => /* @__PURE__ */ React31.createElement("div", { key: idx, className: "p-6 flex flex-col gap-1 min-w-0" }, /* @__PURE__ */ React31.createElement("p", { className: "text-[10px] tracking-[0.2em] text-neutral-400 truncate uppercase" }, stat.label), /* @__PURE__ */ React31.createElement("p", { className: `text-xl tracking-tight truncate ${stat.valueClass || "text-black"}` }, stat.value))))), lists.length > 0 && /* @__PURE__ */ React31.createElement("div", { className: "flex flex-col gap-8 w-full max-w-4xl" }, lists.map((list, idx) => /* @__PURE__ */ React31.createElement("div", { key: idx, className: "bg-white rounded-2xl p-6 flex flex-col min-w-0" }, /* @__PURE__ */ React31.createElement("div", { className: "flex items-center gap-3 mb-6" }, /* @__PURE__ */ React31.createElement("div", { className: "text-neutral-400" }, list.icon), /* @__PURE__ */ React31.createElement("h2", { className: " font-serif text-[11px] text-black tracking-[0.2em] uppercase" }, list.title)), /* @__PURE__ */ React31.createElement("div", { className: "divide-y divide-neutral-100 flex-1 overflow-y-auto" }, list.items.length === 0 ? /* @__PURE__ */ React31.createElement("p", { className: "text-xs text-neutral-500 py-4" }, list.emptyMessage) : list.items.map((item) => /* @__PURE__ */ React31.createElement("div", { key: item.id, className: "flex flex-col sm:flex-row sm:items-center justify-between py-4 gap-2 min-w-0 group" }, /* @__PURE__ */ React31.createElement("div", { className: "min-w-0 flex-1" }, /* @__PURE__ */ React31.createElement("p", { className: "text-sm text-black truncate pr-4" }, item.primaryText), /* @__PURE__ */ React31.createElement("p", { className: "text-[10px] text-neutral-500 truncate tracking-widest mt-0.5" }, item.secondaryText)), /* @__PURE__ */ React31.createElement("div", { className: "flex items-center gap-4 shrink-0 pl-4" }, item.rightText && /* @__PURE__ */ React31.createElement("p", { className: "text-xs text-black" }, item.rightText), item.rightBadge && /* @__PURE__ */ React31.createElement("span", { className: `text-[9px] tracking-widest px-2.5 py-1 rounded-full ${item.rightBadgeClass || "bg-neutral-50 text-neutral-600"}` }, item.rightBadge)))))))), isTimeframeModalOpen && timeframes.length > 0 && onTimeframeChange && /* @__PURE__ */ React31.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ React31.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: () => setIsTimeframeModalOpen(false) }), /* @__PURE__ */ React31.createElement("div", { className: "relative w-72 bg-white shadow-2xl rounded-2xl flex flex-col items-center overflow-hidden animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React31.createElement("div", { className: "p-6 text-center w-full" }, /* @__PURE__ */ React31.createElement("h3", { className: " font-serif text-[14px] text-black tracking-tight" }, "Select Timeframe")), /* @__PURE__ */ React31.createElement("div", { className: "w-full flex flex-col pl-2 pr-2 pb-2" }, timeframes.map((tf) => /* @__PURE__ */ React31.createElement(
|
|
2490
2488
|
"button",
|
|
2491
2489
|
{
|
|
2492
2490
|
key: tf.id,
|
|
@@ -2496,9 +2494,9 @@ var UniversalDashboardPage = ({
|
|
|
2496
2494
|
},
|
|
2497
2495
|
className: `text-left px-4 py-3 text-[12px] tracking-wide transition-colors rounded-full flex items-center justify-between outline-none ${activeTimeframe === tf.id ? "bg-neutral-100 text-black" : "text-neutral-500 hover:bg-neutral-50 hover:text-black"}`
|
|
2498
2496
|
},
|
|
2499
|
-
/* @__PURE__ */
|
|
2500
|
-
activeTimeframe === tf.id && /* @__PURE__ */
|
|
2501
|
-
))), /* @__PURE__ */
|
|
2497
|
+
/* @__PURE__ */ React31.createElement("span", { className: "truncate pr-2" }, tf.label),
|
|
2498
|
+
activeTimeframe === tf.id && /* @__PURE__ */ React31.createElement("div", { className: "w-1.5 h-1.5 bg-black rounded-full shrink-0" })
|
|
2499
|
+
))), /* @__PURE__ */ React31.createElement("div", { className: "w-full flex border-t border-neutral-50" }, /* @__PURE__ */ React31.createElement(
|
|
2502
2500
|
"button",
|
|
2503
2501
|
{
|
|
2504
2502
|
onClick: () => setIsTimeframeModalOpen(false),
|
|
@@ -2509,8 +2507,8 @@ var UniversalDashboardPage = ({
|
|
|
2509
2507
|
};
|
|
2510
2508
|
|
|
2511
2509
|
// src/components/UniversalAgentConsole.tsx
|
|
2512
|
-
import
|
|
2513
|
-
import { HugeiconsIcon as
|
|
2510
|
+
import React32, { useState as useState16, useRef as useRef5 } from "react";
|
|
2511
|
+
import { HugeiconsIcon as HugeiconsIcon17 } from "@hugeicons/react";
|
|
2514
2512
|
import {
|
|
2515
2513
|
ArrowLeft01Icon as ArrowLeft01Icon5,
|
|
2516
2514
|
ArrowRight01Icon as ArrowRight01Icon5,
|
|
@@ -2552,12 +2550,12 @@ var UniversalAgentConsole = ({
|
|
|
2552
2550
|
onDeleteArchive
|
|
2553
2551
|
}) => {
|
|
2554
2552
|
const archiveRef = useRef5(null);
|
|
2555
|
-
const [pendingFiles, setPendingFiles] =
|
|
2556
|
-
const [isUploading, setIsUploading] =
|
|
2557
|
-
const [isActioning, setIsActioning] =
|
|
2558
|
-
const [actionModal, setActionModal] =
|
|
2559
|
-
const [actionMessage, setActionMessage] =
|
|
2560
|
-
const [archiveToDelete, setArchiveToDelete] =
|
|
2553
|
+
const [pendingFiles, setPendingFiles] = useState16([]);
|
|
2554
|
+
const [isUploading, setIsUploading] = useState16(false);
|
|
2555
|
+
const [isActioning, setIsActioning] = useState16(false);
|
|
2556
|
+
const [actionModal, setActionModal] = useState16(null);
|
|
2557
|
+
const [actionMessage, setActionMessage] = useState16("");
|
|
2558
|
+
const [archiveToDelete, setArchiveToDelete] = useState16(null);
|
|
2561
2559
|
const handleFileSelect = (e) => {
|
|
2562
2560
|
if (e.target.files && e.target.files.length > 0) {
|
|
2563
2561
|
setPendingFiles((prev) => [...prev, ...Array.from(e.target.files)]);
|
|
@@ -2586,36 +2584,36 @@ var UniversalAgentConsole = ({
|
|
|
2586
2584
|
}
|
|
2587
2585
|
};
|
|
2588
2586
|
const DynamicArrayAccordion = ({ items, parentKey }) => {
|
|
2589
|
-
const [activeFAQ, setActiveFAQ] =
|
|
2590
|
-
return /* @__PURE__ */
|
|
2587
|
+
const [activeFAQ, setActiveFAQ] = useState16(null);
|
|
2588
|
+
return /* @__PURE__ */ React32.createElement("div", { className: "flex flex-col relative z-10 bg-transparent w-full mt-2 border-t border-neutral-100" }, items.map((item, index) => {
|
|
2591
2589
|
const isOpen = activeFAQ === index;
|
|
2592
2590
|
let label = `${parentKey ? formatKeyName(parentKey) : "Item"} ${index + 1}`;
|
|
2593
2591
|
if (item.fullName) label = toTitleCaseSafe(item.fullName);
|
|
2594
2592
|
else if (item.role) label = item.role;
|
|
2595
2593
|
else if (item.proposedName) label = toTitleCaseSafe(item.proposedName);
|
|
2596
|
-
return /* @__PURE__ */
|
|
2594
|
+
return /* @__PURE__ */ React32.createElement("div", { key: index, className: `transition-all duration-300 ${index !== items.length - 1 ? "border-b border-neutral-100" : ""}` }, /* @__PURE__ */ React32.createElement("button", { className: "flex items-center justify-between w-full gap-4 text-left py-5 md:py-6 group outline-none bg-transparent", onClick: () => setActiveFAQ(isOpen ? null : index) }, /* @__PURE__ */ React32.createElement("span", { className: `text-[13px] md:text-[14px] transition-colors ${isOpen ? "text-black" : "text-neutral-700 group-hover:text-black"}` }, label), /* @__PURE__ */ React32.createElement("div", { className: `shrink-0 flex items-center justify-center w-8 h-8 rounded-full border transition-all duration-300 ${isOpen ? "rotate-180 border-black text-black" : "border-neutral-300 text-neutral-500"}` }, /* @__PURE__ */ React32.createElement(HugeiconsIcon17, { icon: ArrowDown01Icon5, size: 16 }))), /* @__PURE__ */ React32.createElement("div", { className: `grid transition-all duration-300 ease-in-out ${isOpen ? "grid-rows-[1fr] pb-6 md:pb-8 opacity-100" : "grid-rows-[0fr] opacity-0"}` }, /* @__PURE__ */ React32.createElement("div", { className: "overflow-hidden" }, /* @__PURE__ */ React32.createElement("div", { className: "pt-2 flex flex-col gap-3 pr-4 md:pr-12" }, renderDynamicObject(item)))));
|
|
2597
2595
|
}));
|
|
2598
2596
|
};
|
|
2599
2597
|
const renderValue = (key, value) => {
|
|
2600
2598
|
if (value === null || value === void 0 || value === "") return null;
|
|
2601
2599
|
if (typeof value === "string") {
|
|
2602
|
-
if (value.startsWith("http") || value.startsWith("data:image")) return /* @__PURE__ */
|
|
2603
|
-
if (key.toLowerCase().includes("name") && !value.includes("@")) return /* @__PURE__ */
|
|
2604
|
-
return /* @__PURE__ */
|
|
2600
|
+
if (value.startsWith("http") || value.startsWith("data:image")) return /* @__PURE__ */ React32.createElement("a", { href: value, download: true, target: "_blank", rel: "noopener noreferrer", className: "flex items-center gap-2 px-5 py-2 bg-white border border-neutral-100 text-black text-[11px] tracking-widest rounded-full hover:bg-neutral-50 transition-colors w-fit outline-none mt-2" }, /* @__PURE__ */ React32.createElement(HugeiconsIcon17, { icon: Download01Icon, size: 14 }), " Download File");
|
|
2601
|
+
if (key.toLowerCase().includes("name") && !value.includes("@")) return /* @__PURE__ */ React32.createElement("p", { className: "text-[12px] md:text-[13px] leading-[1.8] text-neutral-600" }, toTitleCaseSafe(value));
|
|
2602
|
+
return /* @__PURE__ */ React32.createElement("p", { className: "text-[12px] md:text-[13px] leading-[1.8] text-neutral-600" }, value);
|
|
2605
2603
|
}
|
|
2606
2604
|
if (Array.isArray(value)) {
|
|
2607
2605
|
const validItems = value.filter((item) => item !== null && item !== void 0 && item !== "");
|
|
2608
2606
|
if (validItems.length === 0) return null;
|
|
2609
|
-
if (typeof validItems[0] === "string") return /* @__PURE__ */
|
|
2610
|
-
return /* @__PURE__ */
|
|
2607
|
+
if (typeof validItems[0] === "string") return /* @__PURE__ */ React32.createElement("ul", { className: "list-disc pl-4 mt-1" }, validItems.map((v, i) => /* @__PURE__ */ React32.createElement("li", { key: i, className: "text-[12px] md:text-[13px] leading-[1.8] text-neutral-600" }, toTitleCaseSafe(v))));
|
|
2608
|
+
return /* @__PURE__ */ React32.createElement(DynamicArrayAccordion, { items: validItems, parentKey: key });
|
|
2611
2609
|
}
|
|
2612
2610
|
if (typeof value === "object") {
|
|
2613
2611
|
if (Object.keys(value).length === 0) return null;
|
|
2614
2612
|
const renderedObj = renderDynamicObject(value);
|
|
2615
2613
|
if (!renderedObj || Array.isArray(renderedObj) && renderedObj.length === 0) return null;
|
|
2616
|
-
return /* @__PURE__ */
|
|
2614
|
+
return /* @__PURE__ */ React32.createElement("div", { className: "flex flex-col gap-3 mt-1 w-full border-l border-neutral-100 pl-4 py-2" }, renderedObj);
|
|
2617
2615
|
}
|
|
2618
|
-
return /* @__PURE__ */
|
|
2616
|
+
return /* @__PURE__ */ React32.createElement("span", { className: "text-sm text-black" }, String(value));
|
|
2619
2617
|
};
|
|
2620
2618
|
const renderDynamicObject = (obj) => {
|
|
2621
2619
|
if (!obj) return null;
|
|
@@ -2626,22 +2624,22 @@ var UniversalAgentConsole = ({
|
|
|
2626
2624
|
return true;
|
|
2627
2625
|
});
|
|
2628
2626
|
if (entries.length === 0) return null;
|
|
2629
|
-
return entries.map(([k, v]) => /* @__PURE__ */
|
|
2627
|
+
return entries.map(([k, v]) => /* @__PURE__ */ React32.createElement("div", { key: k, className: "flex flex-col items-start min-w-0 wrap-break-word w-full mb-3 last:mb-0" }, /* @__PURE__ */ React32.createElement("span", { className: "text-[10px] tracking-[0.2em] text-neutral-400 mb-1 uppercase" }, formatKeyName(k)), renderValue(k, v)));
|
|
2630
2628
|
};
|
|
2631
|
-
return /* @__PURE__ */
|
|
2629
|
+
return /* @__PURE__ */ React32.createElement("div", { className: "flex flex-col gap-8 animate-in fade-in duration-300 pb-10" }, /* @__PURE__ */ React32.createElement(ManagedToaster, null), currentView === "list" && /* @__PURE__ */ React32.createElement(React32.Fragment, null, /* @__PURE__ */ React32.createElement("div", { className: "flex flex-col items-start gap-1" }, /* @__PURE__ */ React32.createElement("h1", { className: " font-serif text-xl text-black tracking-tight" }, headerTitle), /* @__PURE__ */ React32.createElement("p", { className: "text-sm text-neutral-500" }, headerDescription)), stats.length > 0 && /* @__PURE__ */ React32.createElement("div", { className: "w-full rounded-2xl max-w-3xl overflow-hidden bg-white" }, /* @__PURE__ */ React32.createElement("div", { className: "grid grid-cols-1 md:grid-cols-3 divide-y md:divide-y-0 md:divide-x divide-neutral-100" }, stats.map((stat, idx) => /* @__PURE__ */ React32.createElement("div", { key: idx, className: "p-6 flex items-center gap-4 hover:bg-neutral-50/50 transition-colors min-w-0" }, /* @__PURE__ */ React32.createElement("div", { className: "w-12 h-12 rounded-full border border-neutral-100 bg-white flex items-center justify-center text-black shrink-0" }, stat.icon), /* @__PURE__ */ React32.createElement("div", { className: "min-w-0 flex-1" }, /* @__PURE__ */ React32.createElement("p", { className: "text-[10px] tracking-[0.2em] text-neutral-400 mb-1 truncate uppercase" }, stat.label), /* @__PURE__ */ React32.createElement("p", { className: "text-xl text-black tracking-tight truncate" }, stat.value)))))), tabs.length > 0 && /* @__PURE__ */ React32.createElement("div", { className: "flex items-center gap-6" }, tabs.map((tab) => /* @__PURE__ */ React32.createElement("button", { key: tab.id, onClick: () => onTabChange(tab.id), className: `pb-3 text-sm transition-colors outline-none ${activeTab === tab.id ? "text-black border-b border-black" : "text-neutral-400 hover:text-black"}` }, tab.label))), /* @__PURE__ */ React32.createElement("div", { className: "w-full bg-white rounded-2xl max-w-3xl overflow-hidden flex flex-col min-h-100" }, isLoadingList ? /* @__PURE__ */ React32.createElement("div", { className: "flex justify-center items-center py-12" }, /* @__PURE__ */ React32.createElement(HugeiconsIcon17, { icon: Loading03Icon9, size: 32, className: "animate-spin text-black" })) : listData.length === 0 ? /* @__PURE__ */ React32.createElement(React32.Fragment, null, /* @__PURE__ */ React32.createElement("div", { className: "flex-1 flex justify-center items-center text-neutral-500 text-sm py-20" }, "No matching applications found.")) : /* @__PURE__ */ React32.createElement(React32.Fragment, null, /* @__PURE__ */ React32.createElement("div", { className: "divide-y divide-neutral-100 flex-1" }, listData.map((item) => /* @__PURE__ */ React32.createElement("div", { key: item.id, onClick: () => onRowClick(item.id), className: "flex items-center justify-between p-5 hover:bg-neutral-50/50 transition-colors cursor-pointer group min-w-0" }, /* @__PURE__ */ React32.createElement("div", { className: "min-w-0 flex-1" }, /* @__PURE__ */ React32.createElement("p", { className: "text-sm text-black truncate pr-4" }, item.title), /* @__PURE__ */ React32.createElement("p", { className: "text-xs text-neutral-500 truncate mt-1" }, item.subtitle)), /* @__PURE__ */ React32.createElement("div", { className: "flex flex-col items-end gap-1 shrink-0 pl-4" }, /* @__PURE__ */ React32.createElement("span", { className: `text-[10px] tracking-widest px-3 py-1 rounded-full uppercase ${item.status === "COMPLETED" ? "bg-emerald-50 text-emerald-600" : "bg-neutral-50 text-neutral-600"}` }, item.status.replace(/_/g, " ")), /* @__PURE__ */ React32.createElement("span", { className: "text-[10px] text-neutral-400 mt-1" }, item.date))))), totalPages > 1 && /* @__PURE__ */ React32.createElement("div", { className: "flex items-center justify-between p-5 bg-neutral-50/50" }, /* @__PURE__ */ React32.createElement("span", { className: "text-[10px] text-neutral-400 tracking-[0.2em]" }, "Page ", currentPage, " of ", totalPages), /* @__PURE__ */ React32.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React32.createElement("button", { onClick: () => onPageChange(currentPage - 1), disabled: currentPage === 1, className: "p-2 border border-neutral-100 rounded-full bg-white text-neutral-500 hover:text-black outline-none disabled:opacity-30" }, /* @__PURE__ */ React32.createElement(HugeiconsIcon17, { icon: ArrowLeft01Icon5, size: 14 })), /* @__PURE__ */ React32.createElement("button", { onClick: () => onPageChange(currentPage + 1), disabled: currentPage >= totalPages, className: "p-2 border border-neutral-100 rounded-full bg-white text-neutral-500 hover:text-black outline-none disabled:opacity-30" }, /* @__PURE__ */ React32.createElement(HugeiconsIcon17, { icon: ArrowRight01Icon5, size: 14 }))))))), currentView === "details" && selectedApp && /* @__PURE__ */ React32.createElement("div", { className: "w-full bg-white rounded-2xl p-6 sm:p-10 animate-in fade-in duration-300 max-w-3xl flex flex-col" }, /* @__PURE__ */ React32.createElement("div", { className: "flex items-center justify-between gap-4 pb-6" }, /* @__PURE__ */ React32.createElement("button", { onClick: () => {
|
|
2632
2630
|
onBackToList();
|
|
2633
2631
|
setPendingFiles([]);
|
|
2634
|
-
}, className: "flex items-center gap-2 text-[10px] text-neutral-400 hover:text-black tracking-widest transition-colors outline-none uppercase" }, /* @__PURE__ */
|
|
2632
|
+
}, className: "flex items-center gap-2 text-[10px] text-neutral-400 hover:text-black tracking-widest transition-colors outline-none uppercase" }, /* @__PURE__ */ React32.createElement(HugeiconsIcon17, { icon: ArrowLeft01Icon5, size: 14 }), " Back to List"), /* @__PURE__ */ React32.createElement("span", { className: `text-[10px] tracking-widest px-4 py-1.5 rounded-full uppercase ${selectedApp.status === "COMPLETED" ? "bg-emerald-50 text-emerald-600" : "bg-neutral-50 text-neutral-600"}` }, selectedApp.status.replace(/_/g, " "))), /* @__PURE__ */ React32.createElement("div", { className: "flex flex-col gap-2 mb-8" }, /* @__PURE__ */ React32.createElement("h2", { className: " font-serif text-xl text-black tracking-tight" }, selectedApp.name || selectedApp.title), /* @__PURE__ */ React32.createElement("p", { className: "text-sm text-neutral-500" }, selectedApp.type ? selectedApp.type.replace(/_/g, " ").toLowerCase().replace(/\b\w/g, (c) => c.toUpperCase()) : selectedApp.subtitle)), selectedApp.agentId === currentAgentId && selectedApp.metadata && Object.keys(selectedApp.metadata).length > 0 ? /* @__PURE__ */ React32.createElement("div", { className: "flex flex-col gap-5" }, renderDynamicObject(selectedApp.metadata)) : selectedApp.agentId === currentAgentId ? /* @__PURE__ */ React32.createElement("div", { className: "flex flex-col gap-5" }, /* @__PURE__ */ React32.createElement("p", { className: "text-sm text-neutral-500" }, "No application data extracted.")) : null, selectedApp.agentId && /* @__PURE__ */ React32.createElement("div", { className: "flex flex-col gap-4 pt-8 mt-4 border-t border-neutral-100" }, /* @__PURE__ */ React32.createElement("div", { className: "flex flex-col gap-1 mb-4" }, /* @__PURE__ */ React32.createElement("h3", { className: " font-serif text-sm text-black" }, "Official Archives"), /* @__PURE__ */ React32.createElement("p", { className: "text-xs text-neutral-500 leading-relaxed" }, "Upload final certificates or documents. Once marked completed, the archive unlocks for the user.")), selectedApp.archives?.map((arch) => /* @__PURE__ */ React32.createElement("div", { key: arch.id, className: "flex items-center justify-between p-4 bg-emerald-50 rounded-full text-emerald-800 text-sm w-full" }, /* @__PURE__ */ React32.createElement("div", { className: "flex items-center gap-3 min-w-0" }, /* @__PURE__ */ React32.createElement(HugeiconsIcon17, { icon: File02Icon, size: 18, className: "shrink-0" }), /* @__PURE__ */ React32.createElement("span", { className: "truncate pr-2" }, arch.name)), /* @__PURE__ */ React32.createElement("button", { onClick: () => setArchiveToDelete(arch), className: "text-emerald-700 hover:text-red-500 transition-colors p-1 outline-none shrink-0" }, /* @__PURE__ */ React32.createElement(HugeiconsIcon17, { icon: Delete02Icon, size: 16 })))), pendingFiles.map((file, idx) => /* @__PURE__ */ React32.createElement("div", { key: idx, className: "flex items-center justify-between text-neutral-600 text-sm w-full" }, /* @__PURE__ */ React32.createElement("div", { className: "flex items-center gap-3 min-w-0" }, /* @__PURE__ */ React32.createElement(HugeiconsIcon17, { icon: AttachmentIcon, size: 18, className: "shrink-0" }), /* @__PURE__ */ React32.createElement("span", { className: "truncate pr-2" }, file.name)), /* @__PURE__ */ React32.createElement("button", { onClick: () => setPendingFiles((p) => p.filter((_, i) => i !== idx)), className: "text-neutral-400 hover:text-red-500 transition-colors p-1 outline-none shrink-0" }, /* @__PURE__ */ React32.createElement(HugeiconsIcon17, { icon: Cancel01Icon, size: 16 })))), /* @__PURE__ */ React32.createElement("input", { type: "file", multiple: true, ref: archiveRef, onChange: handleFileSelect, className: "hidden", accept: "application/pdf,image/*" }), /* @__PURE__ */ React32.createElement("div", { className: "flex flex-col sm:flex-row items-center gap-3 w-full" }, /* @__PURE__ */ React32.createElement("button", { onClick: () => archiveRef.current?.click(), disabled: selectedApp.status !== "COMPLETED" || isUploading, className: "flex items-center justify-center gap-3 p-4 border border-neutral-100 rounded-full hover:bg-neutral-50 transition-colors text-black text-sm w-full outline-none disabled:opacity-50" }, /* @__PURE__ */ React32.createElement(HugeiconsIcon17, { icon: Upload01Icon, size: 18, className: "text-neutral-400" }), " Select Files to Upload"), pendingFiles.length > 0 && /* @__PURE__ */ React32.createElement("div", { className: "flex flex-col sm:flex-row items-center gap-3 w-full sm:w-auto shrink-0" }, /* @__PURE__ */ React32.createElement("button", { onClick: () => setPendingFiles([]), disabled: isUploading, className: "px-6 py-2 text-neutral-600 text-[11px] tracking-widest rounded-full hover:bg-neutral-200 outline-none w-full sm:w-auto uppercase" }, "Clear All"), /* @__PURE__ */ React32.createElement(ThreeDActionButton, { onClick: executeUpload, disabled: isUploading, isLoading: isUploading, className: "w-full sm:w-auto" }, "Upload ", pendingFiles.length, " File(s)")))), /* @__PURE__ */ React32.createElement("div", { className: "flex flex-col sm:flex-row items-center justify-between gap-4 mt-8 pt-6" }, !selectedApp.agentId ? /* @__PURE__ */ React32.createElement(ThreeDActionButton, { onClick: async () => {
|
|
2635
2633
|
setIsActioning(true);
|
|
2636
2634
|
await onAcceptApplication(selectedApp.id);
|
|
2637
2635
|
setIsActioning(false);
|
|
2638
|
-
}, disabled: isActioning, isLoading: isActioning, className: "w-full sm:w-auto" }, "Accept Application") : selectedApp.agentId !== currentAgentId ? /* @__PURE__ */
|
|
2636
|
+
}, disabled: isActioning, isLoading: isActioning, className: "w-full sm:w-auto" }, "Accept Application") : selectedApp.agentId !== currentAgentId ? /* @__PURE__ */ React32.createElement("div", { className: "w-full p-4 border border-red-100 bg-red-50/30 rounded-xl flex items-start gap-3" }, /* @__PURE__ */ React32.createElement(HugeiconsIcon17, { icon: Cancel01Icon, size: 16, className: "text-red-500 shrink-0 mt-0.5" }), /* @__PURE__ */ React32.createElement("div", null, /* @__PURE__ */ React32.createElement("p", { className: "text-sm text-red-700" }, "Application Taken"), /* @__PURE__ */ React32.createElement("p", { className: "text-xs text-red-600 mt-1" }, "Currently handled by ", selectedApp.agentName || "another agent", "."))) : /* @__PURE__ */ React32.createElement("div", { className: "w-full flex flex-col sm:flex-row items-center gap-4 justify-between" }, /* @__PURE__ */ React32.createElement("p", { className: "text-xs text-neutral-500" }, "You are the assigned agent."), /* @__PURE__ */ React32.createElement("div", { className: "flex flex-col sm:flex-row items-center justify-end gap-3 w-full sm:w-auto" }, /* @__PURE__ */ React32.createElement("button", { onClick: () => setActionModal("query"), disabled: selectedApp.status === "COMPLETED", className: "w-full sm:w-auto px-6 py-2 bg-white border border-neutral-100 text-neutral-600 text-[11px] tracking-widest rounded-full hover:bg-neutral-50 transition-colors outline-none disabled:opacity-30 uppercase" }, "Query"), /* @__PURE__ */ React32.createElement("button", { onClick: () => setActionModal("reject"), disabled: selectedApp.status === "COMPLETED", className: "w-full sm:w-auto px-6 py-2 bg-white border border-neutral-100 text-neutral-600 text-[11px] tracking-widest rounded-full hover:bg-neutral-50 transition-colors outline-none disabled:opacity-30 uppercase" }, "Reject"), /* @__PURE__ */ React32.createElement(ThreeDActionButton, { onClick: () => setActionModal("success"), disabled: selectedApp.status === "COMPLETED", className: "w-full sm:w-auto" }, "Mark Success"))))), actionModal && /* @__PURE__ */ React32.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ React32.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: () => !isActioning && setActionModal(null) }), /* @__PURE__ */ React32.createElement("div", { className: "relative w-full max-w-md bg-white rounded-3xl flex flex-col overflow-hidden animate-in zoom-in-95 duration-200 text-left" }, /* @__PURE__ */ React32.createElement("div", { className: "p-6" }, /* @__PURE__ */ React32.createElement("h3", { className: " font-serif text-lg text-black tracking-tight capitalize mb-2" }, actionModal === "success" ? "Complete Application" : `${actionModal} Application`), /* @__PURE__ */ React32.createElement("p", { className: "text-xs text-neutral-500" }, actionModal === "success" ? "Are you sure you want to mark this application as successfully completed?" : `Please provide a clear reason for the user. They will see this message and be asked to fix their application.`)), (actionModal === "query" || actionModal === "reject") && /* @__PURE__ */ React32.createElement("div", { className: "p-6 pb-2" }, /* @__PURE__ */ React32.createElement(TextInput, { label: "Reason for Action", value: actionMessage, onChange: setActionMessage, placeholder: "Enter your reason here...", disabled: isActioning })), /* @__PURE__ */ React32.createElement("div", { className: "flex items-center p-6 pt-4 gap-3" }, /* @__PURE__ */ React32.createElement("button", { onClick: () => setActionModal(null), disabled: isActioning, className: "flex-1 py-3 text-[11px] tracking-widest uppercase text-neutral-600 rounded-full hover:bg-neutral-50 transition-colors outline-none disabled:opacity-50" }, "Cancel"), /* @__PURE__ */ React32.createElement(ThreeDActionButton, { onClick: async () => {
|
|
2639
2637
|
setIsActioning(true);
|
|
2640
2638
|
await onUpdateStatus(selectedApp.id, actionModal === "success" ? "COMPLETED" : actionModal === "reject" ? "REJECTED" : "QUEUED", actionMessage);
|
|
2641
2639
|
setIsActioning(false);
|
|
2642
2640
|
setActionModal(null);
|
|
2643
2641
|
setActionMessage("");
|
|
2644
|
-
}, disabled: isActioning || (actionModal === "query" || actionModal === "reject") && actionMessage.trim().length < 5, isLoading: isActioning, className: "flex-1" }, "Confirm ", actionModal)))), archiveToDelete && /* @__PURE__ */
|
|
2642
|
+
}, disabled: isActioning || (actionModal === "query" || actionModal === "reject") && actionMessage.trim().length < 5, isLoading: isActioning, className: "flex-1" }, "Confirm ", actionModal)))), archiveToDelete && /* @__PURE__ */ React32.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ React32.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: () => !isActioning && setArchiveToDelete(null) }), /* @__PURE__ */ React32.createElement("div", { className: "relative w-full max-w-md bg-white rounded-3xl flex flex-col overflow-hidden animate-in zoom-in-95 duration-200 text-left" }, /* @__PURE__ */ React32.createElement("div", { className: "p-6" }, /* @__PURE__ */ React32.createElement("h3", { className: " font-serif text-lg text-black tracking-tight mb-2" }, "Delete Document?"), /* @__PURE__ */ React32.createElement("p", { className: "text-xs text-neutral-500" }, 'Are you sure you want to permanently delete "', archiveToDelete.name, '"?')), /* @__PURE__ */ React32.createElement("div", { className: "flex items-center p-6 gap-3" }, /* @__PURE__ */ React32.createElement("button", { onClick: () => setArchiveToDelete(null), disabled: isActioning, className: "flex-1 py-3 text-[11px] tracking-widest uppercase text-neutral-600 rounded-full hover:bg-neutral-50 transition-colors outline-none disabled:opacity-50" }, "Cancel"), /* @__PURE__ */ React32.createElement(ThreeDActionButton, { onClick: async () => {
|
|
2645
2643
|
setIsActioning(true);
|
|
2646
2644
|
await onDeleteArchive(selectedApp.id, archiveToDelete.id);
|
|
2647
2645
|
setIsActioning(false);
|
|
@@ -2650,7 +2648,7 @@ var UniversalAgentConsole = ({
|
|
|
2650
2648
|
};
|
|
2651
2649
|
|
|
2652
2650
|
// src/components/UniversalOverviewPage.tsx
|
|
2653
|
-
import
|
|
2651
|
+
import React33 from "react";
|
|
2654
2652
|
var UniversalOverviewPage = ({
|
|
2655
2653
|
headerTitle,
|
|
2656
2654
|
headerDescription,
|
|
@@ -2660,7 +2658,7 @@ var UniversalOverviewPage = ({
|
|
|
2660
2658
|
primaryAction,
|
|
2661
2659
|
alerts = []
|
|
2662
2660
|
}) => {
|
|
2663
|
-
return /* @__PURE__ */
|
|
2661
|
+
return /* @__PURE__ */ React33.createElement("div", { className: "flex flex-col gap-8 animate-in fade-in duration-300 pb-10" }, /* @__PURE__ */ React33.createElement("div", { className: "flex items-center justify-between gap-4" }, /* @__PURE__ */ React33.createElement("div", null, /* @__PURE__ */ React33.createElement("h1", { className: " font-serif text-xl text-black mb-1 tracking-tight" }, headerTitle), /* @__PURE__ */ React33.createElement("p", { className: "text-xs text-neutral-500" }, headerDescription))), quickStats.length > 0 && /* @__PURE__ */ React33.createElement("div", { className: "w-full rounded-2xl overflow-hidden max-w-3xl bg-white" }, /* @__PURE__ */ React33.createElement("div", { className: "grid grid-cols-1 md:grid-cols-3 divide-y md:divide-y-0 md:divide-x divide-neutral-100" }, quickStats.map((stat, idx) => /* @__PURE__ */ React33.createElement("div", { key: idx, className: "p-6 flex items-center gap-4 hover:bg-neutral-50/50 transition-colors min-w-0" }, /* @__PURE__ */ React33.createElement("div", { className: "w-12 h-12 rounded-full border border-neutral-100 bg-white flex items-center justify-center text-black shrink-0" }, stat.icon), /* @__PURE__ */ React33.createElement("div", { className: "min-w-0 flex-1" }, /* @__PURE__ */ React33.createElement("p", { className: "text-[10px] tracking-[0.2em] text-neutral-400 mb-1 truncate uppercase" }, stat.label), /* @__PURE__ */ React33.createElement("p", { className: "text-lg md:text-xl text-black tracking-tight truncate" }, stat.value)))))), /* @__PURE__ */ React33.createElement("div", { className: "w-full rounded-2xl max-w-3xl overflow-hidden bg-white min-w-0" }, /* @__PURE__ */ React33.createElement("div", { className: "p-6 sm:p-8 flex flex-col h-full min-w-0 gap-6" }, /* @__PURE__ */ React33.createElement("div", { className: "flex flex-wrap items-center justify-between gap-4 border-b border-neutral-100 pb-4" }, /* @__PURE__ */ React33.createElement("h3", { className: " font-serif text-[11px] text-black tracking-[0.2em] uppercase" }, detailsTitle), primaryAction && (primaryAction.href ? /* @__PURE__ */ React33.createElement(
|
|
2664
2662
|
ThreeDButton,
|
|
2665
2663
|
{
|
|
2666
2664
|
href: primaryAction.href,
|
|
@@ -2669,7 +2667,7 @@ var UniversalOverviewPage = ({
|
|
|
2669
2667
|
},
|
|
2670
2668
|
primaryAction.label,
|
|
2671
2669
|
primaryAction.icon
|
|
2672
|
-
) : /* @__PURE__ */
|
|
2670
|
+
) : /* @__PURE__ */ React33.createElement(
|
|
2673
2671
|
ThreeDActionButton,
|
|
2674
2672
|
{
|
|
2675
2673
|
onClick: primaryAction.onClick,
|
|
@@ -2678,18 +2676,18 @@ var UniversalOverviewPage = ({
|
|
|
2678
2676
|
},
|
|
2679
2677
|
primaryAction.label,
|
|
2680
2678
|
primaryAction.icon
|
|
2681
|
-
))), /* @__PURE__ */
|
|
2679
|
+
))), /* @__PURE__ */ React33.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-8" }, details.map((detail, idx) => /* @__PURE__ */ React33.createElement("div", { key: idx, className: "min-w-0" }, /* @__PURE__ */ React33.createElement("p", { className: "text-[10px] tracking-[0.2em] text-neutral-400 mb-1.5 uppercase" }, detail.label), /* @__PURE__ */ React33.createElement("p", { className: "text-[13px] text-black truncate" }, detail.value)))), alerts.map((alert, idx) => {
|
|
2682
2680
|
const bgClass = alert.type === "warning" ? "bg-amber-50/50" : alert.type === "info" ? "bg-blue-50/50" : "bg-red-50/50";
|
|
2683
2681
|
const textClass = alert.type === "warning" ? "text-amber-600" : alert.type === "info" ? "text-blue-600" : "text-red-600";
|
|
2684
2682
|
const valClass = alert.type === "warning" ? "text-amber-700" : alert.type === "info" ? "text-blue-700" : "text-red-700";
|
|
2685
2683
|
const lblClass = alert.type === "warning" ? "text-amber-400" : alert.type === "info" ? "text-blue-400" : "text-red-400";
|
|
2686
|
-
return /* @__PURE__ */
|
|
2684
|
+
return /* @__PURE__ */ React33.createElement("div", { key: idx, className: `mt-4 p-5 rounded-xl flex flex-col gap-4 ${bgClass}` }, /* @__PURE__ */ React33.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React33.createElement("span", { className: `text-[11px] tracking-widest uppercase ${textClass}` }, alert.title)), alert.items.map((item, itemIdx) => /* @__PURE__ */ React33.createElement("div", { key: itemIdx }, /* @__PURE__ */ React33.createElement("span", { className: `text-[10px] tracking-[0.2em] block mb-1 uppercase ${lblClass}` }, item.label), /* @__PURE__ */ React33.createElement("p", { className: `text-[13px] leading-relaxed ${valClass}` }, item.text))));
|
|
2687
2685
|
}))));
|
|
2688
2686
|
};
|
|
2689
2687
|
|
|
2690
2688
|
// src/components/UniversalErrorView.tsx
|
|
2691
|
-
import
|
|
2692
|
-
import { HugeiconsIcon as
|
|
2689
|
+
import React34 from "react";
|
|
2690
|
+
import { HugeiconsIcon as HugeiconsIcon18 } from "@hugeicons/react";
|
|
2693
2691
|
import { ConfusedIcon } from "@hugeicons/core-free-icons";
|
|
2694
2692
|
var UniversalErrorView = ({
|
|
2695
2693
|
isBooting,
|
|
@@ -2702,7 +2700,7 @@ var UniversalErrorView = ({
|
|
|
2702
2700
|
returnLabel = "Return to Workspace"
|
|
2703
2701
|
}) => {
|
|
2704
2702
|
if (isBooting || isLoading && !activeData) {
|
|
2705
|
-
return /* @__PURE__ */
|
|
2703
|
+
return /* @__PURE__ */ React34.createElement("div", { className: "flex items-center justify-center h-screen w-full bg-transparent" }, /* @__PURE__ */ React34.createElement(PageSpinner, null));
|
|
2706
2704
|
}
|
|
2707
2705
|
if (!isLoading && (!activeData || activeError)) {
|
|
2708
2706
|
const errorString = typeof activeError === "string" ? activeError : JSON.stringify(activeError || "");
|
|
@@ -2721,7 +2719,7 @@ var UniversalErrorView = ({
|
|
|
2721
2719
|
title = "Access Restricted";
|
|
2722
2720
|
description = apiMessage || `You have insufficient permissions to view this ${envName}. Please contact your administrator.`;
|
|
2723
2721
|
}
|
|
2724
|
-
return /* @__PURE__ */
|
|
2722
|
+
return /* @__PURE__ */ React34.createElement("div", { className: "flex flex-col items-center justify-center h-screen w-full px-4 animate-in fade-in duration-500" }, /* @__PURE__ */ React34.createElement("div", { className: "mb-4 flex justify-center" }, /* @__PURE__ */ React34.createElement(HugeiconsIcon18, { icon: IconComponent, size: 48, className: "text-neutral-300" })), /* @__PURE__ */ React34.createElement("h2", { className: " font-serif text-lg text-black tracking-tight " }, title), /* @__PURE__ */ React34.createElement("p", { className: "text-xs mt-2 mb-8 text-neutral-500 max-w-sm text-center leading-relaxed" }, description), /* @__PURE__ */ React34.createElement("div", { className: "flex flex-col sm:flex-row items-center gap-3 w-full justify-center sm:w-auto" }, isNotFoundError || isPermissionError ? /* @__PURE__ */ React34.createElement(
|
|
2725
2723
|
"button",
|
|
2726
2724
|
{
|
|
2727
2725
|
onClick: () => window.location.href = returnUrl,
|
|
@@ -2730,14 +2728,14 @@ var UniversalErrorView = ({
|
|
|
2730
2728
|
returnLabel
|
|
2731
2729
|
) : (
|
|
2732
2730
|
// Soft errors (Network timeouts) allow them to retry or optionally retreat
|
|
2733
|
-
/* @__PURE__ */
|
|
2731
|
+
/* @__PURE__ */ React34.createElement(React34.Fragment, null, envName.toLowerCase().includes("application") && /* @__PURE__ */ React34.createElement(
|
|
2734
2732
|
"button",
|
|
2735
2733
|
{
|
|
2736
2734
|
onClick: () => window.location.href = returnUrl,
|
|
2737
2735
|
className: "px-6 py-2 bg-transparent border border-neutral-100 hover:bg-neutral-50 text-neutral-600 hover:text-black rounded-full text-[11px] tracking-widest transition-colors w-full sm:w-auto outline-none"
|
|
2738
2736
|
},
|
|
2739
2737
|
"Back Home"
|
|
2740
|
-
), /* @__PURE__ */
|
|
2738
|
+
), /* @__PURE__ */ React34.createElement(
|
|
2741
2739
|
"button",
|
|
2742
2740
|
{
|
|
2743
2741
|
onClick: onRetry,
|
|
@@ -2752,8 +2750,8 @@ var UniversalErrorView = ({
|
|
|
2752
2750
|
};
|
|
2753
2751
|
|
|
2754
2752
|
// src/components/UniversalLookupPage.tsx
|
|
2755
|
-
import
|
|
2756
|
-
import { HugeiconsIcon as
|
|
2753
|
+
import React35, { useState as useState17 } from "react";
|
|
2754
|
+
import { HugeiconsIcon as HugeiconsIcon19 } from "@hugeicons/react";
|
|
2757
2755
|
import { Search01Icon } from "@hugeicons/core-free-icons";
|
|
2758
2756
|
var UniversalLookupPage = ({
|
|
2759
2757
|
headerTitle,
|
|
@@ -2768,9 +2766,9 @@ var UniversalLookupPage = ({
|
|
|
2768
2766
|
resultContent,
|
|
2769
2767
|
modals
|
|
2770
2768
|
}) => {
|
|
2771
|
-
const [isTypeModalOpen, setIsTypeModalOpen] =
|
|
2769
|
+
const [isTypeModalOpen, setIsTypeModalOpen] = useState17(false);
|
|
2772
2770
|
const currentOptionLabel = searchOptions.find((opt) => opt.value === selectedSearchType)?.label || "Select Type";
|
|
2773
|
-
return /* @__PURE__ */
|
|
2771
|
+
return /* @__PURE__ */ React35.createElement("div", { className: "flex flex-col max-w-3xl rounded-2xl p-6 bg-white gap-8 animate-in fade-in duration-300 pb-20" }, /* @__PURE__ */ React35.createElement(ManagedToaster, null), /* @__PURE__ */ React35.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-3 sm:gap-4" }, /* @__PURE__ */ React35.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React35.createElement("h1", { className: " font-serif text-xl text-black mb-1 truncate tracking-tight" }, headerTitle), /* @__PURE__ */ React35.createElement("p", { className: "text-xs text-neutral-500 truncate" }, headerDescription))), /* @__PURE__ */ React35.createElement("div", { className: "w-full max-w-2xl pb-8" }, /* @__PURE__ */ React35.createElement("form", { className: "flex flex-col gap-6", onSubmit: onSearch, autoComplete: "off" }, /* @__PURE__ */ React35.createElement("div", { className: "flex gap-4" }, /* @__PURE__ */ React35.createElement(
|
|
2774
2772
|
"button",
|
|
2775
2773
|
{
|
|
2776
2774
|
type: "button",
|
|
@@ -2778,7 +2776,7 @@ var UniversalLookupPage = ({
|
|
|
2778
2776
|
className: "mt-2 text-[12px] tracking-widest bg-transparent border-b border-neutral-100 text-black text-left outline-none focus:border-black shrink-0 uppercase"
|
|
2779
2777
|
},
|
|
2780
2778
|
currentOptionLabel
|
|
2781
|
-
), /* @__PURE__ */
|
|
2779
|
+
), /* @__PURE__ */ React35.createElement("div", { className: "flex-1" }, /* @__PURE__ */ React35.createElement(
|
|
2782
2780
|
TextInput,
|
|
2783
2781
|
{
|
|
2784
2782
|
placeholder: "Enter Exact ID, Email, or Slug...",
|
|
@@ -2786,7 +2784,7 @@ var UniversalLookupPage = ({
|
|
|
2786
2784
|
onChange: onSearchQueryChange,
|
|
2787
2785
|
disabled: isSearching
|
|
2788
2786
|
}
|
|
2789
|
-
))), /* @__PURE__ */
|
|
2787
|
+
))), /* @__PURE__ */ React35.createElement("div", { className: "flex justify-end" }, /* @__PURE__ */ React35.createElement(
|
|
2790
2788
|
ThreeDActionButton,
|
|
2791
2789
|
{
|
|
2792
2790
|
type: "submit",
|
|
@@ -2794,9 +2792,9 @@ var UniversalLookupPage = ({
|
|
|
2794
2792
|
isLoading: isSearching,
|
|
2795
2793
|
className: "min-w-32"
|
|
2796
2794
|
},
|
|
2797
|
-
/* @__PURE__ */
|
|
2795
|
+
/* @__PURE__ */ React35.createElement(HugeiconsIcon19, { icon: Search01Icon, size: 14, className: "mr-2" }),
|
|
2798
2796
|
" Lookup"
|
|
2799
|
-
)))), resultContent && /* @__PURE__ */
|
|
2797
|
+
)))), resultContent && /* @__PURE__ */ React35.createElement("div", { className: "w-full max-w-2xl bg-white text-left animate-in fade-in slide-in-from-bottom-4" }, /* @__PURE__ */ React35.createElement("h3", { className: " font-serif text-[10px] text-neutral-400 tracking-[0.2em] mb-6 uppercase" }, "Entity Record Found"), resultContent), isTypeModalOpen && /* @__PURE__ */ React35.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ React35.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: () => setIsTypeModalOpen(false) }), /* @__PURE__ */ React35.createElement("div", { className: "relative w-80 bg-white shadow-2xl rounded-2xl flex flex-col items-center overflow-hidden animate-in zoom-in-95 duration-200" }, /* @__PURE__ */ React35.createElement("div", { className: "p-6 text-center w-full" }, /* @__PURE__ */ React35.createElement("h3", { className: " font-serif text-[14px] text-black tracking-tight mb-2" }, "Select Entity Type")), /* @__PURE__ */ React35.createElement("div", { className: "w-full flex flex-col pl-2 pr-2 pb-2" }, searchOptions.map((option) => /* @__PURE__ */ React35.createElement(
|
|
2800
2798
|
"button",
|
|
2801
2799
|
{
|
|
2802
2800
|
key: option.value,
|
|
@@ -2807,16 +2805,16 @@ var UniversalLookupPage = ({
|
|
|
2807
2805
|
},
|
|
2808
2806
|
className: `text-left px-4 py-3 text-[12px] tracking-wide transition-colors rounded-full flex items-center justify-between outline-none ${selectedSearchType === option.value ? "bg-neutral-100 text-black" : "text-neutral-500 hover:bg-neutral-50 hover:text-black"}`
|
|
2809
2807
|
},
|
|
2810
|
-
/* @__PURE__ */
|
|
2811
|
-
selectedSearchType === option.value && /* @__PURE__ */
|
|
2812
|
-
))), /* @__PURE__ */
|
|
2808
|
+
/* @__PURE__ */ React35.createElement("span", { className: "truncate pr-2" }, option.label),
|
|
2809
|
+
selectedSearchType === option.value && /* @__PURE__ */ React35.createElement("div", { className: "w-1.5 h-1.5 bg-black rounded-full shrink-0" })
|
|
2810
|
+
))), /* @__PURE__ */ React35.createElement("div", { className: "w-full flex" }, /* @__PURE__ */ React35.createElement("button", { type: "button", onClick: () => setIsTypeModalOpen(false), className: "w-full py-2.5 text-[13px] text-neutral-600 hover:bg-neutral-50 transition-colors outline-none" }, "Cancel")))), modals);
|
|
2813
2811
|
};
|
|
2814
2812
|
|
|
2815
2813
|
// src/components/UniversalDirectoryPage.tsx
|
|
2816
|
-
import
|
|
2817
|
-
import { HugeiconsIcon as
|
|
2814
|
+
import React36 from "react";
|
|
2815
|
+
import { HugeiconsIcon as HugeiconsIcon20 } from "@hugeicons/react";
|
|
2818
2816
|
import { ArrowLeft01Icon as ArrowLeft01Icon6, ArrowRight01Icon as ArrowRight01Icon6, Loading03Icon as Loading03Icon10 } from "@hugeicons/core-free-icons";
|
|
2819
|
-
var PageSpinner4 = () => /* @__PURE__ */
|
|
2817
|
+
var PageSpinner4 = () => /* @__PURE__ */ React36.createElement("div", { className: "flex justify-center items-center py-12" }, /* @__PURE__ */ React36.createElement(HugeiconsIcon20, { icon: Loading03Icon10, size: 32, className: "animate-spin mb-4 text-black" }));
|
|
2820
2818
|
var UniversalDirectoryPage = ({
|
|
2821
2819
|
headerTitle,
|
|
2822
2820
|
headerDescription,
|
|
@@ -2838,33 +2836,33 @@ var UniversalDirectoryPage = ({
|
|
|
2838
2836
|
detailsContent,
|
|
2839
2837
|
modals
|
|
2840
2838
|
}) => {
|
|
2841
|
-
return /* @__PURE__ */
|
|
2839
|
+
return /* @__PURE__ */ React36.createElement("div", { className: "flex flex-col gap-8 animate-in max-w-3xl fade-in duration-300 p-6 rounded-2xl bg-white" }, /* @__PURE__ */ React36.createElement(ManagedToaster, null), /* @__PURE__ */ React36.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-4" }, currentView === "list" ? /* @__PURE__ */ React36.createElement(React36.Fragment, null, /* @__PURE__ */ React36.createElement("div", { className: "w-full" }, /* @__PURE__ */ React36.createElement("h1", { className: " font-serif text-xl text-black mb-1 tracking-tight" }, headerTitle), /* @__PURE__ */ React36.createElement("p", { className: "text-xs text-neutral-500 mb-6" }, headerDescription), !hideSearch && /* @__PURE__ */ React36.createElement(
|
|
2842
2840
|
TextInput,
|
|
2843
2841
|
{
|
|
2844
2842
|
placeholder: searchPlaceholder,
|
|
2845
2843
|
value: searchQuery,
|
|
2846
2844
|
onChange: onSearchChange
|
|
2847
2845
|
}
|
|
2848
|
-
)), headerAction && /* @__PURE__ */
|
|
2846
|
+
)), headerAction && /* @__PURE__ */ React36.createElement("div", { className: "shrink-0 w-full sm:w-auto mt-4 sm:mt-0" }, headerAction)) : /* @__PURE__ */ React36.createElement("div", { className: "flex flex-col items-start gap-3" }, /* @__PURE__ */ React36.createElement("button", { onClick: onBackToList, className: "text-[10px] text-neutral-400 hover:text-black tracking-[0.2em] flex items-center gap-1.5 transition-colors outline-none uppercase" }, /* @__PURE__ */ React36.createElement(HugeiconsIcon20, { icon: ArrowLeft01Icon6, size: 12 }), " Back"))), currentView === "list" && /* @__PURE__ */ React36.createElement("div", { className: "w-full overflow-hidden pt-2" }, isLoading ? /* @__PURE__ */ React36.createElement(PageSpinner4, null) : /* @__PURE__ */ React36.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ React36.createElement("div", { className: "divide-y divide-neutral-100" }, items.length === 0 ? /* @__PURE__ */ React36.createElement(React36.Fragment, null, /* @__PURE__ */ React36.createElement("p", { className: "text-xs text-neutral-500 py-6 text-center" }, "No records found.")) : items.map((item) => /* @__PURE__ */ React36.createElement(
|
|
2849
2847
|
"div",
|
|
2850
2848
|
{
|
|
2851
2849
|
key: item.id,
|
|
2852
2850
|
onClick: () => onRowClick(item.id),
|
|
2853
2851
|
className: "flex items-center justify-between p-4 sm:p-5 hover:bg-neutral-50/50 transition-colors cursor-pointer group min-w-0"
|
|
2854
2852
|
},
|
|
2855
|
-
/* @__PURE__ */
|
|
2856
|
-
item.rightBadge && /* @__PURE__ */
|
|
2857
|
-
))), totalPages > 1 && /* @__PURE__ */
|
|
2853
|
+
/* @__PURE__ */ React36.createElement("div", { className: "flex items-center gap-3 sm:gap-4 min-w-0 flex-1" }, /* @__PURE__ */ React36.createElement("div", { className: "w-10 h-10 shrink-0 rounded-full flex items-center justify-center bg-neutral-100 text-black text-xs" }, item.icon), /* @__PURE__ */ React36.createElement("div", { className: "min-w-0 flex-1" }, /* @__PURE__ */ React36.createElement("div", { className: "text-sm text-black truncate pr-2" }, item.primaryText), /* @__PURE__ */ React36.createElement("div", { className: "text-xs text-neutral-500 truncate pr-2 mt-0.5" }, item.secondaryText))),
|
|
2854
|
+
item.rightBadge && /* @__PURE__ */ React36.createElement("div", { className: "shrink-0 pl-2" }, /* @__PURE__ */ React36.createElement("span", { className: `text-[10px] tracking-[0.2em] px-3 py-1 rounded-full whitespace-nowrap uppercase ${item.rightBadgeClass || "text-neutral-500 border border-neutral-100 bg-white"}` }, item.rightBadge))
|
|
2855
|
+
))), totalPages > 1 && /* @__PURE__ */ React36.createElement("div", { className: "flex items-center justify-between p-4 sm:p-5" }, /* @__PURE__ */ React36.createElement("span", { className: "text-[10px] text-neutral-400 tracking-[0.2em] uppercase" }, "Page ", currentPage, " of ", totalPages), /* @__PURE__ */ React36.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React36.createElement("button", { onClick: () => onPageChange(currentPage - 1), disabled: currentPage === 1 || isLoading, className: "p-2 border border-neutral-100 rounded-full bg-white text-neutral-500 hover:text-black outline-none disabled:opacity-30" }, /* @__PURE__ */ React36.createElement(HugeiconsIcon20, { icon: ArrowLeft01Icon6, size: 14 })), /* @__PURE__ */ React36.createElement("button", { onClick: () => onPageChange(currentPage + 1), disabled: currentPage >= totalPages || isLoading, className: "p-2 border border-neutral-100 rounded-full bg-white text-neutral-500 hover:text-black outline-none disabled:opacity-30" }, /* @__PURE__ */ React36.createElement(HugeiconsIcon20, { icon: ArrowRight01Icon6, size: 14 })))))), currentView === "details" && detailsContent, modals);
|
|
2858
2856
|
};
|
|
2859
2857
|
|
|
2860
2858
|
// src/components/AiApproveDecline.tsx
|
|
2861
|
-
import
|
|
2862
|
-
import { HugeiconsIcon as
|
|
2859
|
+
import React37, { useState as useState18 } from "react";
|
|
2860
|
+
import { HugeiconsIcon as HugeiconsIcon21 } from "@hugeicons/react";
|
|
2863
2861
|
import { CheckmarkCircle01Icon as CheckmarkCircle01Icon2, CancelCircleIcon as CancelCircleIcon2, PencilEdit01Icon } from "@hugeicons/core-free-icons";
|
|
2864
2862
|
var AiApproveDecline = ({ suggestionTitle, suggestionValue, onApprove, onDecline, onEdit }) => {
|
|
2865
|
-
const [isEditing, setIsEditing] =
|
|
2866
|
-
const [editVal, setEditVal] =
|
|
2867
|
-
return /* @__PURE__ */
|
|
2863
|
+
const [isEditing, setIsEditing] = useState18(false);
|
|
2864
|
+
const [editVal, setEditVal] = useState18(typeof suggestionValue === "string" ? suggestionValue : "");
|
|
2865
|
+
return /* @__PURE__ */ React37.createElement("div", { className: "border border-purple-100 bg-linear-to-bl from-purple-50/80 via-white to-white p-5 rounded-2xl flex flex-col gap-4 relative overflow-hidden" }, /* @__PURE__ */ React37.createElement("div", null, /* @__PURE__ */ React37.createElement("span", { className: "text-[10px] tracking-widest text-purple-600 block mb-1 uppercase" }, "AI Suggestion: ", suggestionTitle), !isEditing ? /* @__PURE__ */ React37.createElement("div", { className: "text-sm text-black" }, suggestionValue) : /* @__PURE__ */ React37.createElement(
|
|
2868
2866
|
"input",
|
|
2869
2867
|
{
|
|
2870
2868
|
type: "text",
|
|
@@ -2873,23 +2871,23 @@ var AiApproveDecline = ({ suggestionTitle, suggestionValue, onApprove, onDecline
|
|
|
2873
2871
|
className: "w-full text-sm p-2 border-b border-purple-200 bg-transparent outline-none focus:border-purple-400 transition-colors",
|
|
2874
2872
|
autoFocus: true
|
|
2875
2873
|
}
|
|
2876
|
-
)), /* @__PURE__ */
|
|
2874
|
+
)), /* @__PURE__ */ React37.createElement("div", { className: "flex items-center gap-1 mt-2" }, !isEditing ? /* @__PURE__ */ React37.createElement(React37.Fragment, null, /* @__PURE__ */ React37.createElement("button", { onClick: onApprove, title: "Approve", className: "p-1.5 text-black hover:text-black hover:bg-neutral-50 rounded-full transition-colors outline-none" }, /* @__PURE__ */ React37.createElement(HugeiconsIcon21, { icon: CheckmarkCircle01Icon2, size: 28 })), /* @__PURE__ */ React37.createElement("button", { onClick: onDecline, title: "Decline", className: "p-1.5 text-neutral-400 hover:text-neutral-400 hover:bg-neutral-50 rounded-full transition-colors outline-none" }, /* @__PURE__ */ React37.createElement(HugeiconsIcon21, { icon: CancelCircleIcon2, size: 28 })), onEdit && /* @__PURE__ */ React37.createElement("button", { onClick: () => setIsEditing(true), title: "Edit", className: "ml-auto p-1.5 text-neutral-400 hover:text-black hover:bg-neutral-100 rounded-full transition-colors outline-none" }, /* @__PURE__ */ React37.createElement(HugeiconsIcon21, { icon: PencilEdit01Icon, size: 18 }))) : /* @__PURE__ */ React37.createElement(React37.Fragment, null, /* @__PURE__ */ React37.createElement("button", { onClick: () => {
|
|
2877
2875
|
onEdit?.(editVal);
|
|
2878
2876
|
setIsEditing(false);
|
|
2879
|
-
}, title: "Save Edit", className: "p-1.5 text-emerald-500 hover:text-emerald-600 hover:bg-emerald-50 rounded-full transition-colors outline-none" }, /* @__PURE__ */
|
|
2877
|
+
}, title: "Save Edit", className: "p-1.5 text-emerald-500 hover:text-emerald-600 hover:bg-emerald-50 rounded-full transition-colors outline-none" }, /* @__PURE__ */ React37.createElement(HugeiconsIcon21, { icon: CheckmarkCircle01Icon2, size: 28 })), /* @__PURE__ */ React37.createElement("button", { onClick: () => setIsEditing(false), title: "Cancel Edit", className: "p-1.5 text-neutral-400 hover:text-black hover:bg-neutral-100 rounded-full transition-colors outline-none" }, /* @__PURE__ */ React37.createElement(HugeiconsIcon21, { icon: CancelCircleIcon2, size: 28 })))));
|
|
2880
2878
|
};
|
|
2881
2879
|
|
|
2882
2880
|
// src/components/AiStageCheck.tsx
|
|
2883
|
-
import
|
|
2884
|
-
import { HugeiconsIcon as
|
|
2881
|
+
import React38 from "react";
|
|
2882
|
+
import { HugeiconsIcon as HugeiconsIcon22 } from "@hugeicons/react";
|
|
2885
2883
|
import { Loading03Icon as Loading03Icon11, CheckmarkCircle02Icon, CancelCircleIcon as CancelCircleIcon3 } from "@hugeicons/core-free-icons";
|
|
2886
2884
|
var AiStageCheck = ({ tasks }) => {
|
|
2887
|
-
return /* @__PURE__ */
|
|
2885
|
+
return /* @__PURE__ */ React38.createElement("div", { className: "flex flex-col gap-3 p-5 rounded-2xl border border-purple-100 bg-linear-to-bl from-purple-50/80 via-white to-white relative overflow-hidden" }, /* @__PURE__ */ React38.createElement("span", { className: "text-[10px] tracking-widest text-purple-600 mb-1 uppercase" }, "AI Processing"), tasks.map((task) => /* @__PURE__ */ React38.createElement("div", { key: task.id, className: "flex items-center gap-3" }, task.status === "pending" && /* @__PURE__ */ React38.createElement("div", { className: "w-4 h-4 rounded-full border border-purple-200" }), task.status === "loading" && /* @__PURE__ */ React38.createElement(HugeiconsIcon22, { icon: Loading03Icon11, size: 16, className: "animate-spin text-purple-500" }), task.status === "success" && /* @__PURE__ */ React38.createElement(HugeiconsIcon22, { icon: CheckmarkCircle02Icon, size: 16, className: "text-emerald-500" }), task.status === "error" && /* @__PURE__ */ React38.createElement(HugeiconsIcon22, { icon: CancelCircleIcon3, size: 16, className: "text-red-500" }), /* @__PURE__ */ React38.createElement("span", { className: `text-xs transition-colors ${task.status === "success" ? "text-black" : task.status === "loading" ? "text-purple-700" : "text-neutral-500"}` }, task.label))));
|
|
2888
2886
|
};
|
|
2889
2887
|
|
|
2890
2888
|
// src/components/Stagger.tsx
|
|
2891
|
-
import
|
|
2892
|
-
import { HugeiconsIcon as
|
|
2889
|
+
import React39 from "react";
|
|
2890
|
+
import { HugeiconsIcon as HugeiconsIcon23 } from "@hugeicons/react";
|
|
2893
2891
|
import { Briefcase02Icon, Upload01Icon as Upload01Icon2, FileSyncIcon, CloudUploadIcon } from "@hugeicons/core-free-icons";
|
|
2894
2892
|
var Stagger = ({ steps, currentStep }) => {
|
|
2895
2893
|
const getIconForStep = (stepName) => {
|
|
@@ -2899,18 +2897,18 @@ var Stagger = ({ steps, currentStep }) => {
|
|
|
2899
2897
|
if (lowerName.includes("submit")) return CloudUploadIcon;
|
|
2900
2898
|
return Briefcase02Icon;
|
|
2901
2899
|
};
|
|
2902
|
-
return /* @__PURE__ */
|
|
2900
|
+
return /* @__PURE__ */ React39.createElement("div", { className: "w-full flex items-center justify-between relative z-0" }, /* @__PURE__ */ React39.createElement("div", { className: "absolute left-0 top-1/2 -translate-y-1/2 w-full h-px bg-neutral-200 -z-10" }), /* @__PURE__ */ React39.createElement("div", { className: "absolute left-0 top-1/2 -translate-y-1/2 h-px bg-emerald-500 -z-10 transition-all duration-500", style: { width: `${currentStep / (steps.length - 1) * 100}%` } }), steps.map((step, idx) => {
|
|
2903
2901
|
const isActive = idx === currentStep;
|
|
2904
2902
|
const isPassed = idx < currentStep;
|
|
2905
2903
|
const colorClass = isPassed ? "bg-emerald-500 text-white" : isActive ? "bg-neutral-200 text-neutral-500" : "bg-neutral-200 text-neutral-500";
|
|
2906
|
-
return /* @__PURE__ */
|
|
2904
|
+
return /* @__PURE__ */ React39.createElement("div", { key: step, className: `w-6 h-6 rounded-full flex items-center justify-center transition-colors duration-300 ${colorClass}` }, /* @__PURE__ */ React39.createElement(HugeiconsIcon23, { icon: getIconForStep(step), size: 11 }));
|
|
2907
2905
|
}));
|
|
2908
2906
|
};
|
|
2909
2907
|
|
|
2910
2908
|
// src/components/UniversalRegistrationFlow.tsx
|
|
2911
|
-
import
|
|
2909
|
+
import React40, { useState as useState19, useEffect as useEffect11, useRef as useRef6 } from "react";
|
|
2912
2910
|
import toast6 from "react-hot-toast";
|
|
2913
|
-
import { HugeiconsIcon as
|
|
2911
|
+
import { HugeiconsIcon as HugeiconsIcon24 } from "@hugeicons/react";
|
|
2914
2912
|
import { CheckmarkBadge01Icon, Upload01Icon as Upload01Icon3, Loading03Icon as Loading03Icon12, PencilEdit01Icon as PencilEdit01Icon2, Delete02Icon as Delete02Icon2, SignatureIcon, IdentificationIcon, ArrowLeft01Icon as ArrowLeft01Icon7, HourglassIcon } from "@hugeicons/core-free-icons";
|
|
2915
2913
|
var MACRO_STEPS = ["Details", "Documents", "Review", "Submit"];
|
|
2916
2914
|
var NIGERIAN_STATES = ["Abia", "Adamawa", "Akwa Ibom", "Anambra", "Bauchi", "Bayelsa", "Benue", "Borno", "Cross River", "Delta", "Ebonyi", "Edo", "Ekiti", "Enugu", "FCT - Abuja", "Gombe", "Imo", "Jigawa", "Kaduna", "Kano", "Katsina", "Kebbi", "Kogi", "Kwara", "Lagos", "Nasarawa", "Niger", "Ogun", "Ondo", "Osun", "Oyo", "Plateau", "Rivers", "Sokoto", "Taraba", "Yobe", "Zamfara"];
|
|
@@ -2924,12 +2922,12 @@ var UniversalRegistrationFlow = ({
|
|
|
2924
2922
|
onRedirectToBilling,
|
|
2925
2923
|
onRedirectToApplication
|
|
2926
2924
|
}) => {
|
|
2927
|
-
const [isBooting, setIsBooting] =
|
|
2928
|
-
const [macroStep, setMacroStep] =
|
|
2929
|
-
const [appStatus, setAppStatus] =
|
|
2930
|
-
const [isAbortModalOpen, setIsAbortModalOpen] =
|
|
2931
|
-
const [isAborting, setIsAborting] =
|
|
2932
|
-
const [formState, setFormState] =
|
|
2925
|
+
const [isBooting, setIsBooting] = useState19(true);
|
|
2926
|
+
const [macroStep, setMacroStep] = useState19(0);
|
|
2927
|
+
const [appStatus, setAppStatus] = useState19("");
|
|
2928
|
+
const [isAbortModalOpen, setIsAbortModalOpen] = useState19(false);
|
|
2929
|
+
const [isAborting, setIsAborting] = useState19(false);
|
|
2930
|
+
const [formState, setFormState] = useState19({
|
|
2933
2931
|
natureApproved: false,
|
|
2934
2932
|
nameApproved: false,
|
|
2935
2933
|
addressApproved: false,
|
|
@@ -2946,7 +2944,7 @@ var UniversalRegistrationFlow = ({
|
|
|
2946
2944
|
const other1Ref = useRef6(null);
|
|
2947
2945
|
const other2Ref = useRef6(null);
|
|
2948
2946
|
const other3Ref = useRef6(null);
|
|
2949
|
-
const [formData, setFormData] =
|
|
2947
|
+
const [formData, setFormData] = useState19({
|
|
2950
2948
|
businessDesc: "",
|
|
2951
2949
|
natureOfBusiness: null,
|
|
2952
2950
|
proposedName: "",
|
|
@@ -2973,22 +2971,22 @@ var UniversalRegistrationFlow = ({
|
|
|
2973
2971
|
otherDoc3Url: "",
|
|
2974
2972
|
otherDoc3Meta: null
|
|
2975
2973
|
});
|
|
2976
|
-
const [activeModal, setActiveModal] =
|
|
2977
|
-
const [iAgree, setIAgree] =
|
|
2978
|
-
const [isAnalyzingNature, setIsAnalyzingNature] =
|
|
2979
|
-
const [suggestedNature, setSuggestedNature] =
|
|
2980
|
-
const [isCheckingQualifier, setIsCheckingQualifier] =
|
|
2981
|
-
const [qualifierCheckResult, setQualifierCheckResult] =
|
|
2982
|
-
const [isCheckingName, setIsCheckingName] =
|
|
2983
|
-
const [nameCheckResult, setNameCheckResult] =
|
|
2984
|
-
const [globalExtractingId, setGlobalExtractingId] =
|
|
2985
|
-
const [globalUploadingPassport, setGlobalUploadingPassport] =
|
|
2986
|
-
const [globalUploadingSignature, setGlobalUploadingSignature] =
|
|
2987
|
-
const [isUploadingOther1, setIsUploadingOther1] =
|
|
2988
|
-
const [isUploadingOther2, setIsUploadingOther2] =
|
|
2989
|
-
const [isUploadingOther3, setIsUploadingOther3] =
|
|
2990
|
-
const [aiTasks, setAiTasks] =
|
|
2991
|
-
const [isSubmitting, setIsSubmitting] =
|
|
2974
|
+
const [activeModal, setActiveModal] = useState19({ isOpen: false, type: null, memberIndex: null });
|
|
2975
|
+
const [iAgree, setIAgree] = useState19(false);
|
|
2976
|
+
const [isAnalyzingNature, setIsAnalyzingNature] = useState19(false);
|
|
2977
|
+
const [suggestedNature, setSuggestedNature] = useState19(null);
|
|
2978
|
+
const [isCheckingQualifier, setIsCheckingQualifier] = useState19(false);
|
|
2979
|
+
const [qualifierCheckResult, setQualifierCheckResult] = useState19(null);
|
|
2980
|
+
const [isCheckingName, setIsCheckingName] = useState19(false);
|
|
2981
|
+
const [nameCheckResult, setNameCheckResult] = useState19(null);
|
|
2982
|
+
const [globalExtractingId, setGlobalExtractingId] = useState19(false);
|
|
2983
|
+
const [globalUploadingPassport, setGlobalUploadingPassport] = useState19(false);
|
|
2984
|
+
const [globalUploadingSignature, setGlobalUploadingSignature] = useState19(false);
|
|
2985
|
+
const [isUploadingOther1, setIsUploadingOther1] = useState19(false);
|
|
2986
|
+
const [isUploadingOther2, setIsUploadingOther2] = useState19(false);
|
|
2987
|
+
const [isUploadingOther3, setIsUploadingOther3] = useState19(false);
|
|
2988
|
+
const [aiTasks, setAiTasks] = useState19([]);
|
|
2989
|
+
const [isSubmitting, setIsSubmitting] = useState19(false);
|
|
2992
2990
|
const isReadOnly = ["PENDING", "AWAITING_PAYMENT", "COMPLETED"].includes(appStatus);
|
|
2993
2991
|
const isAnyUploading = globalExtractingId || globalUploadingPassport || globalUploadingSignature || isUploadingOther1 || isUploadingOther2 || isUploadingOther3;
|
|
2994
2992
|
const baseApi = async (action, payload = {}) => {
|
|
@@ -3479,23 +3477,23 @@ var UniversalRegistrationFlow = ({
|
|
|
3479
3477
|
const isStep0Valid = type === "company" ? formState.natureApproved && formState.nameApproved && formState.addressApproved && formState.membersDetailsApproved : formState.natureApproved && formState.nameApproved && formState.addressApproved && formState.ownerApproved;
|
|
3480
3478
|
const isStep1Valid = type === "company" ? formState.membersDocsApproved : formState.idApproved && formState.passportApproved && formState.signatureApproved;
|
|
3481
3479
|
const titleText = type === "company" ? "Company Incorporation (LLC)" : "Business Name Registration";
|
|
3482
|
-
if (isBooting) return /* @__PURE__ */
|
|
3480
|
+
if (isBooting) return /* @__PURE__ */ React40.createElement("div", { className: "flex justify-center py-20" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: Loading03Icon12, size: 32, className: "animate-spin text-black" }));
|
|
3483
3481
|
if (!["DRAFT", "QUEUED", "REJECTED"].includes(appStatus) && appStatus !== "") {
|
|
3484
|
-
return /* @__PURE__ */
|
|
3482
|
+
return /* @__PURE__ */ React40.createElement("div", { className: "w-full max-w-3xl mx-auto bg-white rounded-4xl p-6 sm:p-10 flex flex-col items-center justify-center text-center gap-5 animate-in fade-in slide-in-from-bottom-2 duration-500 mb-20 py-24" }, appStatus === "COMPLETED" ? /* @__PURE__ */ React40.createElement(React40.Fragment, null, /* @__PURE__ */ React40.createElement("div", { className: "w-20 h-20 bg-neutral-50 text-neutral-500 rounded-full flex items-center justify-center mb-2" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: CheckmarkBadge01Icon, size: 35 })), /* @__PURE__ */ React40.createElement("h2", { className: "text-xl font-serif text-black" }, "Registration Completed"), /* @__PURE__ */ React40.createElement("p", { className: "text-sm text-neutral-500 max-w-md" }, "Your application has been successfully verified and registered.")) : appStatus === "PENDING" ? /* @__PURE__ */ React40.createElement(React40.Fragment, null, /* @__PURE__ */ React40.createElement("div", { className: "w-20 h-20 bg-neutral-50 text-neutral-500 rounded-full flex items-center justify-center mb-2" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: HourglassIcon, size: 35, className: "animate-spin" })), /* @__PURE__ */ React40.createElement("h2", { className: "text-xl font-serif text-black" }, "Application is Pending"), /* @__PURE__ */ React40.createElement("p", { className: "text-sm text-neutral-500 max-w-md" }, "Your application is currently pending review.")) : appStatus === "AWAITING_PAYMENT" ? /* @__PURE__ */ React40.createElement(React40.Fragment, null, /* @__PURE__ */ React40.createElement("div", { className: "w-20 h-20 bg-amber-50 text-amber-500 rounded-full flex items-center justify-center mb-2" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: HourglassIcon, size: 35, className: "animate-pulse" })), /* @__PURE__ */ React40.createElement("h2", { className: "text-xl font-serif text-black" }, "Awaiting Payment"), /* @__PURE__ */ React40.createElement("p", { className: "text-sm text-neutral-500 max-w-md" }, "Your application is complete and awaiting government fee settlement. Please go to the Billing tab to authorize payment."), /* @__PURE__ */ React40.createElement("div", { className: "mt-6 flex flex-col items-center gap-3" }, /* @__PURE__ */ React40.createElement("button", { onClick: onRedirectToBilling, className: "px-8 py-3 bg-black text-white text-[11px] tracking-widest rounded-full hover:bg-neutral-800 outline-none" }, "Go to Billing & Invoices"), /* @__PURE__ */ React40.createElement("button", { onClick: () => setIsAbortModalOpen(true), className: "px-8 py-3 border border-neutral-100 text-neutral-600 text-[11px] tracking-widest rounded-full hover:bg-neutral-50 outline-none" }, "Abort & Edit Application"))) : /* @__PURE__ */ React40.createElement(React40.Fragment, null, /* @__PURE__ */ React40.createElement("div", { className: "w-20 h-20 bg-neutral-50 text-neutral-500 rounded-full flex items-center justify-center mb-2" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: HourglassIcon, size: 35 })), /* @__PURE__ */ React40.createElement("h2", { className: "text-xl font-serif text-black" }, "Application Submitted"), /* @__PURE__ */ React40.createElement("p", { className: "text-sm text-neutral-500 max-w-md" }, "Your application is currently ", appStatus.replace(/_/g, " ").toLowerCase(), "."), ["AWAITING_PAYMENT", "READY_FOR_SUBMISSION", "AWAITING_CONFIRMATION"].includes(appStatus) && /* @__PURE__ */ React40.createElement("div", { className: "mt-6 flex flex-col items-center gap-3" }, /* @__PURE__ */ React40.createElement("button", { onClick: () => setIsAbortModalOpen(true), className: "px-8 py-3 border border-neutral-100 text-neutral-600 text-[11px] tracking-widest rounded-full hover:bg-neutral-50 outline-none" }, "Abort Application"))), isAbortModalOpen && /* @__PURE__ */ React40.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ React40.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: () => !isAborting && setIsAbortModalOpen(false) }), /* @__PURE__ */ React40.createElement("div", { className: "relative w-100 bg-white shadow-2xl rounded-3xl flex flex-col overflow-hidden animate-in zoom-in-95 duration-200 text-left" }, /* @__PURE__ */ React40.createElement("div", { className: "p-6 flex flex-col gap-4 text-center" }, /* @__PURE__ */ React40.createElement("h3", { className: "text-[17px] font-serif text-black tracking-tight" }, "Abort Application?"), /* @__PURE__ */ React40.createElement("p", { className: "text-[12px] text-neutral-500 leading-relaxed" }, "Are you sure you want to abort? If you have already made a payment, returning to draft may cause issues. Your invoice will be deleted.")), /* @__PURE__ */ React40.createElement("div", { className: "w-full flex " }, /* @__PURE__ */ React40.createElement("button", { onClick: () => setIsAbortModalOpen(false), disabled: isAborting, className: "flex-1 py-4 text-[13px] text-neutral-500 hover:bg-neutral-50 transition-colors outline-none disabled:opacity-50" }, "Cancel"), /* @__PURE__ */ React40.createElement("button", { onClick: handleAbort, disabled: isAborting, className: "flex-1 py-4 text-[13px] text-red-500 hover:bg-neutral-50 transition-colors outline-none disabled:opacity-50" }, isAborting ? "Aborting..." : "Yes, Abort")))));
|
|
3485
3483
|
}
|
|
3486
|
-
return /* @__PURE__ */
|
|
3484
|
+
return /* @__PURE__ */ React40.createElement("div", { className: "w-full max-w-3xl mx-auto bg-white rounded-4xl p-6 sm:p-10 flex flex-col gap-10 animate-in fade-in slide-in-from-bottom-2 duration-500 mb-20" }, /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-8" }, /* @__PURE__ */ React40.createElement("div", null, /* @__PURE__ */ React40.createElement("h2", { className: "text-xl font-serif text-black tracking-tight mb-1" }, titleText), /* @__PURE__ */ React40.createElement("p", { className: "text-sm text-neutral-500" }, "Answer the questions below to build your official application.")), /* @__PURE__ */ React40.createElement("div", { className: "px-2" }, /* @__PURE__ */ React40.createElement(Stagger, { steps: MACRO_STEPS, currentStep: macroStep }))), /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-8" }, macroStep === 0 && /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-8 animate-in fade-in" }, /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-4" }, /* @__PURE__ */ React40.createElement("div", { className: "flex items-center text-black" }, /* @__PURE__ */ React40.createElement("h3", { className: "text-sm " }, "What does your ", type === "company" ? "company" : "business", " do?")), !formState.natureApproved ? /* @__PURE__ */ React40.createElement(React40.Fragment, null, /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-3 " }, /* @__PURE__ */ React40.createElement(TextInput, { label: type === "company" ? "Company Description" : "Business Description", placeholder: "e.g. We provide professional services to clients.", value: formData.businessDesc, onChange: (v) => setFormData({ ...formData, businessDesc: v }), disabled: isReadOnly || isSubmitting }), /* @__PURE__ */ React40.createElement(ThreeDActionButton, { onClick: handleAnalyzeNature, disabled: formData.businessDesc.length < 5 || isAnalyzingNature || isReadOnly, isLoading: isAnalyzingNature, className: "w-fit" }, "Analyze Nature")), isAnalyzingNature && /* @__PURE__ */ React40.createElement("div", { className: " mt-2" }, /* @__PURE__ */ React40.createElement(AiStageCheck, { tasks: [{ id: "1", label: "Matching with Official Categories...", status: "loading" }] })), suggestedNature && /* @__PURE__ */ React40.createElement("div", { className: " mt-2 animate-in fade-in" }, /* @__PURE__ */ React40.createElement(AiApproveDecline, { suggestionTitle: "Classification Found", suggestionValue: /* @__PURE__ */ React40.createElement("div", null, /* @__PURE__ */ React40.createElement("p", { className: " text-black" }, suggestedNature.specificLabel), /* @__PURE__ */ React40.createElement("p", { className: "text-xs text-neutral-500 mt-1" }, "Category: ", suggestedNature.categoryLabel)), onApprove: () => {
|
|
3487
3485
|
const newForm = { ...formData, natureOfBusiness: suggestedNature };
|
|
3488
3486
|
setFormData(newForm);
|
|
3489
3487
|
approveSection("natureApproved", newForm);
|
|
3490
|
-
}, onDecline: () => setSuggestedNature(null) }))) : /* @__PURE__ */
|
|
3488
|
+
}, onDecline: () => setSuggestedNature(null) }))) : /* @__PURE__ */ React40.createElement("div", { className: " flex items-center justify-between" }, /* @__PURE__ */ React40.createElement("div", { className: "pr-4" }, /* @__PURE__ */ React40.createElement("p", { className: "text-sm text-black" }, formData.natureOfBusiness?.specificLabel), /* @__PURE__ */ React40.createElement("p", { className: "text-xs text-neutral-500 mt-1" }, formData.businessDesc)), !isReadOnly && /* @__PURE__ */ React40.createElement("button", { onClick: () => editSection("natureApproved"), className: "p-2 text-neutral-400 hover:text-black transition-colors outline-none shrink-0" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: PencilEdit01Icon2, size: 16 })))), formState.natureApproved && /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-4 pt-6 animate-in slide-in-from-top-4 duration-500" }, /* @__PURE__ */ React40.createElement("div", { className: "flex items-center text-black" }, /* @__PURE__ */ React40.createElement("h3", { className: "text-sm " }, "What name would you like to register?")), /* @__PURE__ */ React40.createElement("p", { className: "text-xs text-neutral-500 -mt-2" }, "Provide two options. We will verify availability against the official registry."), !formState.nameApproved ? /* @__PURE__ */ React40.createElement(React40.Fragment, null, /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-4" }, /* @__PURE__ */ React40.createElement(TextInput, { label: "Proposed Name 1 (Preferred)", value: formData.proposedName, onChange: (v) => setFormData({ ...formData, proposedName: v }), disabled: isReadOnly || isSubmitting }), /* @__PURE__ */ React40.createElement(TextInput, { label: "Proposed Name 2 (Alternative)", value: formData.proposedName2, onChange: (v) => setFormData({ ...formData, proposedName2: v }), disabled: isReadOnly || isSubmitting }), /* @__PURE__ */ React40.createElement(ThreeDActionButton, { onClick: () => handleCheckNames(formData.proposedName), disabled: !formData.proposedName || !formData.proposedName2 || isCheckingName || isCheckingQualifier || isReadOnly, isLoading: isCheckingQualifier || isCheckingName, className: "w-fit" }, "Check Availability")), (isCheckingQualifier || isCheckingName) && /* @__PURE__ */ React40.createElement("div", { className: " mt-2" }, /* @__PURE__ */ React40.createElement(AiStageCheck, { tasks: [{ id: "1", label: "AI Qualifier Pre-check...", status: isCheckingQualifier ? "loading" : "success" }, { id: "2", label: "Checking Official Registry Database...", status: isCheckingName ? "loading" : "pending" }, { id: "3", label: "Fallback Checking Public Database...", status: isCheckingName ? "loading" : "pending" }, { id: "4", label: "Validation Status...", status: isCheckingName ? "loading" : "pending" }] })), qualifierCheckResult && /* @__PURE__ */ React40.createElement("div", { className: "mt-2 animate-in fade-in" }, /* @__PURE__ */ React40.createElement("div", { className: "border border-purple-100 bg-linear-to-bl from-purple-50/80 via-white to-white p-5 rounded-2xl flex flex-col gap-4 relative overflow-hidden" }, /* @__PURE__ */ React40.createElement("div", null, /* @__PURE__ */ React40.createElement("span", { className: "text-[10px] tracking-widest text-purple-600 block mb-1" }, "AI Suggestion: Structural Qualifier Missing"), /* @__PURE__ */ React40.createElement("p", { className: "text-sm text-black mb-3" }, "Nigerian registrations require a structural qualifier to be approved."), /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-2" }, (qualifierCheckResult.suggestions || []).map((alt, i) => /* @__PURE__ */ React40.createElement("button", { key: i, onClick: () => setFormData({ ...formData, proposedName: alt }), className: "text-left px-4 py-2 border border-neutral-100 rounded-full hover:border-black text-sm transition-colors outline-none" }, alt)))), /* @__PURE__ */ React40.createElement("button", { onClick: () => setQualifierCheckResult(null), className: "w-fit text-[11px] tracking-widest text-neutral-500 hover:text-black transition-colors mt-2 outline-none" }, "Edit Name Manually"))), nameCheckResult && /* @__PURE__ */ React40.createElement("div", { className: " mt-2 animate-in fade-in" }, nameCheckResult.status === "APPROVED" || nameCheckResult.status === "APPROVED_WARNING" || nameCheckResult.status === "SKIPPED" ? /* @__PURE__ */ React40.createElement(AiApproveDecline, { suggestionTitle: nameCheckResult.status === "APPROVED" ? "Name Available!" : "Fallback Approval", suggestionValue: /* @__PURE__ */ React40.createElement("div", null, /* @__PURE__ */ React40.createElement("p", { className: `mb-1 ${nameCheckResult.status === "APPROVED" ? "text-emerald-600 " : "text-orange-500 "}` }, nameCheckResult.status === "APPROVED" ? "Excellent chance of approval." : "Validation Bypassed / Fallback."), /* @__PURE__ */ React40.createElement("p", { className: "text-xs text-neutral-600" }, nameCheckResult.message), /* @__PURE__ */ React40.createElement("p", { className: "text-xs text-neutral-600 mt-2 " }, "Proposed Option: ", nameCheckResult.approvedOption)), onApprove: () => {
|
|
3491
3489
|
const newForm = { ...formData, approvedName: nameCheckResult.approvedOption };
|
|
3492
3490
|
setFormData(newForm);
|
|
3493
3491
|
approveSection("nameApproved", newForm);
|
|
3494
|
-
}, onDecline: () => setNameCheckResult(null) }) : /* @__PURE__ */
|
|
3495
|
-
}, disabled: isReadOnly || isSubmitting })), /* @__PURE__ */
|
|
3496
|
-
}, disabled: isReadOnly || isSubmitting }), member.role !== "Director Only" && /* @__PURE__ */
|
|
3497
|
-
}, disabled: isReadOnly || isSubmitting }), /* @__PURE__ */
|
|
3498
|
-
}, disabled: isReadOnly || isSubmitting })))), /* @__PURE__ */ React41.createElement("div", { className: "flex border-b border-neutral-100 items-center justify-between mt-2" }, !isReadOnly && /* @__PURE__ */ React41.createElement("button", { onClick: addCompanyMember, className: "px-6 py-2 bg-white border border-neutral-100 text-black text-[11px] tracking-widest rounded-full hover:bg-neutral-50 transition-colors outline-none" }, "+ Add Member"), /* @__PURE__ */ React41.createElement(ThreeDActionButton, { onClick: () => approveSection("membersDetailsApproved"), disabled: !areCompanyMembersValid() || isReadOnly, className: "w-fit" }, "Confirm Members"))) : /* @__PURE__ */ React41.createElement("div", { className: " flex border-b border-neutral-100 items-center justify-between" }, /* @__PURE__ */ React41.createElement("div", null, /* @__PURE__ */ React41.createElement("p", { className: "text-sm text-black" }, formData.members.length, " Member(s) Registered"), /* @__PURE__ */ React41.createElement("p", { className: "text-xs text-neutral-500 mt-1" }, "Total Shares: 100% Verified.")), !isReadOnly && /* @__PURE__ */ React41.createElement("button", { onClick: () => editSection("membersDetailsApproved"), className: "p-2 text-neutral-400 hover:text-black transition-colors outline-none shrink-0" }, /* @__PURE__ */ React41.createElement(HugeiconsIcon25, { icon: PencilEdit01Icon2, size: 16 })))), formState.addressApproved && type === "business" && /* @__PURE__ */ React41.createElement("div", { className: "flex flex-col gap-4 pt-6 animate-in slide-in-from-top-4 duration-500" }, /* @__PURE__ */ React41.createElement("div", { className: "flex items-center text-black" }, /* @__PURE__ */ React41.createElement("h3", { className: "text-sm " }, "Who owns the business?")), /* @__PURE__ */ React41.createElement("p", { className: "text-xs text-neutral-500 -mt-2" }, "Provide basic contact info. We will extract your DOB and ID number automatically in the next step."), !formState.ownerApproved ? /* @__PURE__ */ React41.createElement("div", { className: "flex flex-col gap-4 " }, /* @__PURE__ */ React41.createElement(TextInput, { label: "Full Name", value: formData.ownerName, onChange: (v) => setFormData({ ...formData, ownerName: v }), disabled: isReadOnly || isSubmitting }), /* @__PURE__ */ React41.createElement("div", { className: "grid grid-cols-2 gap-4" }, /* @__PURE__ */ React41.createElement(NumberInput, { label: "Phone Number", value: formData.ownerPhone, onChange: (v) => setFormData({ ...formData, ownerPhone: v }), disabled: isReadOnly || isSubmitting }), /* @__PURE__ */ React41.createElement(TextInput, { label: "Email Address", value: formData.ownerEmail, onChange: (v) => setFormData({ ...formData, ownerEmail: v }), disabled: isReadOnly || isSubmitting })), /* @__PURE__ */ React41.createElement(ThreeDActionButton, { onClick: () => approveSection("ownerApproved"), disabled: !formData.ownerName || !formData.ownerPhone || !formData.ownerEmail || isReadOnly, className: "w-fit mt-2" }, "Confirm Owner Details")) : /* @__PURE__ */ React41.createElement("div", { className: " border-b border-neutral-100 flex items-center justify-between" }, /* @__PURE__ */ React41.createElement("div", null, /* @__PURE__ */ React41.createElement("p", { className: "text-sm text-black" }, formData.ownerName), /* @__PURE__ */ React41.createElement("p", { className: "text-xs text-neutral-500 mt-1" }, formData.ownerEmail, " \u2022 ", formData.ownerPhone)), !isReadOnly && /* @__PURE__ */ React41.createElement("button", { onClick: () => editSection("ownerApproved"), className: "p-2 text-neutral-400 hover:text-black transition-colors outline-none shrink-0" }, /* @__PURE__ */ React41.createElement(HugeiconsIcon25, { icon: PencilEdit01Icon2, size: 16 })))), /* @__PURE__ */ React41.createElement("div", { className: "flex items-center justify-between mt-8 pt-6 " }, /* @__PURE__ */ React41.createElement("button", { onClick: handleBack, className: "flex items-center gap-2 px-6 py-2 text-[11px] tracking-widest text-neutral-500 hover:text-black hover:bg-neutral-50 rounded-full transition-colors outline-none" }, /* @__PURE__ */ React41.createElement(HugeiconsIcon25, { icon: ArrowLeft01Icon7, size: 14 }), " Close"), /* @__PURE__ */ React41.createElement(ThreeDActionButton, { onClick: handleNext, disabled: !isStep0Valid, className: "w-fit shrink-0" }, "Next Step"))), macroStep === 1 && /* @__PURE__ */ React41.createElement("div", { className: "flex flex-col gap-8 animate-in fade-in" }, type === "company" ? /* @__PURE__ */ React41.createElement(React41.Fragment, null, /* @__PURE__ */ React41.createElement("div", { className: "flex flex-col gap-2" }, /* @__PURE__ */ React41.createElement("h3", { className: "text-sm text-black" }, "Member Identity Documents"), /* @__PURE__ */ React41.createElement("p", { className: "text-xs text-neutral-500 leading-relaxed" }, "Upload valid means of identification, passport photographs, and signatures for every director and shareholder.")), !formState.membersDocsApproved ? /* @__PURE__ */ React41.createElement("div", { className: "flex flex-col gap-6" }, formData.members.map((member, i) => /* @__PURE__ */ React41.createElement("div", { key: member.id, className: "flex flex-col gap-4" }, /* @__PURE__ */ React41.createElement("span", { className: "text-[11px] tracking-widest text-black mb-1" }, member.fullName || `Member ${i + 1}`, " ", /* @__PURE__ */ React41.createElement("span", { className: "text-neutral-400 ml-2" }, "(", member.role, ")")), /* @__PURE__ */ React41.createElement("input", { id: `id-upload-${i}`, type: "file", accept: "image/jpeg, image/png, image/webp, application/pdf", className: "hidden", onChange: (e) => handleCompanyMemberUpload(e, i, "id"), disabled: isReadOnly || isAnyUploading }), /* @__PURE__ */ React41.createElement("input", { id: `pass-upload-${i}`, type: "file", accept: "image/jpeg, image/png, image/webp, application/pdf", className: "hidden", onChange: (e) => handleCompanyMemberUpload(e, i, "passport"), disabled: isReadOnly || isAnyUploading }), /* @__PURE__ */ React41.createElement("input", { id: `sig-upload-${i}`, type: "file", accept: "image/jpeg, image/png, image/webp, application/pdf", className: "hidden", onChange: (e) => handleCompanyMemberUpload(e, i, "signature"), disabled: isReadOnly || isAnyUploading }), !member.idExtractedData && !globalExtractingId ? /* @__PURE__ */ React41.createElement("button", { onClick: () => !isReadOnly && !isAnyUploading && document.getElementById(`id-upload-${i}`)?.click(), className: `flex items-center gap-3 p-4 border border-neutral-100 rounded-full transition-colors text-sm w-full outline-none ${isAnyUploading ? "opacity-50 cursor-not-allowed bg-neutral-50 text-neutral-400" : "text-black hover:bg-neutral-50"}`, disabled: isReadOnly || isAnyUploading }, /* @__PURE__ */ React41.createElement(HugeiconsIcon25, { icon: Upload01Icon3, size: 18, className: "text-neutral-400" }), " Upload Valid ID (NIN, License, Voter's Card)") : globalExtractingId && !member.idExtractedData ? /* @__PURE__ */ React41.createElement("div", { className: " mt-2" }, /* @__PURE__ */ React41.createElement(AiStageCheck, { tasks: aiTasks })) : member.idExtractedData ? /* @__PURE__ */ React41.createElement("div", { className: " mt-2 animate-in fade-in border border-purple-100 bg-linear-to-bl from-purple-50/80 via-white to-white p-5 rounded-xl flex flex-col gap-4 relative overflow-hidden" }, /* @__PURE__ */ React41.createElement("div", null, /* @__PURE__ */ React41.createElement("span", { className: "text-[10px] tracking-widest text-purple-600 block mb-2" }, "Review Extracted ID"), /* @__PURE__ */ React41.createElement("div", { className: "flex flex-col gap-4" }, /* @__PURE__ */ React41.createElement(TextInput, { label: "Full Name on ID", value: member.idExtractedData.fullName, onChange: (v) => updateCompanyMemberInfo(i, "idExtractedData", { ...member.idExtractedData, fullName: v }), disabled: isReadOnly || isAnyUploading }), /* @__PURE__ */ React41.createElement("div", { className: "grid grid-cols-2 gap-4" }, /* @__PURE__ */ React41.createElement(TextInput, { label: "ID Number", value: member.idExtractedData.idNumber, onChange: (v) => updateCompanyMemberInfo(i, "idExtractedData", { ...member.idExtractedData, idNumber: v }), disabled: isReadOnly || isAnyUploading }), /* @__PURE__ */ React41.createElement(TextInput, { label: "Date of Birth", value: member.idExtractedData.dob, onChange: (v) => updateCompanyMemberInfo(i, "idExtractedData", { ...member.idExtractedData, dob: v }), disabled: isReadOnly || isAnyUploading })))), /* @__PURE__ */ React41.createElement("div", { className: "flex items-center gap-2 mt-2" }, !isReadOnly && /* @__PURE__ */ React41.createElement("button", { onClick: () => deleteCompanyMemberDocument(i, "id"), disabled: isAnyUploading, className: "px-6 py-2 bg-white border border-neutral-100 text-neutral-500 text-[11px] rounded-full tracking-widest hover:bg-neutral-50 transition-colors outline-none disabled:opacity-50 disabled:cursor-not-allowed" }, "Delete & Re-upload ID"))) : null, !member.passportFileUrl && !globalUploadingPassport ? /* @__PURE__ */ React41.createElement("button", { onClick: () => !isReadOnly && !isAnyUploading && document.getElementById(`pass-upload-${i}`)?.click(), className: `flex items-center gap-3 p-4 border border-neutral-100 rounded-full transition-colors text-sm w-full outline-none ${isAnyUploading ? "opacity-50 cursor-not-allowed bg-neutral-50 text-neutral-400" : "text-black hover:bg-neutral-50"}`, disabled: isReadOnly || isAnyUploading }, /* @__PURE__ */ React41.createElement(HugeiconsIcon25, { icon: Upload01Icon3, size: 18, className: "text-neutral-400" }), " Upload Passport Photo") : globalUploadingPassport && !member.passportFileUrl ? /* @__PURE__ */ React41.createElement("div", { className: "flex items-center gap-3 p-4 border border-neutral-100 rounded-full bg-neutral-50 text-neutral-500 text-sm w-full" }, /* @__PURE__ */ React41.createElement(HugeiconsIcon25, { icon: Loading03Icon12, size: 18, className: "animate-spin text-black" }), " Uploading Passport...") : member.passportFileUrl ? /* @__PURE__ */ React41.createElement("div", { className: "flex items-center justify-between p-4 bg-emerald-50 rounded-full text-emerald-800 text-sm w-full" }, /* @__PURE__ */ React41.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React41.createElement(HugeiconsIcon25, { icon: IdentificationIcon, size: 18 }), " Passport Uploaded"), !isReadOnly && /* @__PURE__ */ React41.createElement("button", { onClick: () => deleteCompanyMemberDocument(i, "passport"), disabled: isAnyUploading, className: "text-emerald-700 hover:text-red-500 transition-colors p-1 outline-none shrink-0 disabled:opacity-50 disabled:cursor-not-allowed" }, /* @__PURE__ */ React41.createElement(HugeiconsIcon25, { icon: Delete02Icon2, size: 16 }))) : null, !member.signatureFileUrl && !globalUploadingSignature ? /* @__PURE__ */ React41.createElement("button", { onClick: () => !isReadOnly && !isAnyUploading && document.getElementById(`sig-upload-${i}`)?.click(), className: `flex items-center gap-3 p-4 border border-neutral-100 rounded-full transition-colors text-sm w-full outline-none ${isAnyUploading ? "opacity-50 cursor-not-allowed bg-neutral-50 text-neutral-400" : "text-black hover:bg-neutral-50"}`, disabled: isReadOnly || isAnyUploading }, /* @__PURE__ */ React41.createElement(HugeiconsIcon25, { icon: Upload01Icon3, size: 18, className: "text-neutral-400" }), " Upload Signature") : globalUploadingSignature && !member.signatureFileUrl ? /* @__PURE__ */ React41.createElement("div", { className: "flex items-center gap-3 p-4 border border-neutral-100 rounded-full bg-neutral-50 text-neutral-500 text-sm w-full" }, /* @__PURE__ */ React41.createElement(HugeiconsIcon25, { icon: Loading03Icon12, size: 18, className: "animate-spin text-black" }), " Uploading Signature...") : member.signatureFileUrl ? /* @__PURE__ */ React41.createElement("div", { className: "flex items-center justify-between p-4 bg-emerald-50 rounded-full text-emerald-800 text-sm w-full" }, /* @__PURE__ */ React41.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React41.createElement(HugeiconsIcon25, { icon: SignatureIcon, size: 18 }), " Signature Uploaded"), !isReadOnly && /* @__PURE__ */ React41.createElement("button", { onClick: () => deleteCompanyMemberDocument(i, "signature"), disabled: isAnyUploading, className: "text-emerald-700 hover:text-red-500 transition-colors p-1 outline-none shrink-0 disabled:opacity-50 disabled:cursor-not-allowed" }, /* @__PURE__ */ React41.createElement(HugeiconsIcon25, { icon: Delete02Icon2, size: 16 }))) : null)), /* @__PURE__ */ React41.createElement("div", { className: "flex justify-end" }, /* @__PURE__ */ React41.createElement(ThreeDActionButton, { onClick: () => approveSection("membersDocsApproved"), disabled: !areCompanyMemberDocsValid() || isReadOnly || isAnyUploading, className: "w-fit" }, "Confirm All Documents"))) : /* @__PURE__ */ React41.createElement("div", { className: " flex items-center justify-between bg-emerald-50 p-6 rounded-2xl" }, /* @__PURE__ */ React41.createElement("div", null, /* @__PURE__ */ React41.createElement("p", { className: "text-sm text-emerald-800" }, "All Member Documents Verified"), /* @__PURE__ */ React41.createElement("p", { className: "text-xs text-emerald-600 mt-1" }, "Data safely extracted and ready for submission.")), !isReadOnly && /* @__PURE__ */ React41.createElement("button", { onClick: () => editSection("membersDocsApproved"), className: "p-2 text-emerald-700 hover:text-black transition-colors outline-none shrink-0" }, /* @__PURE__ */ React41.createElement(HugeiconsIcon25, { icon: PencilEdit01Icon2, size: 16 })))) : /* @__PURE__ */ React41.createElement(React41.Fragment, null, /* @__PURE__ */ React41.createElement("input", { type: "file", accept: "image/jpeg, image/png, image/webp, application/pdf", ref: idRef, onChange: (e) => handleBusinessUpload(e, "id"), disabled: isReadOnly || isAnyUploading, className: "hidden" }), /* @__PURE__ */ React41.createElement("input", { type: "file", accept: "image/jpeg, image/png, image/webp, application/pdf", ref: passportRef, onChange: (e) => handleBusinessUpload(e, "passport"), disabled: isReadOnly || isAnyUploading, className: "hidden" }), /* @__PURE__ */ React41.createElement("input", { type: "file", accept: "image/jpeg, image/png, image/webp, application/pdf", ref: signatureRef, onChange: (e) => handleBusinessUpload(e, "signature"), disabled: isReadOnly || isAnyUploading, className: "hidden" }), /* @__PURE__ */ React41.createElement("div", { className: "flex flex-col gap-4" }, /* @__PURE__ */ React41.createElement("div", { className: "flex items-center gap-2 text-black" }, /* @__PURE__ */ React41.createElement("h3", { className: "text-sm " }, "Upload Means of Identification")), /* @__PURE__ */ React41.createElement("p", { className: "text-xs text-neutral-500 -mt-2" }, "Upload your NIN, Driver's License, Voter's Card, or Int'l Passport (JPG/PNG/WEBP)."), !formState.idApproved ? /* @__PURE__ */ React41.createElement(React41.Fragment, null, /* @__PURE__ */ React41.createElement("button", { onClick: () => !isReadOnly && !isAnyUploading && idRef.current?.click(), disabled: isReadOnly || isAnyUploading, className: `w-full h-32 border border-neutral-100 rounded-full flex flex-col items-center justify-center gap-2 transition-colors outline-none ${isAnyUploading ? "opacity-50 cursor-not-allowed bg-neutral-50 text-neutral-400" : "hover:bg-neutral-50 text-black"}` }, /* @__PURE__ */ React41.createElement(HugeiconsIcon25, { icon: Upload01Icon3, size: 24, className: "text-neutral-400" }), /* @__PURE__ */ React41.createElement("span", { className: "text-xs" }, "Select ID Image to Upload")), globalExtractingId && /* @__PURE__ */ React41.createElement("div", { className: " mt-2" }, /* @__PURE__ */ React41.createElement(AiStageCheck, { tasks: aiTasks })), formData.idExtractedData && /* @__PURE__ */ React41.createElement("div", { className: " mt-2 animate-in fade-in border border-purple-100 bg-linear-to-bl from-purple-50/80 via-white to-white p-5 rounded-2xl flex flex-col gap-4 relative overflow-hidden" }, /* @__PURE__ */ React41.createElement("div", null, /* @__PURE__ */ React41.createElement("span", { className: "text-[10px] tracking-widest text-purple-600 block mb-2" }, "Review AI Extracted Data"), /* @__PURE__ */ React41.createElement("p", { className: "text-xs text-neutral-500 mb-4" }, "Please verify the extracted information and correct any OCR mistakes before approving."), /* @__PURE__ */ React41.createElement("div", { className: "flex flex-col gap-4" }, /* @__PURE__ */ React41.createElement(TextInput, { label: "Full Name on ID", value: formData.idExtractedData.fullName, onChange: (v) => setFormData((f) => ({ ...f, idExtractedData: { ...f.idExtractedData, fullName: v } })), disabled: isReadOnly || isAnyUploading }), /* @__PURE__ */ React41.createElement("div", { className: "grid grid-cols-2 gap-4" }, /* @__PURE__ */ React41.createElement(TextInput, { label: "ID Number", value: formData.idExtractedData.idNumber, onChange: (v) => setFormData((f) => ({ ...f, idExtractedData: { ...f.idExtractedData, idNumber: v } })), disabled: isReadOnly || isAnyUploading }), /* @__PURE__ */ React41.createElement(TextInput, { label: "Date of Birth (YYYY-MM-DD)", value: formData.idExtractedData.dob, onChange: (v) => setFormData((f) => ({ ...f, idExtractedData: { ...f.idExtractedData, dob: v } })), disabled: isReadOnly || isAnyUploading })))), /* @__PURE__ */ React41.createElement("div", { className: "flex items-center gap-2 mt-2" }, /* @__PURE__ */ React41.createElement(ThreeDActionButton, { onClick: () => approveSection("idApproved"), disabled: isAnyUploading || isReadOnly, className: "w-fit shrink-0" }, "Approve Data"), !isReadOnly && /* @__PURE__ */ React41.createElement("button", { onClick: () => deleteBusinessDocument("id"), disabled: isAnyUploading, className: "px-6 py-2 bg-white border border-neutral-100 text-neutral-500 text-[11px] rounded-full tracking-widest hover:bg-neutral-50 transition-colors outline-none disabled:opacity-50 disabled:cursor-not-allowed" }, "Delete & Re-upload")))) : /* @__PURE__ */ React41.createElement("div", { className: " flex items-center justify-between bg-emerald-50 p-6 rounded-full" }, /* @__PURE__ */ React41.createElement("div", null, /* @__PURE__ */ React41.createElement("p", { className: "text-sm text-emerald-800" }, "ID Document Verified"), /* @__PURE__ */ React41.createElement("p", { className: "text-xs text-emerald-600 mt-1" }, "Data safely extracted and stored.")), !isReadOnly && /* @__PURE__ */ React41.createElement("button", { onClick: () => editSection("idApproved"), className: "p-2 text-emerald-700 hover:text-black transition-colors outline-none shrink-0" }, /* @__PURE__ */ React41.createElement(HugeiconsIcon25, { icon: PencilEdit01Icon2, size: 16 })))), /* @__PURE__ */ React41.createElement("div", { className: "flex flex-col gap-4 pt-6 animate-in slide-in-from-top-4 duration-500" }, /* @__PURE__ */ React41.createElement("div", { className: "flex flex-col gap-3 " }, !formState.passportApproved && !globalUploadingPassport ? /* @__PURE__ */ React41.createElement("button", { onClick: () => !isReadOnly && !isAnyUploading && passportRef.current?.click(), disabled: isReadOnly || isAnyUploading, className: `flex items-center gap-3 p-4 border border-neutral-100 rounded-full transition-colors text-sm w-full outline-none ${isAnyUploading ? "opacity-50 cursor-not-allowed bg-neutral-50 text-neutral-400" : "text-black hover:bg-neutral-50"}` }, /* @__PURE__ */ React41.createElement(HugeiconsIcon25, { icon: Upload01Icon3, size: 18, className: "text-neutral-400" }), " Upload Passport Photo") : globalUploadingPassport && !formData.passportFileUrl ? /* @__PURE__ */ React41.createElement("div", { className: "flex items-center gap-3 p-4 border border-neutral-100 rounded-full bg-neutral-50 text-neutral-500 text-sm w-full" }, /* @__PURE__ */ React41.createElement(HugeiconsIcon25, { icon: Loading03Icon12, size: 18, className: "animate-spin text-black" }), " Uploading Passport...") : /* @__PURE__ */ React41.createElement("div", { className: "flex items-center justify-between p-4 bg-emerald-50 rounded-full text-emerald-800 text-sm w-full" }, /* @__PURE__ */ React41.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React41.createElement(HugeiconsIcon25, { icon: IdentificationIcon, size: 18 }), " Passport Uploaded"), !isReadOnly && /* @__PURE__ */ React41.createElement("button", { onClick: () => deleteBusinessDocument("passport"), disabled: isAnyUploading, className: "text-emerald-700 hover:text-red-500 transition-colors p-1 outline-none shrink-0 disabled:opacity-50 disabled:cursor-not-allowed" }, /* @__PURE__ */ React41.createElement(HugeiconsIcon25, { icon: Delete02Icon2, size: 16 }))), !formState.signatureApproved && !globalUploadingSignature ? /* @__PURE__ */ React41.createElement("button", { onClick: () => !isReadOnly && !isAnyUploading && signatureRef.current?.click(), disabled: isReadOnly || isAnyUploading, className: `flex items-center gap-3 p-4 border border-neutral-100 rounded-full transition-colors text-sm w-full outline-none ${isAnyUploading ? "opacity-50 cursor-not-allowed bg-neutral-50 text-neutral-400" : "text-black hover:bg-neutral-50"}` }, /* @__PURE__ */ React41.createElement(HugeiconsIcon25, { icon: Upload01Icon3, size: 18, className: "text-neutral-400" }), " Upload Signature") : globalUploadingSignature && !formData.signatureFileUrl ? /* @__PURE__ */ React41.createElement("div", { className: "flex items-center gap-3 p-4 border border-neutral-100 rounded-full bg-neutral-50 text-neutral-500 text-sm w-full" }, /* @__PURE__ */ React41.createElement(HugeiconsIcon25, { icon: Loading03Icon12, size: 18, className: "animate-spin text-black" }), " Uploading Signature...") : /* @__PURE__ */ React41.createElement("div", { className: "flex items-center justify-between p-4 bg-emerald-50 rounded-full text-emerald-800 text-sm w-full" }, /* @__PURE__ */ React41.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React41.createElement(HugeiconsIcon25, { icon: SignatureIcon, size: 18 }), " Signature Uploaded"), !isReadOnly && /* @__PURE__ */ React41.createElement("button", { onClick: () => deleteBusinessDocument("signature"), disabled: isAnyUploading, className: "text-emerald-700 hover:text-red-500 transition-colors p-1 outline-none shrink-0 disabled:opacity-50 disabled:cursor-not-allowed" }, /* @__PURE__ */ React41.createElement(HugeiconsIcon25, { icon: Delete02Icon2, size: 16 })))))), /* @__PURE__ */ React41.createElement("div", { className: "flex flex-col gap-4 pt-6 border-t border-neutral-100 animate-in slide-in-from-top-4 duration-500" }, /* @__PURE__ */ React41.createElement("input", { type: "file", accept: "image/jpeg, image/png, image/webp, application/pdf", ref: other1Ref, onChange: (e) => handleOptionalUpload(e, "other1"), disabled: isAnyUploading || isReadOnly, className: "hidden" }), /* @__PURE__ */ React41.createElement("input", { type: "file", accept: "image/jpeg, image/png, image/webp, application/pdf", ref: other2Ref, onChange: (e) => handleOptionalUpload(e, "other2"), disabled: isAnyUploading || isReadOnly, className: "hidden" }), /* @__PURE__ */ React41.createElement("input", { type: "file", accept: "image/jpeg, image/png, image/webp, application/pdf", ref: other3Ref, onChange: (e) => handleOptionalUpload(e, "other3"), disabled: isAnyUploading || isReadOnly, className: "hidden" }), /* @__PURE__ */ React41.createElement("div", { className: "flex flex-col gap-1 mb-2" }, /* @__PURE__ */ React41.createElement("h3", { className: "text-sm text-black" }, "Additional Documents (Optional)"), /* @__PURE__ */ React41.createElement("p", { className: "text-xs text-neutral-500 leading-relaxed" }, "If your ", type === "company" ? "company" : "business", " involves regulated professional services, please upload relevant licenses, certificates, or permits here (up to 3 documents).")), /* @__PURE__ */ React41.createElement("div", { className: "flex flex-col gap-3" }, [1, 2, 3].map((num) => {
|
|
3492
|
+
}, onDecline: () => setNameCheckResult(null) }) : /* @__PURE__ */ React40.createElement("div", { className: "border border-red-100 bg-linear-to-bl from-red-50/80 via-white to-white p-5 rounded-2xl flex flex-col gap-4 relative overflow-hidden" }, /* @__PURE__ */ React40.createElement("div", null, /* @__PURE__ */ React40.createElement("span", { className: "text-[10px] tracking-widest text-red-600 block mb-1" }, "Registry Conflict Detected"), /* @__PURE__ */ React40.createElement("p", { className: "text-sm text-black mb-3" }, nameCheckResult.message), /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-2" }, (nameCheckResult.alternatives || []).map((alt, i) => /* @__PURE__ */ React40.createElement("button", { key: i, onClick: () => setFormData({ ...formData, proposedName: alt }), className: "text-left px-4 py-2 border border-neutral-100 rounded-full hover:border-black text-sm transition-colors outline-none" }, alt)))), /* @__PURE__ */ React40.createElement("button", { onClick: () => setNameCheckResult(null), className: "w-fit text-[11px] tracking-widest text-neutral-500 hover:text-black transition-colors mt-2 outline-none" }, "Try New Name")))) : /* @__PURE__ */ React40.createElement("div", { className: " flex border-b border-neutral-100 items-center justify-between" }, /* @__PURE__ */ React40.createElement("div", null, /* @__PURE__ */ React40.createElement("p", { className: "text-sm text-black" }, formData.approvedName), /* @__PURE__ */ React40.createElement("p", { className: "text-xs text-emerald-600 mt-1" }, "Verified against registry")), !isReadOnly && /* @__PURE__ */ React40.createElement("button", { onClick: () => editSection("nameApproved"), className: "p-2 text-neutral-400 hover:text-black transition-colors outline-none shrink-0" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: PencilEdit01Icon2, size: 16 })))), formState.nameApproved && /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-4 pt-6 animate-in slide-in-from-top-4 duration-500" }, /* @__PURE__ */ React40.createElement("div", { className: "flex items-center text-black" }, /* @__PURE__ */ React40.createElement("h3", { className: "text-sm " }, "Where is your head office located?")), !formState.addressApproved ? /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-4 " }, /* @__PURE__ */ React40.createElement(TextInput, { label: "Street Address", value: formData.address, onChange: (v) => setFormData({ ...formData, address: v }), disabled: isReadOnly || isSubmitting }), /* @__PURE__ */ React40.createElement("div", { className: "grid grid-cols-2 gap-4" }, /* @__PURE__ */ React40.createElement(TextInput, { label: "City", value: formData.city, onChange: (v) => setFormData({ ...formData, city: v }), disabled: isReadOnly || isSubmitting }), /* @__PURE__ */ React40.createElement(TextInput, { label: "State", value: formData.state, readOnly: true, onClick: () => !isReadOnly && setActiveModal({ isOpen: true, type: "state", memberIndex: null, isGlobalState: true }), placeholder: "Select State", onChange: () => {
|
|
3493
|
+
}, disabled: isReadOnly || isSubmitting })), /* @__PURE__ */ React40.createElement(ThreeDActionButton, { onClick: () => approveSection("addressApproved"), disabled: !formData.address || !formData.city || !formData.state || isReadOnly, className: "w-fit mt-2" }, "Confirm Address")) : /* @__PURE__ */ React40.createElement("div", { className: " flex border-b border-neutral-100 items-center justify-between" }, /* @__PURE__ */ React40.createElement("p", { className: "text-sm text-neutral-500" }, formData.address, ", ", formData.city, ", ", formData.state), !isReadOnly && /* @__PURE__ */ React40.createElement("button", { onClick: () => editSection("addressApproved"), className: "p-2 text-neutral-400 hover:text-black transition-colors outline-none shrink-0" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: PencilEdit01Icon2, size: 16 })))), formState.addressApproved && type === "company" && /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-4 pt-6 animate-in slide-in-from-top-4 duration-500" }, /* @__PURE__ */ React40.createElement("div", { className: "flex items-center justify-between gap-2 text-black border-b border-neutral-100 pb-3" }, /* @__PURE__ */ React40.createElement("div", { className: "flex items-center" }, /* @__PURE__ */ React40.createElement("h3", { className: "text-sm " }, "Directors & Shareholders")), !formState.membersDetailsApproved && /* @__PURE__ */ React40.createElement("div", { className: `text-xs px-3 py-1 rounded-full ${getCompanyTotalShares() === 100 ? "bg-emerald-50 text-emerald-600" : "bg-red-50 text-red-500"}` }, "Total Shares: ", getCompanyTotalShares(), "%")), /* @__PURE__ */ React40.createElement("p", { className: "text-xs text-neutral-500 -mt-2" }, "Provide details for all individuals. Ensure total share percentage equals 100%."), !formState.membersDetailsApproved ? /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-6 " }, formData.members.map((member, i) => /* @__PURE__ */ React40.createElement("div", { key: member.id, className: "flex flex-col gap-4 border border-neutral-100 p-5 rounded-2xl bg-neutral-50/30" }, /* @__PURE__ */ React40.createElement("div", { className: "flex justify-between items-center mb-1" }, /* @__PURE__ */ React40.createElement("span", { className: "text-[10px] tracking-widest text-neutral-400" }, "Member ", i + 1), formData.members.length > 1 && !isReadOnly && /* @__PURE__ */ React40.createElement("button", { onClick: () => removeCompanyMember(i), className: "text-red-500 text-xs hover:text-red-600" }, "Remove")), /* @__PURE__ */ React40.createElement("div", { className: "grid grid-cols-2 gap-4" }, /* @__PURE__ */ React40.createElement(TextInput, { label: "Role", value: member.role, readOnly: true, onClick: () => !isReadOnly && setActiveModal({ isOpen: true, type: "role", memberIndex: i }), onChange: () => {
|
|
3494
|
+
}, disabled: isReadOnly || isSubmitting }), member.role !== "Director Only" && /* @__PURE__ */ React40.createElement(NumberInput, { label: "Share Percentage (%)", value: member.sharePercentage, onChange: (v) => updateCompanyMemberInfo(i, "sharePercentage", v), disabled: isReadOnly || isSubmitting })), /* @__PURE__ */ React40.createElement(TextInput, { label: "Full Name", value: member.fullName, onChange: (v) => updateCompanyMemberInfo(i, "fullName", v), disabled: isReadOnly || isSubmitting }), /* @__PURE__ */ React40.createElement("div", { className: "grid grid-cols-2 gap-4" }, /* @__PURE__ */ React40.createElement(NumberInput, { label: "Phone Number", value: member.phone, onChange: (v) => updateCompanyMemberInfo(i, "phone", v), disabled: isReadOnly || isSubmitting }), /* @__PURE__ */ React40.createElement(TextInput, { label: "Email Address", value: member.email, onChange: (v) => updateCompanyMemberInfo(i, "email", v), disabled: isReadOnly || isSubmitting })), /* @__PURE__ */ React40.createElement(TextInput, { label: "Nationality", value: member.nationality, readOnly: true, onClick: () => !isReadOnly && setActiveModal({ isOpen: true, type: "nationality", memberIndex: i }), onChange: () => {
|
|
3495
|
+
}, disabled: isReadOnly || isSubmitting }), /* @__PURE__ */ React40.createElement(TextInput, { label: "Residential Address", value: member.address, onChange: (v) => updateCompanyMemberInfo(i, "address", v), disabled: isReadOnly || isSubmitting }), /* @__PURE__ */ React40.createElement("div", { className: "grid grid-cols-2 gap-4" }, /* @__PURE__ */ React40.createElement(TextInput, { label: "City", value: member.city, onChange: (v) => updateCompanyMemberInfo(i, "city", v), disabled: isReadOnly || isSubmitting }), /* @__PURE__ */ React40.createElement(TextInput, { label: "State", value: member.state, readOnly: true, onClick: () => !isReadOnly && setActiveModal({ isOpen: true, type: "state", memberIndex: i }), onChange: () => {
|
|
3496
|
+
}, disabled: isReadOnly || isSubmitting })))), /* @__PURE__ */ React40.createElement("div", { className: "flex border-b border-neutral-100 items-center justify-between mt-2" }, !isReadOnly && /* @__PURE__ */ React40.createElement("button", { onClick: addCompanyMember, className: "px-6 py-2 bg-white border border-neutral-100 text-black text-[11px] tracking-widest rounded-full hover:bg-neutral-50 transition-colors outline-none" }, "+ Add Member"), /* @__PURE__ */ React40.createElement(ThreeDActionButton, { onClick: () => approveSection("membersDetailsApproved"), disabled: !areCompanyMembersValid() || isReadOnly, className: "w-fit" }, "Confirm Members"))) : /* @__PURE__ */ React40.createElement("div", { className: " flex border-b border-neutral-100 items-center justify-between" }, /* @__PURE__ */ React40.createElement("div", null, /* @__PURE__ */ React40.createElement("p", { className: "text-sm text-black" }, formData.members.length, " Member(s) Registered"), /* @__PURE__ */ React40.createElement("p", { className: "text-xs text-neutral-500 mt-1" }, "Total Shares: 100% Verified.")), !isReadOnly && /* @__PURE__ */ React40.createElement("button", { onClick: () => editSection("membersDetailsApproved"), className: "p-2 text-neutral-400 hover:text-black transition-colors outline-none shrink-0" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: PencilEdit01Icon2, size: 16 })))), formState.addressApproved && type === "business" && /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-4 pt-6 animate-in slide-in-from-top-4 duration-500" }, /* @__PURE__ */ React40.createElement("div", { className: "flex items-center text-black" }, /* @__PURE__ */ React40.createElement("h3", { className: "text-sm " }, "Who owns the business?")), /* @__PURE__ */ React40.createElement("p", { className: "text-xs text-neutral-500 -mt-2" }, "Provide basic contact info. We will extract your DOB and ID number automatically in the next step."), !formState.ownerApproved ? /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-4 " }, /* @__PURE__ */ React40.createElement(TextInput, { label: "Full Name", value: formData.ownerName, onChange: (v) => setFormData({ ...formData, ownerName: v }), disabled: isReadOnly || isSubmitting }), /* @__PURE__ */ React40.createElement("div", { className: "grid grid-cols-2 gap-4" }, /* @__PURE__ */ React40.createElement(NumberInput, { label: "Phone Number", value: formData.ownerPhone, onChange: (v) => setFormData({ ...formData, ownerPhone: v }), disabled: isReadOnly || isSubmitting }), /* @__PURE__ */ React40.createElement(TextInput, { label: "Email Address", value: formData.ownerEmail, onChange: (v) => setFormData({ ...formData, ownerEmail: v }), disabled: isReadOnly || isSubmitting })), /* @__PURE__ */ React40.createElement(ThreeDActionButton, { onClick: () => approveSection("ownerApproved"), disabled: !formData.ownerName || !formData.ownerPhone || !formData.ownerEmail || isReadOnly, className: "w-fit mt-2" }, "Confirm Owner Details")) : /* @__PURE__ */ React40.createElement("div", { className: " border-b border-neutral-100 flex items-center justify-between" }, /* @__PURE__ */ React40.createElement("div", null, /* @__PURE__ */ React40.createElement("p", { className: "text-sm text-black" }, formData.ownerName), /* @__PURE__ */ React40.createElement("p", { className: "text-xs text-neutral-500 mt-1" }, formData.ownerEmail, " \u2022 ", formData.ownerPhone)), !isReadOnly && /* @__PURE__ */ React40.createElement("button", { onClick: () => editSection("ownerApproved"), className: "p-2 text-neutral-400 hover:text-black transition-colors outline-none shrink-0" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: PencilEdit01Icon2, size: 16 })))), /* @__PURE__ */ React40.createElement("div", { className: "flex items-center justify-between mt-8 pt-6 " }, /* @__PURE__ */ React40.createElement("button", { onClick: handleBack, className: "flex items-center gap-2 px-6 py-2 text-[11px] tracking-widest text-neutral-500 hover:text-black hover:bg-neutral-50 rounded-full transition-colors outline-none" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: ArrowLeft01Icon7, size: 14 }), " Close"), /* @__PURE__ */ React40.createElement(ThreeDActionButton, { onClick: handleNext, disabled: !isStep0Valid, className: "w-fit shrink-0" }, "Next Step"))), macroStep === 1 && /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-8 animate-in fade-in" }, type === "company" ? /* @__PURE__ */ React40.createElement(React40.Fragment, null, /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-2" }, /* @__PURE__ */ React40.createElement("h3", { className: "text-sm text-black" }, "Member Identity Documents"), /* @__PURE__ */ React40.createElement("p", { className: "text-xs text-neutral-500 leading-relaxed" }, "Upload valid means of identification, passport photographs, and signatures for every director and shareholder.")), !formState.membersDocsApproved ? /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-6" }, formData.members.map((member, i) => /* @__PURE__ */ React40.createElement("div", { key: member.id, className: "flex flex-col gap-4" }, /* @__PURE__ */ React40.createElement("span", { className: "text-[11px] tracking-widest text-black mb-1" }, member.fullName || `Member ${i + 1}`, " ", /* @__PURE__ */ React40.createElement("span", { className: "text-neutral-400 ml-2" }, "(", member.role, ")")), /* @__PURE__ */ React40.createElement("input", { id: `id-upload-${i}`, type: "file", accept: "image/jpeg, image/png, image/webp, application/pdf", className: "hidden", onChange: (e) => handleCompanyMemberUpload(e, i, "id"), disabled: isReadOnly || isAnyUploading }), /* @__PURE__ */ React40.createElement("input", { id: `pass-upload-${i}`, type: "file", accept: "image/jpeg, image/png, image/webp, application/pdf", className: "hidden", onChange: (e) => handleCompanyMemberUpload(e, i, "passport"), disabled: isReadOnly || isAnyUploading }), /* @__PURE__ */ React40.createElement("input", { id: `sig-upload-${i}`, type: "file", accept: "image/jpeg, image/png, image/webp, application/pdf", className: "hidden", onChange: (e) => handleCompanyMemberUpload(e, i, "signature"), disabled: isReadOnly || isAnyUploading }), !member.idExtractedData && !globalExtractingId ? /* @__PURE__ */ React40.createElement("button", { onClick: () => !isReadOnly && !isAnyUploading && document.getElementById(`id-upload-${i}`)?.click(), className: `flex items-center gap-3 p-4 border border-neutral-100 rounded-full transition-colors text-sm w-full outline-none ${isAnyUploading ? "opacity-50 cursor-not-allowed bg-neutral-50 text-neutral-400" : "text-black hover:bg-neutral-50"}`, disabled: isReadOnly || isAnyUploading }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: Upload01Icon3, size: 18, className: "text-neutral-400" }), " Upload Valid ID (NIN, License, Voter's Card)") : globalExtractingId && !member.idExtractedData ? /* @__PURE__ */ React40.createElement("div", { className: " mt-2" }, /* @__PURE__ */ React40.createElement(AiStageCheck, { tasks: aiTasks })) : member.idExtractedData ? /* @__PURE__ */ React40.createElement("div", { className: " mt-2 animate-in fade-in border border-purple-100 bg-linear-to-bl from-purple-50/80 via-white to-white p-5 rounded-xl flex flex-col gap-4 relative overflow-hidden" }, /* @__PURE__ */ React40.createElement("div", null, /* @__PURE__ */ React40.createElement("span", { className: "text-[10px] tracking-widest text-purple-600 block mb-2" }, "Review Extracted ID"), /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-4" }, /* @__PURE__ */ React40.createElement(TextInput, { label: "Full Name on ID", value: member.idExtractedData.fullName, onChange: (v) => updateCompanyMemberInfo(i, "idExtractedData", { ...member.idExtractedData, fullName: v }), disabled: isReadOnly || isAnyUploading }), /* @__PURE__ */ React40.createElement("div", { className: "grid grid-cols-2 gap-4" }, /* @__PURE__ */ React40.createElement(TextInput, { label: "ID Number", value: member.idExtractedData.idNumber, onChange: (v) => updateCompanyMemberInfo(i, "idExtractedData", { ...member.idExtractedData, idNumber: v }), disabled: isReadOnly || isAnyUploading }), /* @__PURE__ */ React40.createElement(TextInput, { label: "Date of Birth", value: member.idExtractedData.dob, onChange: (v) => updateCompanyMemberInfo(i, "idExtractedData", { ...member.idExtractedData, dob: v }), disabled: isReadOnly || isAnyUploading })))), /* @__PURE__ */ React40.createElement("div", { className: "flex items-center gap-2 mt-2" }, !isReadOnly && /* @__PURE__ */ React40.createElement("button", { onClick: () => deleteCompanyMemberDocument(i, "id"), disabled: isAnyUploading, className: "px-6 py-2 bg-white border border-neutral-100 text-neutral-500 text-[11px] rounded-full tracking-widest hover:bg-neutral-50 transition-colors outline-none disabled:opacity-50 disabled:cursor-not-allowed" }, "Delete & Re-upload ID"))) : null, !member.passportFileUrl && !globalUploadingPassport ? /* @__PURE__ */ React40.createElement("button", { onClick: () => !isReadOnly && !isAnyUploading && document.getElementById(`pass-upload-${i}`)?.click(), className: `flex items-center gap-3 p-4 border border-neutral-100 rounded-full transition-colors text-sm w-full outline-none ${isAnyUploading ? "opacity-50 cursor-not-allowed bg-neutral-50 text-neutral-400" : "text-black hover:bg-neutral-50"}`, disabled: isReadOnly || isAnyUploading }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: Upload01Icon3, size: 18, className: "text-neutral-400" }), " Upload Passport Photo") : globalUploadingPassport && !member.passportFileUrl ? /* @__PURE__ */ React40.createElement("div", { className: "flex items-center gap-3 p-4 border border-neutral-100 rounded-full bg-neutral-50 text-neutral-500 text-sm w-full" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: Loading03Icon12, size: 18, className: "animate-spin text-black" }), " Uploading Passport...") : member.passportFileUrl ? /* @__PURE__ */ React40.createElement("div", { className: "flex items-center justify-between p-4 bg-emerald-50 rounded-full text-emerald-800 text-sm w-full" }, /* @__PURE__ */ React40.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: IdentificationIcon, size: 18 }), " Passport Uploaded"), !isReadOnly && /* @__PURE__ */ React40.createElement("button", { onClick: () => deleteCompanyMemberDocument(i, "passport"), disabled: isAnyUploading, className: "text-emerald-700 hover:text-red-500 transition-colors p-1 outline-none shrink-0 disabled:opacity-50 disabled:cursor-not-allowed" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: Delete02Icon2, size: 16 }))) : null, !member.signatureFileUrl && !globalUploadingSignature ? /* @__PURE__ */ React40.createElement("button", { onClick: () => !isReadOnly && !isAnyUploading && document.getElementById(`sig-upload-${i}`)?.click(), className: `flex items-center gap-3 p-4 border border-neutral-100 rounded-full transition-colors text-sm w-full outline-none ${isAnyUploading ? "opacity-50 cursor-not-allowed bg-neutral-50 text-neutral-400" : "text-black hover:bg-neutral-50"}`, disabled: isReadOnly || isAnyUploading }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: Upload01Icon3, size: 18, className: "text-neutral-400" }), " Upload Signature") : globalUploadingSignature && !member.signatureFileUrl ? /* @__PURE__ */ React40.createElement("div", { className: "flex items-center gap-3 p-4 border border-neutral-100 rounded-full bg-neutral-50 text-neutral-500 text-sm w-full" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: Loading03Icon12, size: 18, className: "animate-spin text-black" }), " Uploading Signature...") : member.signatureFileUrl ? /* @__PURE__ */ React40.createElement("div", { className: "flex items-center justify-between p-4 bg-emerald-50 rounded-full text-emerald-800 text-sm w-full" }, /* @__PURE__ */ React40.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: SignatureIcon, size: 18 }), " Signature Uploaded"), !isReadOnly && /* @__PURE__ */ React40.createElement("button", { onClick: () => deleteCompanyMemberDocument(i, "signature"), disabled: isAnyUploading, className: "text-emerald-700 hover:text-red-500 transition-colors p-1 outline-none shrink-0 disabled:opacity-50 disabled:cursor-not-allowed" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: Delete02Icon2, size: 16 }))) : null)), /* @__PURE__ */ React40.createElement("div", { className: "flex justify-end" }, /* @__PURE__ */ React40.createElement(ThreeDActionButton, { onClick: () => approveSection("membersDocsApproved"), disabled: !areCompanyMemberDocsValid() || isReadOnly || isAnyUploading, className: "w-fit" }, "Confirm All Documents"))) : /* @__PURE__ */ React40.createElement("div", { className: " flex items-center justify-between bg-emerald-50 p-6 rounded-2xl" }, /* @__PURE__ */ React40.createElement("div", null, /* @__PURE__ */ React40.createElement("p", { className: "text-sm text-emerald-800" }, "All Member Documents Verified"), /* @__PURE__ */ React40.createElement("p", { className: "text-xs text-emerald-600 mt-1" }, "Data safely extracted and ready for submission.")), !isReadOnly && /* @__PURE__ */ React40.createElement("button", { onClick: () => editSection("membersDocsApproved"), className: "p-2 text-emerald-700 hover:text-black transition-colors outline-none shrink-0" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: PencilEdit01Icon2, size: 16 })))) : /* @__PURE__ */ React40.createElement(React40.Fragment, null, /* @__PURE__ */ React40.createElement("input", { type: "file", accept: "image/jpeg, image/png, image/webp, application/pdf", ref: idRef, onChange: (e) => handleBusinessUpload(e, "id"), disabled: isReadOnly || isAnyUploading, className: "hidden" }), /* @__PURE__ */ React40.createElement("input", { type: "file", accept: "image/jpeg, image/png, image/webp, application/pdf", ref: passportRef, onChange: (e) => handleBusinessUpload(e, "passport"), disabled: isReadOnly || isAnyUploading, className: "hidden" }), /* @__PURE__ */ React40.createElement("input", { type: "file", accept: "image/jpeg, image/png, image/webp, application/pdf", ref: signatureRef, onChange: (e) => handleBusinessUpload(e, "signature"), disabled: isReadOnly || isAnyUploading, className: "hidden" }), /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-4" }, /* @__PURE__ */ React40.createElement("div", { className: "flex items-center gap-2 text-black" }, /* @__PURE__ */ React40.createElement("h3", { className: "text-sm " }, "Upload Means of Identification")), /* @__PURE__ */ React40.createElement("p", { className: "text-xs text-neutral-500 -mt-2" }, "Upload your NIN, Driver's License, Voter's Card, or Int'l Passport (JPG/PNG/WEBP)."), !formState.idApproved ? /* @__PURE__ */ React40.createElement(React40.Fragment, null, /* @__PURE__ */ React40.createElement("button", { onClick: () => !isReadOnly && !isAnyUploading && idRef.current?.click(), disabled: isReadOnly || isAnyUploading, className: `w-full h-32 border border-neutral-100 rounded-full flex flex-col items-center justify-center gap-2 transition-colors outline-none ${isAnyUploading ? "opacity-50 cursor-not-allowed bg-neutral-50 text-neutral-400" : "hover:bg-neutral-50 text-black"}` }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: Upload01Icon3, size: 24, className: "text-neutral-400" }), /* @__PURE__ */ React40.createElement("span", { className: "text-xs" }, "Select ID Image to Upload")), globalExtractingId && /* @__PURE__ */ React40.createElement("div", { className: " mt-2" }, /* @__PURE__ */ React40.createElement(AiStageCheck, { tasks: aiTasks })), formData.idExtractedData && /* @__PURE__ */ React40.createElement("div", { className: " mt-2 animate-in fade-in border border-purple-100 bg-linear-to-bl from-purple-50/80 via-white to-white p-5 rounded-2xl flex flex-col gap-4 relative overflow-hidden" }, /* @__PURE__ */ React40.createElement("div", null, /* @__PURE__ */ React40.createElement("span", { className: "text-[10px] tracking-widest text-purple-600 block mb-2" }, "Review AI Extracted Data"), /* @__PURE__ */ React40.createElement("p", { className: "text-xs text-neutral-500 mb-4" }, "Please verify the extracted information and correct any OCR mistakes before approving."), /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-4" }, /* @__PURE__ */ React40.createElement(TextInput, { label: "Full Name on ID", value: formData.idExtractedData.fullName, onChange: (v) => setFormData((f) => ({ ...f, idExtractedData: { ...f.idExtractedData, fullName: v } })), disabled: isReadOnly || isAnyUploading }), /* @__PURE__ */ React40.createElement("div", { className: "grid grid-cols-2 gap-4" }, /* @__PURE__ */ React40.createElement(TextInput, { label: "ID Number", value: formData.idExtractedData.idNumber, onChange: (v) => setFormData((f) => ({ ...f, idExtractedData: { ...f.idExtractedData, idNumber: v } })), disabled: isReadOnly || isAnyUploading }), /* @__PURE__ */ React40.createElement(TextInput, { label: "Date of Birth (YYYY-MM-DD)", value: formData.idExtractedData.dob, onChange: (v) => setFormData((f) => ({ ...f, idExtractedData: { ...f.idExtractedData, dob: v } })), disabled: isReadOnly || isAnyUploading })))), /* @__PURE__ */ React40.createElement("div", { className: "flex items-center gap-2 mt-2" }, /* @__PURE__ */ React40.createElement(ThreeDActionButton, { onClick: () => approveSection("idApproved"), disabled: isAnyUploading || isReadOnly, className: "w-fit shrink-0" }, "Approve Data"), !isReadOnly && /* @__PURE__ */ React40.createElement("button", { onClick: () => deleteBusinessDocument("id"), disabled: isAnyUploading, className: "px-6 py-2 bg-white border border-neutral-100 text-neutral-500 text-[11px] rounded-full tracking-widest hover:bg-neutral-50 transition-colors outline-none disabled:opacity-50 disabled:cursor-not-allowed" }, "Delete & Re-upload")))) : /* @__PURE__ */ React40.createElement("div", { className: " flex items-center justify-between bg-emerald-50 p-6 rounded-full" }, /* @__PURE__ */ React40.createElement("div", null, /* @__PURE__ */ React40.createElement("p", { className: "text-sm text-emerald-800" }, "ID Document Verified"), /* @__PURE__ */ React40.createElement("p", { className: "text-xs text-emerald-600 mt-1" }, "Data safely extracted and stored.")), !isReadOnly && /* @__PURE__ */ React40.createElement("button", { onClick: () => editSection("idApproved"), className: "p-2 text-emerald-700 hover:text-black transition-colors outline-none shrink-0" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: PencilEdit01Icon2, size: 16 })))), /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-4 pt-6 animate-in slide-in-from-top-4 duration-500" }, /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-3 " }, !formState.passportApproved && !globalUploadingPassport ? /* @__PURE__ */ React40.createElement("button", { onClick: () => !isReadOnly && !isAnyUploading && passportRef.current?.click(), disabled: isReadOnly || isAnyUploading, className: `flex items-center gap-3 p-4 border border-neutral-100 rounded-full transition-colors text-sm w-full outline-none ${isAnyUploading ? "opacity-50 cursor-not-allowed bg-neutral-50 text-neutral-400" : "text-black hover:bg-neutral-50"}` }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: Upload01Icon3, size: 18, className: "text-neutral-400" }), " Upload Passport Photo") : globalUploadingPassport && !formData.passportFileUrl ? /* @__PURE__ */ React40.createElement("div", { className: "flex items-center gap-3 p-4 border border-neutral-100 rounded-full bg-neutral-50 text-neutral-500 text-sm w-full" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: Loading03Icon12, size: 18, className: "animate-spin text-black" }), " Uploading Passport...") : /* @__PURE__ */ React40.createElement("div", { className: "flex items-center justify-between p-4 bg-emerald-50 rounded-full text-emerald-800 text-sm w-full" }, /* @__PURE__ */ React40.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: IdentificationIcon, size: 18 }), " Passport Uploaded"), !isReadOnly && /* @__PURE__ */ React40.createElement("button", { onClick: () => deleteBusinessDocument("passport"), disabled: isAnyUploading, className: "text-emerald-700 hover:text-red-500 transition-colors p-1 outline-none shrink-0 disabled:opacity-50 disabled:cursor-not-allowed" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: Delete02Icon2, size: 16 }))), !formState.signatureApproved && !globalUploadingSignature ? /* @__PURE__ */ React40.createElement("button", { onClick: () => !isReadOnly && !isAnyUploading && signatureRef.current?.click(), disabled: isReadOnly || isAnyUploading, className: `flex items-center gap-3 p-4 border border-neutral-100 rounded-full transition-colors text-sm w-full outline-none ${isAnyUploading ? "opacity-50 cursor-not-allowed bg-neutral-50 text-neutral-400" : "text-black hover:bg-neutral-50"}` }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: Upload01Icon3, size: 18, className: "text-neutral-400" }), " Upload Signature") : globalUploadingSignature && !formData.signatureFileUrl ? /* @__PURE__ */ React40.createElement("div", { className: "flex items-center gap-3 p-4 border border-neutral-100 rounded-full bg-neutral-50 text-neutral-500 text-sm w-full" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: Loading03Icon12, size: 18, className: "animate-spin text-black" }), " Uploading Signature...") : /* @__PURE__ */ React40.createElement("div", { className: "flex items-center justify-between p-4 bg-emerald-50 rounded-full text-emerald-800 text-sm w-full" }, /* @__PURE__ */ React40.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: SignatureIcon, size: 18 }), " Signature Uploaded"), !isReadOnly && /* @__PURE__ */ React40.createElement("button", { onClick: () => deleteBusinessDocument("signature"), disabled: isAnyUploading, className: "text-emerald-700 hover:text-red-500 transition-colors p-1 outline-none shrink-0 disabled:opacity-50 disabled:cursor-not-allowed" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: Delete02Icon2, size: 16 })))))), /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-4 pt-6 border-t border-neutral-100 animate-in slide-in-from-top-4 duration-500" }, /* @__PURE__ */ React40.createElement("input", { type: "file", accept: "image/jpeg, image/png, image/webp, application/pdf", ref: other1Ref, onChange: (e) => handleOptionalUpload(e, "other1"), disabled: isAnyUploading || isReadOnly, className: "hidden" }), /* @__PURE__ */ React40.createElement("input", { type: "file", accept: "image/jpeg, image/png, image/webp, application/pdf", ref: other2Ref, onChange: (e) => handleOptionalUpload(e, "other2"), disabled: isAnyUploading || isReadOnly, className: "hidden" }), /* @__PURE__ */ React40.createElement("input", { type: "file", accept: "image/jpeg, image/png, image/webp, application/pdf", ref: other3Ref, onChange: (e) => handleOptionalUpload(e, "other3"), disabled: isAnyUploading || isReadOnly, className: "hidden" }), /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-1 mb-2" }, /* @__PURE__ */ React40.createElement("h3", { className: "text-sm text-black" }, "Additional Documents (Optional)"), /* @__PURE__ */ React40.createElement("p", { className: "text-xs text-neutral-500 leading-relaxed" }, "If your ", type === "company" ? "company" : "business", " involves regulated professional services, please upload relevant licenses, certificates, or permits here (up to 3 documents).")), /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-3" }, [1, 2, 3].map((num) => {
|
|
3499
3497
|
const docType = `other${num}`;
|
|
3500
3498
|
const ref = num === 1 ? other1Ref : num === 2 ? other2Ref : other3Ref;
|
|
3501
3499
|
const isUploading = num === 1 ? isUploadingOther1 : num === 2 ? isUploadingOther2 : isUploadingOther3;
|
|
@@ -3503,20 +3501,20 @@ var UniversalRegistrationFlow = ({
|
|
|
3503
3501
|
if (!fileUrl && !isUploading) {
|
|
3504
3502
|
const prevUrl = num > 1 ? formData[`otherDoc${num - 1}Url`] : true;
|
|
3505
3503
|
if (!prevUrl) return null;
|
|
3506
|
-
return /* @__PURE__ */
|
|
3504
|
+
return /* @__PURE__ */ React40.createElement("button", { key: num, onClick: () => !isReadOnly && !isAnyUploading && ref.current?.click(), disabled: isReadOnly || isAnyUploading, className: `flex items-center gap-3 p-4 border border-neutral-100 rounded-full transition-colors text-sm w-full outline-none ${isAnyUploading ? "opacity-50 cursor-not-allowed bg-neutral-50 text-neutral-400" : "text-black hover:bg-neutral-50"}` }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: Upload01Icon3, size: 18, className: "text-neutral-400" }), " Upload Optional Document ", num);
|
|
3507
3505
|
}
|
|
3508
3506
|
if (isUploading) {
|
|
3509
|
-
return /* @__PURE__ */
|
|
3507
|
+
return /* @__PURE__ */ React40.createElement("div", { key: num, className: "flex items-center gap-3 p-4 border border-neutral-100 rounded-full bg-neutral-50 text-neutral-500 text-sm w-full" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: Loading03Icon12, size: 18, className: "animate-spin text-black" }), " Uploading Document ", num, "...");
|
|
3510
3508
|
}
|
|
3511
|
-
return /* @__PURE__ */
|
|
3512
|
-
}))), /* @__PURE__ */
|
|
3509
|
+
return /* @__PURE__ */ React40.createElement("div", { key: num, className: "flex items-center justify-between p-4 bg-emerald-50 rounded-full text-emerald-800 text-sm w-full" }, /* @__PURE__ */ React40.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: CheckmarkBadge01Icon, size: 18 }), " Optional Document ", num, " Uploaded"), !isReadOnly && /* @__PURE__ */ React40.createElement("button", { onClick: () => deleteOptionalDocument(docType), disabled: isAnyUploading, className: "text-emerald-700 hover:text-red-500 transition-colors p-1 outline-none shrink-0 disabled:opacity-50 disabled:cursor-not-allowed" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: Delete02Icon2, size: 16 })));
|
|
3510
|
+
}))), /* @__PURE__ */ React40.createElement("div", { className: "flex items-center justify-between mt-8 pt-6 " }, /* @__PURE__ */ React40.createElement("button", { onClick: handleBack, disabled: isAnyUploading, className: "flex items-center gap-2 px-6 py-2 text-[11px] tracking-widest text-neutral-500 hover:text-black hover:bg-neutral-50 rounded-full transition-colors outline-none disabled:opacity-50 disabled:cursor-not-allowed" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: ArrowLeft01Icon7, size: 14 }), " Back"), /* @__PURE__ */ React40.createElement(ThreeDActionButton, { onClick: handleNext, disabled: !isStep1Valid || isAnyUploading, className: "w-fit shrink-0" }, "Next Step"))), macroStep === 2 && /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-6 animate-in fade-in" }, /* @__PURE__ */ React40.createElement("div", null, /* @__PURE__ */ React40.createElement("h3", { className: "text-sm mb-5 text-black" }, "Application Summary"), /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-4 text-sm" }, /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col sm:flex-row sm:justify-between border-b border-neutral-100 pb-3 gap-1" }, /* @__PURE__ */ React40.createElement("span", { className: "text-neutral-500 truncate text-[13px] " }, type === "company" ? "Company Name" : "Business Name"), /* @__PURE__ */ React40.createElement("span", { className: " text-black text-[13px]" }, formData.approvedName)), /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col sm:flex-row sm:justify-between border-b border-neutral-100 pb-3 gap-1" }, /* @__PURE__ */ React40.createElement("span", { className: "text-neutral-500 text-[13px] " }, "Classification"), /* @__PURE__ */ React40.createElement("span", { className: " text-black truncate sm:text-right text-[13px] " }, formData.natureOfBusiness?.specificLabel || "Pending")), type === "company" ? /* @__PURE__ */ React40.createElement(React40.Fragment, null, /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col sm:flex-row sm:justify-between border-b border-neutral-100 pb-3 gap-1" }, /* @__PURE__ */ React40.createElement("span", { className: "text-neutral-500 text-[13px] " }, "Total Members"), /* @__PURE__ */ React40.createElement("span", { className: " text-black truncate text-[13px] " }, formData.members.length, " Directors/Shareholders")), /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col sm:flex-row sm:justify-between border-b border-neutral-100 pb-3 gap-1" }, /* @__PURE__ */ React40.createElement("span", { className: "text-neutral-500 text-[13px] " }, "Share Capital"), /* @__PURE__ */ React40.createElement("span", { className: " text-black truncate text-[13px] " }, "100% Allocated"))) : /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col sm:flex-row sm:justify-between border-b border-neutral-100 pb-3 gap-1" }, /* @__PURE__ */ React40.createElement("span", { className: "text-neutral-500 text-[13px] " }, "Proprietor"), /* @__PURE__ */ React40.createElement("span", { className: " text-black truncate text-[13px] " }, formData.ownerName)), /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col sm:flex-row sm:justify-between pb-2 gap-1" }, /* @__PURE__ */ React40.createElement("span", { className: "text-neutral-500 text-[13px] " }, "Documents Attached"), /* @__PURE__ */ React40.createElement("span", { className: " text-neutral-400 text-[13px] " }, "ID, Passport, Signature")), formData.otherDoc1Url && /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col sm:flex-row sm:justify-between pb-2 gap-1" }, /* @__PURE__ */ React40.createElement("span", { className: "text-neutral-500 text-[13px] " }, "Optional Documents"), /* @__PURE__ */ React40.createElement("span", { className: " text-neutral-400 text-[13px] " }, [formData.otherDoc1Url, formData.otherDoc2Url, formData.otherDoc3Url].filter(Boolean).length, " Attached")))), /* @__PURE__ */ React40.createElement("div", { className: "flex items-center justify-between mt-4 pt-4 " }, /* @__PURE__ */ React40.createElement("button", { onClick: handleBack, className: "flex items-center gap-2 px-6 py-2 rounded-full text-[11px] tracking-widest text-neutral-500 hover:text-black hover:bg-neutral-50 transition-colors outline-none" }, /* @__PURE__ */ React40.createElement(HugeiconsIcon24, { icon: ArrowLeft01Icon7, size: 14 }), " Back"), /* @__PURE__ */ React40.createElement(ThreeDActionButton, { onClick: handleNext, className: "w-fit shrink-0" }, "Confirm & Proceed"))), macroStep === 3 && /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col gap-6 py-6 animate-in zoom-in-95 duration-500" }, /* @__PURE__ */ React40.createElement("h2", { className: "text-lg font-serif text-black tracking-tight mb-2" }, "Terms and Conditions of Application"), /* @__PURE__ */ React40.createElement("div", { className: "text-xs text-neutral-500 mb-4" }, /* @__PURE__ */ React40.createElement("p", { className: " mb-3" }, "Declaration and Consent"), /* @__PURE__ */ React40.createElement("p", { className: "mb-3 leading-relaxed" }, "By proceeding with this application, you acknowledge and agree that all data, documents, and identification materials provided herein will be securely transmitted to the relevant official registries and authorized agents for the purpose of ", type === "company" ? "company" : "business", " incorporation and compliance verification."), /* @__PURE__ */ React40.createElement("p", { className: "mb-3 leading-relaxed" }, "You confirm that all information provided is accurate and authentic. Any falsification of identity or corporate data may result in immediate rejection, and you may be held liable under applicable laws and regulations."), /* @__PURE__ */ React40.createElement("p", { className: "mb-3 leading-relaxed" }, "This service operates strictly as a digital intermediary connecting you with official registries. The final approval of the ", type === "company" ? "company" : "business", " name and registration rests solely with the regulatory authorities. We are not liable for rejections arising from pre existing conflicts, non compliance, or regulatory policy changes not flagged during the AI pre check stages."), /* @__PURE__ */ React40.createElement("p", { className: "leading-relaxed" }, "Proceeding to generate the invoice confirms your acceptance of these terms and initiates the formal filing process.")), /* @__PURE__ */ React40.createElement("label", { className: "flex items-start gap-3 mt-2 cursor-pointer group" }, /* @__PURE__ */ React40.createElement("input", { type: "checkbox", checked: iAgree, onChange: (e) => setIAgree(e.target.checked), disabled: isReadOnly, className: "mt-0.5 w-4 h-4 accent-black rounded cursor-pointer" }), /* @__PURE__ */ React40.createElement("span", { className: "text-[13px] text-red-500 group-hover:text-red-600 transition-colors" }, "I have read, understood, and agree to the terms of data transfer and processing.")), /* @__PURE__ */ React40.createElement("div", { className: "flex flex-col sm:flex-row items-center gap-4 mt-8 w-full justify-end pt-6" }, /* @__PURE__ */ React40.createElement("button", { onClick: onCancelOrClose, disabled: isSubmitting, className: "px-8 py-2 text-[11px] tracking-widest text-neutral-500 hover:text-black hover:bg-neutral-50 rounded-full transition-colors outline-none w-full sm:w-auto" }, "Cancel"), /* @__PURE__ */ React40.createElement("button", { onClick: () => setMacroStep(0), disabled: isSubmitting || isReadOnly, className: "px-8 py-2 text-[11px] tracking-widest text-neutral-500 hover:text-black hover:bg-neutral-50 rounded-full transition-colors outline-none w-full sm:w-auto" }, "Edit Application"), /* @__PURE__ */ React40.createElement(ThreeDActionButton, { onClick: handleFinalSubmit, disabled: isSubmitting || !iAgree || isReadOnly, isLoading: isSubmitting, className: "min-w-40 w-full sm:w-auto" }, "Submit")))), activeModal.isOpen && /* @__PURE__ */ React40.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ React40.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: () => setActiveModal({ isOpen: false, type: null, memberIndex: null }) }), /* @__PURE__ */ React40.createElement("div", { className: "relative w-80 bg-white shadow-2xl rounded-3xl flex flex-col overflow-hidden animate-in zoom-in-95 duration-200 max-h-[80vh]" }, /* @__PURE__ */ React40.createElement("div", { className: "p-4 text-center w-full shrink-0" }, /* @__PURE__ */ React40.createElement("h3", { className: "text-[14px] text-black tracking-tight capitalize" }, "Select ", activeModal.type)), /* @__PURE__ */ React40.createElement("div", { className: "p-4 flex flex-col gap-2 overflow-y-auto custom-scrollbar" }, (activeModal.type === "state" ? NIGERIAN_STATES : activeModal.type === "role" ? MEMBER_ROLES : NATIONALITIES).map((opt) => {
|
|
3513
3511
|
const isSelected = activeModal.isGlobalState ? formData.state === opt : formData.members[activeModal.memberIndex][activeModal.type] === opt;
|
|
3514
|
-
return /* @__PURE__ */
|
|
3512
|
+
return /* @__PURE__ */ React40.createElement("button", { key: opt, onClick: () => {
|
|
3515
3513
|
if (activeModal.isGlobalState) setFormData({ ...formData, state: opt });
|
|
3516
3514
|
else updateCompanyMemberInfo(activeModal.memberIndex, activeModal.type, opt);
|
|
3517
3515
|
setActiveModal({ isOpen: false, type: null, memberIndex: null });
|
|
3518
3516
|
}, className: `text-left px-4 py-3 rounded-full text-[13px] transition-colors outline-none ${isSelected ? "bg-neutral-100 text-black" : "text-neutral-500 hover:bg-neutral-50 hover:text-black"}` }, opt);
|
|
3519
|
-
})), /* @__PURE__ */
|
|
3517
|
+
})), /* @__PURE__ */ React40.createElement("div", { className: "w-full flex mt-auto shrink-0 " }, /* @__PURE__ */ React40.createElement("button", { onClick: () => setActiveModal({ isOpen: false, type: null, memberIndex: null }), className: "w-full py-4 text-[13px] text-neutral-500 hover:bg-neutral-50 transition-colors outline-none" }, "Close")))));
|
|
3520
3518
|
};
|
|
3521
3519
|
export {
|
|
3522
3520
|
AITranscriptionFeature,
|
|
@@ -3551,7 +3549,6 @@ export {
|
|
|
3551
3549
|
UniversalDashboardPage,
|
|
3552
3550
|
UniversalDirectoryPage,
|
|
3553
3551
|
UniversalErrorView,
|
|
3554
|
-
UniversalHeader,
|
|
3555
3552
|
UniversalIdentityPage,
|
|
3556
3553
|
UniversalLookupPage,
|
|
3557
3554
|
UniversalMembersPage,
|