@retinalabsllc/zairusjs 0.5.9 → 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 +370 -362
- package/dist/index.mjs +348 -338
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -664,9 +664,23 @@ 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 }) => {
|
|
668
|
-
const [
|
|
669
|
-
|
|
667
|
+
var FeatureCard = ({ feature, bgImage }) => {
|
|
668
|
+
const [isBgLoading, setIsBgLoading] = useState4(true);
|
|
669
|
+
const [isFgLoading, setIsFgLoading] = useState4(!!feature.image);
|
|
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
|
+
Image3,
|
|
672
|
+
{
|
|
673
|
+
src: bgImage,
|
|
674
|
+
alt: "Card Background",
|
|
675
|
+
fill: true,
|
|
676
|
+
sizes: "(max-width: 768px) 90vw, 600px",
|
|
677
|
+
onLoad: () => setIsBgLoading(false),
|
|
678
|
+
className: `
|
|
679
|
+
object-cover z-0 transition-all duration-700 ease-out
|
|
680
|
+
${isBgLoading ? "blur-xl scale-110" : "blur-0 scale-100"}
|
|
681
|
+
`
|
|
682
|
+
}
|
|
683
|
+
), /* @__PURE__ */ React9.createElement(
|
|
670
684
|
"div",
|
|
671
685
|
{
|
|
672
686
|
className: "absolute inset-0 w-full h-full pointer-events-none z-0 opacity-[0.25] mix-blend-overlay",
|
|
@@ -674,18 +688,17 @@ var FeatureCard = ({ feature }) => {
|
|
|
674
688
|
backgroundImage: `url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E")`
|
|
675
689
|
}
|
|
676
690
|
}
|
|
677
|
-
),
|
|
678
|
-
/* @__PURE__ */ React9.createElement("div", { className: "absolute -bottom-6 -right-6 w-[85%] h-[85%] z-10 transition-transform duration-700 ease-out group-hover:-translate-x-2 group-hover:-translate-y-2" }, /* @__PURE__ */ React9.createElement(
|
|
691
|
+
), isFgLoading && feature.image && /* @__PURE__ */ React9.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-20 bg-neutral-50/50 backdrop-blur-sm transition-opacity duration-300" }, /* @__PURE__ */ React9.createElement(HugeiconsIcon5, { icon: Loading03Icon2, size: 32, className: "animate-spin text-neutral-400" })), feature.image && /* @__PURE__ */ React9.createElement("div", { className: "absolute -bottom-6 -right-6 w-[85%] h-[85%] z-10 transition-transform duration-700 ease-out group-hover:-translate-x-2 group-hover:-translate-y-2" }, /* @__PURE__ */ React9.createElement(
|
|
679
692
|
Image3,
|
|
680
693
|
{
|
|
681
694
|
src: feature.image,
|
|
682
695
|
alt: feature.title,
|
|
683
696
|
fill: true,
|
|
684
697
|
sizes: "(max-width: 768px) 90vw, 600px",
|
|
685
|
-
onLoad: () =>
|
|
698
|
+
onLoad: () => setIsFgLoading(false),
|
|
686
699
|
className: `
|
|
687
|
-
object-cover rounded-tl-2xl shadow-[-12px_-12px_30px_rgba(0,0,0,0.06)] transition-all duration-700 ease-out
|
|
688
|
-
${
|
|
700
|
+
object-cover object-top-left rounded-tl-2xl shadow-[-12px_-12px_30px_rgba(0,0,0,0.06)] transition-all duration-700 ease-out
|
|
701
|
+
${isFgLoading ? "opacity-0 blur-xl" : "opacity-100 blur-0"}
|
|
689
702
|
`
|
|
690
703
|
}
|
|
691
704
|
))), /* @__PURE__ */ React9.createElement("div", { className: "flex flex-col text-left pr-4" }, /* @__PURE__ */ React9.createElement("h3", { className: " font-serif text-xl tracking-tight text-black mb-2" }, feature.title), /* @__PURE__ */ React9.createElement("p", { className: "text-[13px] leading-relaxed text-neutral-600 max-w-[90%]" }, feature.desc)));
|
|
@@ -712,6 +725,11 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
712
725
|
scrollRef.current.scrollBy({ left: scrollAmount, behavior: "smooth" });
|
|
713
726
|
}
|
|
714
727
|
};
|
|
728
|
+
const bgImages = [
|
|
729
|
+
"/assets/webp/card-bg.webp",
|
|
730
|
+
"/assets/webp/card-bg2.webp",
|
|
731
|
+
"/assets/webp/card-bg3.webp"
|
|
732
|
+
];
|
|
715
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(
|
|
716
734
|
"button",
|
|
717
735
|
{
|
|
@@ -737,7 +755,7 @@ var FeatureScroll = ({ tagline, headline, features }) => {
|
|
|
737
755
|
onScroll: checkScroll,
|
|
738
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"
|
|
739
757
|
},
|
|
740
|
-
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] }))
|
|
741
759
|
), /* @__PURE__ */ React9.createElement("div", { className: "flex md:hidden items-center justify-center gap-4 mt-2" }, /* @__PURE__ */ React9.createElement(
|
|
742
760
|
"button",
|
|
743
761
|
{
|
|
@@ -1431,13 +1449,35 @@ var GifFeatureCard = ({
|
|
|
1431
1449
|
import React25, { useState as useState9, useEffect as useEffect6 } from "react";
|
|
1432
1450
|
import Link9 from "next/link";
|
|
1433
1451
|
import { HugeiconsIcon as HugeiconsIcon13 } from "@hugeicons/react";
|
|
1434
|
-
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" }));
|
|
1435
1461
|
var UniversalSidebar = ({
|
|
1436
1462
|
navItems,
|
|
1437
1463
|
currentPath,
|
|
1438
1464
|
isMobileOpen,
|
|
1439
1465
|
closeMobile,
|
|
1466
|
+
openMobile,
|
|
1440
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
|
|
1441
1481
|
showInterceptDialog = false,
|
|
1442
1482
|
onCancelIntercept,
|
|
1443
1483
|
onConfirmIntercept,
|
|
@@ -1445,6 +1485,9 @@ var UniversalSidebar = ({
|
|
|
1445
1485
|
interceptMessage = "Are you sure you want to leave? All unsaved changes will be lost."
|
|
1446
1486
|
}) => {
|
|
1447
1487
|
const [isCollapsed, setIsCollapsed] = useState9(false);
|
|
1488
|
+
const [showSwitcherDialog, setShowSwitcherDialog] = useState9(false);
|
|
1489
|
+
const [showLogoutDialog, setShowLogoutDialog] = useState9(false);
|
|
1490
|
+
const [isLoggingOut, setIsLoggingOut] = useState9(false);
|
|
1448
1491
|
useEffect6(() => {
|
|
1449
1492
|
if (isMobileOpen) {
|
|
1450
1493
|
closeMobile();
|
|
@@ -1453,7 +1496,25 @@ var UniversalSidebar = ({
|
|
|
1453
1496
|
const hasActiveMatch = navItems.some(
|
|
1454
1497
|
(item) => item.path === "/mod" || item.path === "/app" ? currentPath === item.path : currentPath === item.path || currentPath?.startsWith(`${item.path}/`)
|
|
1455
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
|
+
};
|
|
1456
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(
|
|
1457
1518
|
"div",
|
|
1458
1519
|
{
|
|
1459
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"}`,
|
|
@@ -1469,16 +1530,16 @@ var UniversalSidebar = ({
|
|
|
1469
1530
|
${isCollapsed ? "md:w-16 w-64" : "w-64"}
|
|
1470
1531
|
`
|
|
1471
1532
|
},
|
|
1472
|
-
/* @__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(
|
|
1473
1534
|
"button",
|
|
1474
1535
|
{
|
|
1475
1536
|
onClick: closeMobile,
|
|
1476
1537
|
className: "text-neutral-400 hover:text-black transition-colors outline-none",
|
|
1477
1538
|
"aria-label": "Close Menu"
|
|
1478
1539
|
},
|
|
1479
|
-
/* @__PURE__ */ React25.createElement(HugeiconsIcon13, { icon: CancelCircleIcon, size:
|
|
1480
|
-
)),
|
|
1481
|
-
/* @__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) => {
|
|
1482
1543
|
const isExactOrSubMatch = item.path === "/mod" || item.path === "/app" ? currentPath === item.path : currentPath === item.path || currentPath?.startsWith(`${item.path}/`);
|
|
1483
1544
|
const isCurrentRoute = isExactOrSubMatch || !hasActiveMatch && index === 0;
|
|
1484
1545
|
return /* @__PURE__ */ React25.createElement(
|
|
@@ -1487,7 +1548,7 @@ var UniversalSidebar = ({
|
|
|
1487
1548
|
key: item.name,
|
|
1488
1549
|
href: item.path,
|
|
1489
1550
|
onClick: (e) => onNavClick ? onNavClick(e, item.path) : void 0,
|
|
1490
|
-
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"}`,
|
|
1491
1552
|
title: isCollapsed && !isMobileOpen ? item.name : void 0
|
|
1492
1553
|
},
|
|
1493
1554
|
/* @__PURE__ */ React25.createElement(
|
|
@@ -1501,7 +1562,31 @@ var UniversalSidebar = ({
|
|
|
1501
1562
|
(!isCollapsed || isMobileOpen) && /* @__PURE__ */ React25.createElement("span", { className: "text-xs tracking-wide truncate" }, item.name)
|
|
1502
1563
|
);
|
|
1503
1564
|
})),
|
|
1504
|
-
/* @__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(
|
|
1505
1590
|
"button",
|
|
1506
1591
|
{
|
|
1507
1592
|
onClick: () => setIsCollapsed(!isCollapsed),
|
|
@@ -1509,108 +1594,14 @@ var UniversalSidebar = ({
|
|
|
1509
1594
|
},
|
|
1510
1595
|
/* @__PURE__ */ React25.createElement(HugeiconsIcon13, { icon: SidebarLeft01Icon, size: 18, className: "shrink-0 text-neutral-400" }),
|
|
1511
1596
|
!isCollapsed && /* @__PURE__ */ React25.createElement("span", { className: "text-xs" }, "Collapse")
|
|
1512
|
-
))
|
|
1513
|
-
),
|
|
1514
|
-
"div",
|
|
1515
|
-
{
|
|
1516
|
-
className: "absolute inset-0 bg-black/30",
|
|
1517
|
-
onClick: onCancelIntercept
|
|
1518
|
-
}
|
|
1519
|
-
), /* @__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(
|
|
1520
|
-
"button",
|
|
1521
|
-
{
|
|
1522
|
-
onClick: onCancelIntercept,
|
|
1523
|
-
className: "flex-1 py-2 text-[13px] text-neutral-600 hover:bg-neutral-50 transition-colors outline-none"
|
|
1524
|
-
},
|
|
1525
|
-
"Cancel"
|
|
1526
|
-
), /* @__PURE__ */ React25.createElement(
|
|
1527
|
-
"button",
|
|
1528
|
-
{
|
|
1529
|
-
onClick: onConfirmIntercept,
|
|
1530
|
-
className: "flex-1 py-2 text-[13px] text-[#F16A50] hover:bg-neutral-50 transition-colors flex justify-center items-center outline-none"
|
|
1531
|
-
},
|
|
1532
|
-
"Leave"
|
|
1533
|
-
)))));
|
|
1534
|
-
};
|
|
1535
|
-
|
|
1536
|
-
// src/components/UniversalHeader.tsx
|
|
1537
|
-
import React26, { useState as useState10 } from "react";
|
|
1538
|
-
import Link10 from "next/link";
|
|
1539
|
-
import { HugeiconsIcon as HugeiconsIcon14 } from "@hugeicons/react";
|
|
1540
|
-
import {
|
|
1541
|
-
UserIcon,
|
|
1542
|
-
SidebarLeft01Icon as SidebarLeft01Icon2,
|
|
1543
|
-
CheckmarkCircle01Icon,
|
|
1544
|
-
LogoutCircle02Icon,
|
|
1545
|
-
ArrowLeft01Icon as ArrowLeft01Icon2
|
|
1546
|
-
} from "@hugeicons/core-free-icons";
|
|
1547
|
-
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" }));
|
|
1548
|
-
var UniversalHeader = ({
|
|
1549
|
-
onOpenMobile,
|
|
1550
|
-
title,
|
|
1551
|
-
subtitle,
|
|
1552
|
-
homeUrl = "/app",
|
|
1553
|
-
showBackButton = false,
|
|
1554
|
-
backUrl = "/app",
|
|
1555
|
-
showWorkspaceSwitcher = false,
|
|
1556
|
-
workspaces = [],
|
|
1557
|
-
activeWorkspaceId,
|
|
1558
|
-
onSwitchWorkspace,
|
|
1559
|
-
showLogoutAction = false,
|
|
1560
|
-
onLogout
|
|
1561
|
-
}) => {
|
|
1562
|
-
const [showSwitcherDialog, setShowSwitcherDialog] = useState10(false);
|
|
1563
|
-
const [showLogoutDialog, setShowLogoutDialog] = useState10(false);
|
|
1564
|
-
const [isLoggingOut, setIsLoggingOut] = useState10(false);
|
|
1565
|
-
const handleLogoutInitiation = async () => {
|
|
1566
|
-
if (isLoggingOut || !onLogout) return;
|
|
1567
|
-
setIsLoggingOut(true);
|
|
1568
|
-
try {
|
|
1569
|
-
await onLogout();
|
|
1570
|
-
} catch (error) {
|
|
1571
|
-
setIsLoggingOut(false);
|
|
1572
|
-
setShowLogoutDialog(false);
|
|
1573
|
-
}
|
|
1574
|
-
};
|
|
1575
|
-
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(
|
|
1576
|
-
"button",
|
|
1577
|
-
{
|
|
1578
|
-
className: "md:hidden bg-white rounded-full w-8 h-8 text-neutral-500 hover:text-black transition-colors outline-none",
|
|
1579
|
-
onClick: onOpenMobile,
|
|
1580
|
-
"aria-label": "Open Menu"
|
|
1581
|
-
},
|
|
1582
|
-
/* @__PURE__ */ React26.createElement(HugeiconsIcon14, { icon: SidebarLeft01Icon2, size: 16 })
|
|
1583
|
-
), /* @__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(
|
|
1584
|
-
"button",
|
|
1585
|
-
{
|
|
1586
|
-
onClick: () => setShowSwitcherDialog(true),
|
|
1587
|
-
className: "w-8 h-8 rounded-full bg-white flex items-center justify-center text-black transition-all group outline-none",
|
|
1588
|
-
"aria-label": "Switch Workspace"
|
|
1589
|
-
},
|
|
1590
|
-
/* @__PURE__ */ React26.createElement(HugeiconsIcon14, { icon: UserIcon, size: 16, className: "transition-transform group-hover:-translate-x-0.5" })
|
|
1591
|
-
), showLogoutAction && /* @__PURE__ */ React26.createElement(
|
|
1592
|
-
"button",
|
|
1593
|
-
{
|
|
1594
|
-
onClick: () => setShowLogoutDialog(true),
|
|
1595
|
-
className: "w-8 h-8 rounded-full bg-white flex items-center justify-center text-black transition-all group outline-none",
|
|
1596
|
-
"aria-label": "Secure Logout"
|
|
1597
|
-
},
|
|
1598
|
-
/* @__PURE__ */ React26.createElement(HugeiconsIcon14, { icon: LogoutCircle02Icon, size: 16, className: "transition-transform group-hover:-translate-x-0.5" })
|
|
1599
|
-
), showBackButton && /* @__PURE__ */ React26.createElement(
|
|
1600
|
-
Link10,
|
|
1601
|
-
{
|
|
1602
|
-
href: backUrl,
|
|
1603
|
-
className: "flex items-center bg-white justify-center w-8 h-8 rounded-full text-black transition-all group outline-none",
|
|
1604
|
-
"aria-label": "Go Back"
|
|
1605
|
-
},
|
|
1606
|
-
/* @__PURE__ */ React26.createElement(HugeiconsIcon14, { icon: ArrowLeft01Icon2, size: 16, className: "transition-transform group-hover:-translate-x-0.5" })
|
|
1607
|
-
))))), 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(
|
|
1608
1599
|
"div",
|
|
1609
1600
|
{
|
|
1610
1601
|
className: "absolute inset-0 bg-black/30",
|
|
1611
1602
|
onClick: () => setShowSwitcherDialog(false)
|
|
1612
1603
|
}
|
|
1613
|
-
), /* @__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(
|
|
1614
1605
|
"button",
|
|
1615
1606
|
{
|
|
1616
1607
|
key: org.id,
|
|
@@ -1620,22 +1611,22 @@ var UniversalHeader = ({
|
|
|
1620
1611
|
},
|
|
1621
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"
|
|
1622
1613
|
},
|
|
1623
|
-
/* @__PURE__ */
|
|
1624
|
-
activeWorkspaceId === org.id && /* @__PURE__ */
|
|
1625
|
-
))), /* @__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(
|
|
1626
1617
|
"button",
|
|
1627
1618
|
{
|
|
1628
1619
|
onClick: () => setShowSwitcherDialog(false),
|
|
1629
1620
|
className: "w-full py-2.5 text-[13px] text-neutral-600 hover:bg-neutral-50 transition-colors outline-none"
|
|
1630
1621
|
},
|
|
1631
1622
|
"Cancel"
|
|
1632
|
-
)))), 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(
|
|
1633
1624
|
"div",
|
|
1634
1625
|
{
|
|
1635
1626
|
className: "absolute inset-0 bg-black/30",
|
|
1636
1627
|
onClick: () => !isLoggingOut && setShowLogoutDialog(false)
|
|
1637
1628
|
}
|
|
1638
|
-
), /* @__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(
|
|
1639
1630
|
"button",
|
|
1640
1631
|
{
|
|
1641
1632
|
onClick: () => setShowLogoutDialog(false),
|
|
@@ -1643,21 +1634,41 @@ var UniversalHeader = ({
|
|
|
1643
1634
|
className: "flex-1 py-2 text-[13px] text-neutral-600 hover:bg-neutral-50 transition-colors disabled:opacity-50 outline-none"
|
|
1644
1635
|
},
|
|
1645
1636
|
"Cancel"
|
|
1646
|
-
), /* @__PURE__ */
|
|
1637
|
+
), /* @__PURE__ */ React25.createElement(
|
|
1647
1638
|
"button",
|
|
1648
1639
|
{
|
|
1649
1640
|
onClick: handleLogoutInitiation,
|
|
1650
1641
|
disabled: isLoggingOut,
|
|
1651
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"
|
|
1652
1643
|
},
|
|
1653
|
-
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"
|
|
1654
1665
|
)))));
|
|
1655
1666
|
};
|
|
1656
1667
|
|
|
1657
1668
|
// src/components/UniversalOrganizationPage.tsx
|
|
1658
|
-
import
|
|
1669
|
+
import React26, { useState as useState10, useEffect as useEffect7 } from "react";
|
|
1659
1670
|
import toast2 from "react-hot-toast";
|
|
1660
|
-
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" }));
|
|
1661
1672
|
var UniversalOrganizationPage = ({
|
|
1662
1673
|
initialOrgName,
|
|
1663
1674
|
initialSlug,
|
|
@@ -1667,11 +1678,11 @@ var UniversalOrganizationPage = ({
|
|
|
1667
1678
|
onSaveConfiguration,
|
|
1668
1679
|
onCheckSlugAvailability
|
|
1669
1680
|
}) => {
|
|
1670
|
-
const [orgName, setOrgName] =
|
|
1671
|
-
const [slug, setSlug] =
|
|
1672
|
-
const [isCheckingSlug, setIsCheckingSlug] =
|
|
1673
|
-
const [slugAvailable, setSlugAvailable] =
|
|
1674
|
-
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);
|
|
1675
1686
|
useEffect7(() => {
|
|
1676
1687
|
setOrgName(initialOrgName || "");
|
|
1677
1688
|
setSlug(initialSlug || "");
|
|
@@ -1736,7 +1747,7 @@ var UniversalOrganizationPage = ({
|
|
|
1736
1747
|
};
|
|
1737
1748
|
const hasChanges = orgName !== initialOrgName || slug !== initialSlug;
|
|
1738
1749
|
const isSaveDisabled = isSubmitting || isReadOnly || isCheckingSlug || !hasChanges || orgName.length < 3 || slug.length < 3 || slug !== initialSlug && slugAvailable === false;
|
|
1739
|
-
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(
|
|
1740
1751
|
TextInput,
|
|
1741
1752
|
{
|
|
1742
1753
|
label: "Organization Name",
|
|
@@ -1746,7 +1757,7 @@ var UniversalOrganizationPage = ({
|
|
|
1746
1757
|
placeholder: "Acme Corporation",
|
|
1747
1758
|
maxLength: 50
|
|
1748
1759
|
}
|
|
1749
|
-
), /* @__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(
|
|
1750
1761
|
"input",
|
|
1751
1762
|
{
|
|
1752
1763
|
type: "text",
|
|
@@ -1758,7 +1769,7 @@ var UniversalOrganizationPage = ({
|
|
|
1758
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",
|
|
1759
1770
|
placeholder: "acme-corp"
|
|
1760
1771
|
}
|
|
1761
|
-
), /* @__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(
|
|
1762
1773
|
ThreeDActionButton,
|
|
1763
1774
|
{
|
|
1764
1775
|
type: "submit",
|
|
@@ -1767,7 +1778,7 @@ var UniversalOrganizationPage = ({
|
|
|
1767
1778
|
className: "min-w-32"
|
|
1768
1779
|
},
|
|
1769
1780
|
"Save Changes"
|
|
1770
|
-
), hasChanges && !isSubmitting && !isReadOnly && /* @__PURE__ */
|
|
1781
|
+
), hasChanges && !isSubmitting && !isReadOnly && /* @__PURE__ */ React26.createElement(
|
|
1771
1782
|
"button",
|
|
1772
1783
|
{
|
|
1773
1784
|
type: "button",
|
|
@@ -1782,9 +1793,9 @@ var UniversalOrganizationPage = ({
|
|
|
1782
1793
|
};
|
|
1783
1794
|
|
|
1784
1795
|
// src/components/UniversalIdentityPage.tsx
|
|
1785
|
-
import
|
|
1796
|
+
import React27, { useState as useState11, useEffect as useEffect8 } from "react";
|
|
1786
1797
|
import toast3 from "react-hot-toast";
|
|
1787
|
-
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" }));
|
|
1788
1799
|
var UniversalIdentityPage = ({
|
|
1789
1800
|
headerTitle,
|
|
1790
1801
|
headerDescription,
|
|
@@ -1800,11 +1811,11 @@ var UniversalIdentityPage = ({
|
|
|
1800
1811
|
onDeleteResource,
|
|
1801
1812
|
onSuccessfulDeleteRedirect = "/app"
|
|
1802
1813
|
}) => {
|
|
1803
|
-
const [primaryValue, setPrimaryValue] =
|
|
1804
|
-
const [secondaryValue, setSecondaryValue] =
|
|
1805
|
-
const [isSubmitting, setIsSubmitting] =
|
|
1806
|
-
const [isDeleteModalOpen, setIsDeleteModalOpen] =
|
|
1807
|
-
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);
|
|
1808
1819
|
useEffect8(() => {
|
|
1809
1820
|
setPrimaryValue(initialPrimaryValue || "");
|
|
1810
1821
|
setSecondaryValue(initialSecondaryValue || "");
|
|
@@ -1856,7 +1867,7 @@ var UniversalIdentityPage = ({
|
|
|
1856
1867
|
};
|
|
1857
1868
|
const hasChanges = primaryValue !== initialPrimaryValue || secondaryValue !== initialSecondaryValue;
|
|
1858
1869
|
const isSaveDisabled = isSubmitting || isReadOnly || !hasChanges || primaryValue.trim().length < 3;
|
|
1859
|
-
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(
|
|
1860
1871
|
TextInput,
|
|
1861
1872
|
{
|
|
1862
1873
|
label: primaryInputLabel,
|
|
@@ -1865,7 +1876,7 @@ var UniversalIdentityPage = ({
|
|
|
1865
1876
|
disabled: isReadOnly || isSubmitting,
|
|
1866
1877
|
maxLength: 50
|
|
1867
1878
|
}
|
|
1868
|
-
), secondaryInputLabel && /* @__PURE__ */
|
|
1879
|
+
), secondaryInputLabel && /* @__PURE__ */ React27.createElement(
|
|
1869
1880
|
TextInput,
|
|
1870
1881
|
{
|
|
1871
1882
|
label: secondaryInputLabel,
|
|
@@ -1874,7 +1885,7 @@ var UniversalIdentityPage = ({
|
|
|
1874
1885
|
disabled: isReadOnly || isSubmitting,
|
|
1875
1886
|
maxLength: 150
|
|
1876
1887
|
}
|
|
1877
|
-
), !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(
|
|
1878
1889
|
ThreeDActionButton,
|
|
1879
1890
|
{
|
|
1880
1891
|
type: "submit",
|
|
@@ -1883,7 +1894,7 @@ var UniversalIdentityPage = ({
|
|
|
1883
1894
|
className: "min-w-32 w-full sm:w-auto"
|
|
1884
1895
|
},
|
|
1885
1896
|
"Save Changes"
|
|
1886
|
-
), hasChanges && !isSubmitting && /* @__PURE__ */
|
|
1897
|
+
), hasChanges && !isSubmitting && /* @__PURE__ */ React27.createElement(
|
|
1887
1898
|
"button",
|
|
1888
1899
|
{
|
|
1889
1900
|
type: "button",
|
|
@@ -1894,7 +1905,7 @@ var UniversalIdentityPage = ({
|
|
|
1894
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"
|
|
1895
1906
|
},
|
|
1896
1907
|
"Cancel"
|
|
1897
|
-
)), allowDeletion && /* @__PURE__ */
|
|
1908
|
+
)), allowDeletion && /* @__PURE__ */ React27.createElement(
|
|
1898
1909
|
"button",
|
|
1899
1910
|
{
|
|
1900
1911
|
type: "button",
|
|
@@ -1903,7 +1914,7 @@ var UniversalIdentityPage = ({
|
|
|
1903
1914
|
},
|
|
1904
1915
|
"Delete ",
|
|
1905
1916
|
headerTitle.split(" ")[0]
|
|
1906
|
-
)))), 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(
|
|
1907
1918
|
"button",
|
|
1908
1919
|
{
|
|
1909
1920
|
type: "button",
|
|
@@ -1912,7 +1923,7 @@ var UniversalIdentityPage = ({
|
|
|
1912
1923
|
className: "flex-1 py-2 text-[13px] text-neutral-600 hover:bg-neutral-50 transition-colors disabled:opacity-50 outline-none"
|
|
1913
1924
|
},
|
|
1914
1925
|
"Cancel"
|
|
1915
|
-
), /* @__PURE__ */
|
|
1926
|
+
), /* @__PURE__ */ React27.createElement(
|
|
1916
1927
|
"button",
|
|
1917
1928
|
{
|
|
1918
1929
|
type: "button",
|
|
@@ -1920,14 +1931,14 @@ var UniversalIdentityPage = ({
|
|
|
1920
1931
|
disabled: isDeleting,
|
|
1921
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"
|
|
1922
1933
|
},
|
|
1923
|
-
isDeleting ? /* @__PURE__ */
|
|
1934
|
+
isDeleting ? /* @__PURE__ */ React27.createElement(ButtonSpinner2, null) : "Delete"
|
|
1924
1935
|
)))));
|
|
1925
1936
|
};
|
|
1926
1937
|
|
|
1927
1938
|
// src/components/UniversalMembersPage.tsx
|
|
1928
|
-
import
|
|
1939
|
+
import React28, { useState as useState12, useEffect as useEffect9, useRef as useRef4 } from "react";
|
|
1929
1940
|
import toast4 from "react-hot-toast";
|
|
1930
|
-
import { HugeiconsIcon as
|
|
1941
|
+
import { HugeiconsIcon as HugeiconsIcon14 } from "@hugeicons/react";
|
|
1931
1942
|
import {
|
|
1932
1943
|
UserAdd01Icon,
|
|
1933
1944
|
ArrowLeft01Icon as ArrowLeft01Icon3,
|
|
@@ -1936,8 +1947,8 @@ import {
|
|
|
1936
1947
|
ArrowDown01Icon as ArrowDown01Icon2,
|
|
1937
1948
|
Loading03Icon as Loading03Icon6
|
|
1938
1949
|
} from "@hugeicons/core-free-icons";
|
|
1939
|
-
var ButtonSpinner3 = () => /* @__PURE__ */
|
|
1940
|
-
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" }));
|
|
1941
1952
|
var getInitials = (name) => {
|
|
1942
1953
|
if (!name) return "U";
|
|
1943
1954
|
const parts = name.trim().split(" ");
|
|
@@ -1980,16 +1991,16 @@ var UniversalMembersPage = ({
|
|
|
1980
1991
|
onRemoveMember,
|
|
1981
1992
|
onUpdateRole
|
|
1982
1993
|
}) => {
|
|
1983
|
-
const [currentView, setCurrentView] =
|
|
1984
|
-
const [selectedMember, setSelectedMember] =
|
|
1985
|
-
const [inviteEmail, setInviteEmail] =
|
|
1986
|
-
const [inviteFirst, setInviteFirst] =
|
|
1987
|
-
const [inviteLast, setInviteLast] =
|
|
1988
|
-
const [isInviting, setIsInviting] =
|
|
1989
|
-
const [isRoleModalOpen, setIsRoleModalOpen] =
|
|
1990
|
-
const [isUpdatingRole, setIsUpdatingRole] =
|
|
1991
|
-
const [memberToDelete, setMemberToDelete] =
|
|
1992
|
-
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);
|
|
1993
2004
|
const dropdownRef = useRef4(null);
|
|
1994
2005
|
useEffect9(() => {
|
|
1995
2006
|
function handleClickOutside(event) {
|
|
@@ -2065,15 +2076,15 @@ var UniversalMembersPage = ({
|
|
|
2065
2076
|
setSelectedMember(null);
|
|
2066
2077
|
setIsRoleModalOpen(false);
|
|
2067
2078
|
};
|
|
2068
|
-
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(
|
|
2069
2080
|
ThreeDActionButton,
|
|
2070
2081
|
{
|
|
2071
2082
|
onClick: () => setCurrentView("invite"),
|
|
2072
2083
|
className: "w-fit shrink-0 gap-2"
|
|
2073
2084
|
},
|
|
2074
|
-
/* @__PURE__ */
|
|
2085
|
+
/* @__PURE__ */ React28.createElement(HugeiconsIcon14, { icon: UserAdd01Icon, size: 12 }),
|
|
2075
2086
|
"Add Member"
|
|
2076
|
-
)), 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(
|
|
2077
2088
|
"div",
|
|
2078
2089
|
{
|
|
2079
2090
|
key: member.id,
|
|
@@ -2083,7 +2094,7 @@ var UniversalMembersPage = ({
|
|
|
2083
2094
|
},
|
|
2084
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"
|
|
2085
2096
|
},
|
|
2086
|
-
/* @__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(
|
|
2087
2098
|
"img",
|
|
2088
2099
|
{
|
|
2089
2100
|
src: member.displayImage,
|
|
@@ -2091,25 +2102,25 @@ var UniversalMembersPage = ({
|
|
|
2091
2102
|
className: "w-full h-full object-cover blur-sm transition-all duration-300",
|
|
2092
2103
|
onLoad: (e) => e.currentTarget.classList.remove("blur-sm")
|
|
2093
2104
|
}
|
|
2094
|
-
)) : /* @__PURE__ */
|
|
2095
|
-
/* @__PURE__ */
|
|
2096
|
-
))), /* @__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(
|
|
2097
2108
|
"button",
|
|
2098
2109
|
{
|
|
2099
2110
|
onClick: () => onPageChange(currentPage - 1),
|
|
2100
2111
|
disabled: currentPage === 1 || isLoading,
|
|
2101
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"
|
|
2102
2113
|
},
|
|
2103
|
-
/* @__PURE__ */
|
|
2104
|
-
), /* @__PURE__ */
|
|
2114
|
+
/* @__PURE__ */ React28.createElement(HugeiconsIcon14, { icon: ArrowLeft01Icon3, size: 14 })
|
|
2115
|
+
), /* @__PURE__ */ React28.createElement(
|
|
2105
2116
|
"button",
|
|
2106
2117
|
{
|
|
2107
2118
|
onClick: () => onPageChange(currentPage + 1),
|
|
2108
2119
|
disabled: currentPage >= totalPages || isLoading,
|
|
2109
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"
|
|
2110
2121
|
},
|
|
2111
|
-
/* @__PURE__ */
|
|
2112
|
-
))))), 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(
|
|
2113
2124
|
"img",
|
|
2114
2125
|
{
|
|
2115
2126
|
src: selectedMember.displayImage,
|
|
@@ -2117,7 +2128,7 @@ var UniversalMembersPage = ({
|
|
|
2117
2128
|
className: "w-full h-full object-cover blur-sm transition-all duration-300",
|
|
2118
2129
|
onLoad: (e) => e.currentTarget.classList.remove("blur-sm")
|
|
2119
2130
|
}
|
|
2120
|
-
)) : /* @__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(
|
|
2121
2132
|
"button",
|
|
2122
2133
|
{
|
|
2123
2134
|
onClick: () => !isUpdatingRole && setIsRoleModalOpen(true),
|
|
@@ -2125,16 +2136,16 @@ var UniversalMembersPage = ({
|
|
|
2125
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"}`
|
|
2126
2137
|
},
|
|
2127
2138
|
selectedMember.role,
|
|
2128
|
-
isUpdatingRole ? /* @__PURE__ */
|
|
2129
|
-
) : /* @__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(
|
|
2130
2141
|
"button",
|
|
2131
2142
|
{
|
|
2132
2143
|
onClick: () => setMemberToDelete(selectedMember),
|
|
2133
2144
|
className: "flex items-center gap-2 text-[11px] tracking-widest text-red-600 hover:text-red-700 transition-colors w-fit outline-none"
|
|
2134
2145
|
},
|
|
2135
|
-
/* @__PURE__ */
|
|
2146
|
+
/* @__PURE__ */ React28.createElement(HugeiconsIcon14, { icon: Delete01Icon, size: 14 }),
|
|
2136
2147
|
" Remove Member"
|
|
2137
|
-
)))), 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(
|
|
2138
2149
|
TextInput,
|
|
2139
2150
|
{
|
|
2140
2151
|
label: "Email Address",
|
|
@@ -2143,7 +2154,7 @@ var UniversalMembersPage = ({
|
|
|
2143
2154
|
disabled: isInviting,
|
|
2144
2155
|
placeholder: "developer@acme.com"
|
|
2145
2156
|
}
|
|
2146
|
-
), requireNamesForInvite && /* @__PURE__ */
|
|
2157
|
+
), requireNamesForInvite && /* @__PURE__ */ React28.createElement("div", { className: "flex flex-col sm:flex-row gap-6" }, /* @__PURE__ */ React28.createElement(
|
|
2147
2158
|
TextInput,
|
|
2148
2159
|
{
|
|
2149
2160
|
label: "First Name",
|
|
@@ -2152,7 +2163,7 @@ var UniversalMembersPage = ({
|
|
|
2152
2163
|
disabled: isInviting,
|
|
2153
2164
|
placeholder: "Jane"
|
|
2154
2165
|
}
|
|
2155
|
-
), /* @__PURE__ */
|
|
2166
|
+
), /* @__PURE__ */ React28.createElement(
|
|
2156
2167
|
TextInput,
|
|
2157
2168
|
{
|
|
2158
2169
|
label: "Last Name",
|
|
@@ -2161,7 +2172,7 @@ var UniversalMembersPage = ({
|
|
|
2161
2172
|
disabled: isInviting,
|
|
2162
2173
|
placeholder: "Doe"
|
|
2163
2174
|
}
|
|
2164
|
-
)), /* @__PURE__ */
|
|
2175
|
+
)), /* @__PURE__ */ React28.createElement("div", { className: "pt-8 mt-2" }, /* @__PURE__ */ React28.createElement(
|
|
2165
2176
|
ThreeDActionButton,
|
|
2166
2177
|
{
|
|
2167
2178
|
type: "submit",
|
|
@@ -2170,7 +2181,7 @@ var UniversalMembersPage = ({
|
|
|
2170
2181
|
className: "min-w-40"
|
|
2171
2182
|
},
|
|
2172
2183
|
"Send Invitation"
|
|
2173
|
-
)))), 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(
|
|
2174
2185
|
"button",
|
|
2175
2186
|
{
|
|
2176
2187
|
key: roleOption,
|
|
@@ -2178,9 +2189,9 @@ var UniversalMembersPage = ({
|
|
|
2178
2189
|
disabled: isUpdatingRole,
|
|
2179
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"}`
|
|
2180
2191
|
},
|
|
2181
|
-
/* @__PURE__ */
|
|
2182
|
-
selectedMember?.role === roleOption && /* @__PURE__ */
|
|
2183
|
-
))), /* @__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(
|
|
2184
2195
|
"button",
|
|
2185
2196
|
{
|
|
2186
2197
|
onClick: () => setIsRoleModalOpen(false),
|
|
@@ -2188,11 +2199,11 @@ var UniversalMembersPage = ({
|
|
|
2188
2199
|
className: "w-full py-2.5 text-[13px] text-neutral-600 hover:bg-neutral-50 transition-colors disabled:opacity-50 outline-none"
|
|
2189
2200
|
},
|
|
2190
2201
|
"Cancel"
|
|
2191
|
-
)))), 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")))));
|
|
2192
2203
|
};
|
|
2193
2204
|
|
|
2194
2205
|
// src/components/UniversalProfileSettings.tsx
|
|
2195
|
-
import
|
|
2206
|
+
import React29, { useState as useState13, useEffect as useEffect10 } from "react";
|
|
2196
2207
|
import toast5 from "react-hot-toast";
|
|
2197
2208
|
var UniversalProfileSettings = ({
|
|
2198
2209
|
initialFirstName,
|
|
@@ -2203,9 +2214,9 @@ var UniversalProfileSettings = ({
|
|
|
2203
2214
|
isReadOnly = false,
|
|
2204
2215
|
onSaveProfile
|
|
2205
2216
|
}) => {
|
|
2206
|
-
const [firstName, setFirstName] =
|
|
2207
|
-
const [lastName, setLastName] =
|
|
2208
|
-
const [isSubmitting, setIsSubmitting] =
|
|
2217
|
+
const [firstName, setFirstName] = useState13(initialFirstName);
|
|
2218
|
+
const [lastName, setLastName] = useState13(initialLastName);
|
|
2219
|
+
const [isSubmitting, setIsSubmitting] = useState13(false);
|
|
2209
2220
|
useEffect10(() => {
|
|
2210
2221
|
setFirstName(initialFirstName || "");
|
|
2211
2222
|
setLastName(initialLastName || "");
|
|
@@ -2236,7 +2247,7 @@ var UniversalProfileSettings = ({
|
|
|
2236
2247
|
};
|
|
2237
2248
|
const hasChanges = firstName !== initialFirstName || lastName !== initialLastName;
|
|
2238
2249
|
const isSaveDisabled = isSubmitting || isReadOnly || !hasChanges || firstName.trim().length === 0 || lastName.trim().length === 0;
|
|
2239
|
-
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(
|
|
2240
2251
|
TextInput,
|
|
2241
2252
|
{
|
|
2242
2253
|
label: "First Name",
|
|
@@ -2245,7 +2256,7 @@ var UniversalProfileSettings = ({
|
|
|
2245
2256
|
disabled: isReadOnly || isSubmitting,
|
|
2246
2257
|
placeholder: "System"
|
|
2247
2258
|
}
|
|
2248
|
-
)), /* @__PURE__ */
|
|
2259
|
+
)), /* @__PURE__ */ React29.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ React29.createElement(
|
|
2249
2260
|
TextInput,
|
|
2250
2261
|
{
|
|
2251
2262
|
label: "Last Name",
|
|
@@ -2254,7 +2265,7 @@ var UniversalProfileSettings = ({
|
|
|
2254
2265
|
disabled: isReadOnly || isSubmitting,
|
|
2255
2266
|
placeholder: "Admin"
|
|
2256
2267
|
}
|
|
2257
|
-
))), /* @__PURE__ */
|
|
2268
|
+
))), /* @__PURE__ */ React29.createElement("div", { className: "space-y-2 min-w-0" }, /* @__PURE__ */ React29.createElement(
|
|
2258
2269
|
TextInput,
|
|
2259
2270
|
{
|
|
2260
2271
|
label: "Email ID",
|
|
@@ -2263,7 +2274,7 @@ var UniversalProfileSettings = ({
|
|
|
2263
2274
|
},
|
|
2264
2275
|
disabled: true
|
|
2265
2276
|
}
|
|
2266
|
-
), /* @__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(
|
|
2267
2278
|
"button",
|
|
2268
2279
|
{
|
|
2269
2280
|
type: "button",
|
|
@@ -2274,7 +2285,7 @@ var UniversalProfileSettings = ({
|
|
|
2274
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"
|
|
2275
2286
|
},
|
|
2276
2287
|
"Cancel"
|
|
2277
|
-
), /* @__PURE__ */
|
|
2288
|
+
), /* @__PURE__ */ React29.createElement(
|
|
2278
2289
|
ThreeDActionButton,
|
|
2279
2290
|
{
|
|
2280
2291
|
type: "submit",
|
|
@@ -2287,16 +2298,16 @@ var UniversalProfileSettings = ({
|
|
|
2287
2298
|
};
|
|
2288
2299
|
|
|
2289
2300
|
// src/components/UniversalBillingPage.tsx
|
|
2290
|
-
import
|
|
2291
|
-
import { HugeiconsIcon as
|
|
2301
|
+
import React30, { useState as useState14 } from "react";
|
|
2302
|
+
import { HugeiconsIcon as HugeiconsIcon15 } from "@hugeicons/react";
|
|
2292
2303
|
import {
|
|
2293
2304
|
ArrowLeft01Icon as ArrowLeft01Icon4,
|
|
2294
2305
|
ArrowRight01Icon as ArrowRight01Icon4,
|
|
2295
2306
|
Loading03Icon as Loading03Icon7,
|
|
2296
2307
|
ArrowDown01Icon as ArrowDown01Icon3
|
|
2297
2308
|
} from "@hugeicons/core-free-icons";
|
|
2298
|
-
var PageSpinner3 = () => /* @__PURE__ */
|
|
2299
|
-
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" });
|
|
2300
2311
|
var formatDate = (dateString) => {
|
|
2301
2312
|
if (!dateString) return "N/A";
|
|
2302
2313
|
return new Date(dateString).toLocaleDateString("en-US", {
|
|
@@ -2338,13 +2349,13 @@ var UniversalBillingPage = ({
|
|
|
2338
2349
|
onPayInvoice,
|
|
2339
2350
|
onUpdateInvoiceStatus
|
|
2340
2351
|
}) => {
|
|
2341
|
-
const [currentView, setCurrentView] =
|
|
2342
|
-
const [selectedInvoice, setSelectedInvoice] =
|
|
2343
|
-
const [isTimeframeModalOpen, setIsTimeframeModalOpen] =
|
|
2344
|
-
const [isPaying, setIsPaying] =
|
|
2345
|
-
const [isActionModalOpen, setIsActionModalOpen] =
|
|
2346
|
-
const [isUpdating, setIsUpdating] =
|
|
2347
|
-
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("");
|
|
2348
2359
|
const handlePayment = async () => {
|
|
2349
2360
|
if (!selectedInvoice || isReadOnly || !onPayInvoice || isPaying) return;
|
|
2350
2361
|
setIsPaying(true);
|
|
@@ -2371,14 +2382,14 @@ var UniversalBillingPage = ({
|
|
|
2371
2382
|
setIsUpdating(false);
|
|
2372
2383
|
}
|
|
2373
2384
|
};
|
|
2374
|
-
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(
|
|
2375
2386
|
TextInput,
|
|
2376
2387
|
{
|
|
2377
2388
|
placeholder: "Search by ID or Name...",
|
|
2378
2389
|
value: searchQuery,
|
|
2379
2390
|
onChange: onSearchChange
|
|
2380
2391
|
}
|
|
2381
|
-
), /* @__PURE__ */
|
|
2392
|
+
), /* @__PURE__ */ React30.createElement(
|
|
2382
2393
|
"button",
|
|
2383
2394
|
{
|
|
2384
2395
|
type: "button",
|
|
@@ -2386,10 +2397,10 @@ var UniversalBillingPage = ({
|
|
|
2386
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"
|
|
2387
2398
|
},
|
|
2388
2399
|
timeframe === "ALL" ? "All Time" : timeframe === "24H" ? "Past 24 Hours" : timeframe === "7D" ? "Past 7 Days" : "Past 30 Days"
|
|
2389
|
-
))) : /* @__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: () => {
|
|
2390
2401
|
setSelectedInvoice(inv);
|
|
2391
2402
|
setCurrentView("details");
|
|
2392
|
-
}, 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(
|
|
2393
2404
|
"button",
|
|
2394
2405
|
{
|
|
2395
2406
|
onClick: () => !isUpdating && setIsActionModalOpen(true),
|
|
@@ -2397,8 +2408,8 @@ var UniversalBillingPage = ({
|
|
|
2397
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"}`
|
|
2398
2409
|
},
|
|
2399
2410
|
selectedInvoice.status,
|
|
2400
|
-
isUpdating ? /* @__PURE__ */
|
|
2401
|
-
) : /* @__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(
|
|
2402
2413
|
ThreeDActionButton,
|
|
2403
2414
|
{
|
|
2404
2415
|
onClick: handlePayment,
|
|
@@ -2407,12 +2418,12 @@ var UniversalBillingPage = ({
|
|
|
2407
2418
|
className: "w-full sm:w-auto"
|
|
2408
2419
|
},
|
|
2409
2420
|
"Pay Invoice"
|
|
2410
|
-
)), !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" }, [
|
|
2411
2422
|
{ value: "ALL", label: "All Time" },
|
|
2412
2423
|
{ value: "24H", label: "Past 24 Hours" },
|
|
2413
2424
|
{ value: "7D", label: "Past 7 Days" },
|
|
2414
2425
|
{ value: "30D", label: "Past 30 Days" }
|
|
2415
|
-
].map((option) => /* @__PURE__ */
|
|
2426
|
+
].map((option) => /* @__PURE__ */ React30.createElement(
|
|
2416
2427
|
"button",
|
|
2417
2428
|
{
|
|
2418
2429
|
key: option.value,
|
|
@@ -2423,9 +2434,9 @@ var UniversalBillingPage = ({
|
|
|
2423
2434
|
},
|
|
2424
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"}`
|
|
2425
2436
|
},
|
|
2426
|
-
/* @__PURE__ */
|
|
2427
|
-
timeframe === option.value && /* @__PURE__ */
|
|
2428
|
-
))), /* @__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(
|
|
2429
2440
|
TextInput,
|
|
2430
2441
|
{
|
|
2431
2442
|
placeholder: "Enter 2FA Code...",
|
|
@@ -2433,7 +2444,7 @@ var UniversalBillingPage = ({
|
|
|
2433
2444
|
onChange: setTwoFactorCode,
|
|
2434
2445
|
type: "password"
|
|
2435
2446
|
}
|
|
2436
|
-
)), /* @__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(
|
|
2437
2448
|
"button",
|
|
2438
2449
|
{
|
|
2439
2450
|
key: statusOption,
|
|
@@ -2441,14 +2452,14 @@ var UniversalBillingPage = ({
|
|
|
2441
2452
|
disabled: isUpdating || !twoFactorCode,
|
|
2442
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"}`
|
|
2443
2454
|
},
|
|
2444
|
-
/* @__PURE__ */
|
|
2445
|
-
selectedInvoice?.status === statusOption && /* @__PURE__ */
|
|
2446
|
-
))), /* @__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")))));
|
|
2447
2458
|
};
|
|
2448
2459
|
|
|
2449
2460
|
// src/components/UniversalDashboardPage.tsx
|
|
2450
|
-
import
|
|
2451
|
-
import { HugeiconsIcon as
|
|
2461
|
+
import React31, { useState as useState15 } from "react";
|
|
2462
|
+
import { HugeiconsIcon as HugeiconsIcon16 } from "@hugeicons/react";
|
|
2452
2463
|
import { ArrowDown01Icon as ArrowDown01Icon4, Loading03Icon as Loading03Icon8 } from "@hugeicons/core-free-icons";
|
|
2453
2464
|
var UniversalDashboardPage = ({
|
|
2454
2465
|
headerTitle,
|
|
@@ -2460,20 +2471,20 @@ var UniversalDashboardPage = ({
|
|
|
2460
2471
|
lists,
|
|
2461
2472
|
isLoading = false
|
|
2462
2473
|
}) => {
|
|
2463
|
-
const [isTimeframeModalOpen, setIsTimeframeModalOpen] =
|
|
2474
|
+
const [isTimeframeModalOpen, setIsTimeframeModalOpen] = useState15(false);
|
|
2464
2475
|
const selectedTimeframe = timeframes.find((t) => t.id === activeTimeframe) || timeframes[0];
|
|
2465
2476
|
if (isLoading) {
|
|
2466
|
-
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" }));
|
|
2467
2478
|
}
|
|
2468
|
-
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(
|
|
2469
2480
|
"button",
|
|
2470
2481
|
{
|
|
2471
2482
|
onClick: () => setIsTimeframeModalOpen(true),
|
|
2472
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"
|
|
2473
2484
|
},
|
|
2474
|
-
/* @__PURE__ */
|
|
2475
|
-
/* @__PURE__ */
|
|
2476
|
-
)), 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(
|
|
2477
2488
|
"button",
|
|
2478
2489
|
{
|
|
2479
2490
|
key: tf.id,
|
|
@@ -2483,9 +2494,9 @@ var UniversalDashboardPage = ({
|
|
|
2483
2494
|
},
|
|
2484
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"}`
|
|
2485
2496
|
},
|
|
2486
|
-
/* @__PURE__ */
|
|
2487
|
-
activeTimeframe === tf.id && /* @__PURE__ */
|
|
2488
|
-
))), /* @__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(
|
|
2489
2500
|
"button",
|
|
2490
2501
|
{
|
|
2491
2502
|
onClick: () => setIsTimeframeModalOpen(false),
|
|
@@ -2496,8 +2507,8 @@ var UniversalDashboardPage = ({
|
|
|
2496
2507
|
};
|
|
2497
2508
|
|
|
2498
2509
|
// src/components/UniversalAgentConsole.tsx
|
|
2499
|
-
import
|
|
2500
|
-
import { HugeiconsIcon as
|
|
2510
|
+
import React32, { useState as useState16, useRef as useRef5 } from "react";
|
|
2511
|
+
import { HugeiconsIcon as HugeiconsIcon17 } from "@hugeicons/react";
|
|
2501
2512
|
import {
|
|
2502
2513
|
ArrowLeft01Icon as ArrowLeft01Icon5,
|
|
2503
2514
|
ArrowRight01Icon as ArrowRight01Icon5,
|
|
@@ -2539,12 +2550,12 @@ var UniversalAgentConsole = ({
|
|
|
2539
2550
|
onDeleteArchive
|
|
2540
2551
|
}) => {
|
|
2541
2552
|
const archiveRef = useRef5(null);
|
|
2542
|
-
const [pendingFiles, setPendingFiles] =
|
|
2543
|
-
const [isUploading, setIsUploading] =
|
|
2544
|
-
const [isActioning, setIsActioning] =
|
|
2545
|
-
const [actionModal, setActionModal] =
|
|
2546
|
-
const [actionMessage, setActionMessage] =
|
|
2547
|
-
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);
|
|
2548
2559
|
const handleFileSelect = (e) => {
|
|
2549
2560
|
if (e.target.files && e.target.files.length > 0) {
|
|
2550
2561
|
setPendingFiles((prev) => [...prev, ...Array.from(e.target.files)]);
|
|
@@ -2573,36 +2584,36 @@ var UniversalAgentConsole = ({
|
|
|
2573
2584
|
}
|
|
2574
2585
|
};
|
|
2575
2586
|
const DynamicArrayAccordion = ({ items, parentKey }) => {
|
|
2576
|
-
const [activeFAQ, setActiveFAQ] =
|
|
2577
|
-
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) => {
|
|
2578
2589
|
const isOpen = activeFAQ === index;
|
|
2579
2590
|
let label = `${parentKey ? formatKeyName(parentKey) : "Item"} ${index + 1}`;
|
|
2580
2591
|
if (item.fullName) label = toTitleCaseSafe(item.fullName);
|
|
2581
2592
|
else if (item.role) label = item.role;
|
|
2582
2593
|
else if (item.proposedName) label = toTitleCaseSafe(item.proposedName);
|
|
2583
|
-
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)))));
|
|
2584
2595
|
}));
|
|
2585
2596
|
};
|
|
2586
2597
|
const renderValue = (key, value) => {
|
|
2587
2598
|
if (value === null || value === void 0 || value === "") return null;
|
|
2588
2599
|
if (typeof value === "string") {
|
|
2589
|
-
if (value.startsWith("http") || value.startsWith("data:image")) return /* @__PURE__ */
|
|
2590
|
-
if (key.toLowerCase().includes("name") && !value.includes("@")) return /* @__PURE__ */
|
|
2591
|
-
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);
|
|
2592
2603
|
}
|
|
2593
2604
|
if (Array.isArray(value)) {
|
|
2594
2605
|
const validItems = value.filter((item) => item !== null && item !== void 0 && item !== "");
|
|
2595
2606
|
if (validItems.length === 0) return null;
|
|
2596
|
-
if (typeof validItems[0] === "string") return /* @__PURE__ */
|
|
2597
|
-
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 });
|
|
2598
2609
|
}
|
|
2599
2610
|
if (typeof value === "object") {
|
|
2600
2611
|
if (Object.keys(value).length === 0) return null;
|
|
2601
2612
|
const renderedObj = renderDynamicObject(value);
|
|
2602
2613
|
if (!renderedObj || Array.isArray(renderedObj) && renderedObj.length === 0) return null;
|
|
2603
|
-
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);
|
|
2604
2615
|
}
|
|
2605
|
-
return /* @__PURE__ */
|
|
2616
|
+
return /* @__PURE__ */ React32.createElement("span", { className: "text-sm text-black" }, String(value));
|
|
2606
2617
|
};
|
|
2607
2618
|
const renderDynamicObject = (obj) => {
|
|
2608
2619
|
if (!obj) return null;
|
|
@@ -2613,22 +2624,22 @@ var UniversalAgentConsole = ({
|
|
|
2613
2624
|
return true;
|
|
2614
2625
|
});
|
|
2615
2626
|
if (entries.length === 0) return null;
|
|
2616
|
-
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)));
|
|
2617
2628
|
};
|
|
2618
|
-
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: () => {
|
|
2619
2630
|
onBackToList();
|
|
2620
2631
|
setPendingFiles([]);
|
|
2621
|
-
}, 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 () => {
|
|
2622
2633
|
setIsActioning(true);
|
|
2623
2634
|
await onAcceptApplication(selectedApp.id);
|
|
2624
2635
|
setIsActioning(false);
|
|
2625
|
-
}, 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 () => {
|
|
2626
2637
|
setIsActioning(true);
|
|
2627
2638
|
await onUpdateStatus(selectedApp.id, actionModal === "success" ? "COMPLETED" : actionModal === "reject" ? "REJECTED" : "QUEUED", actionMessage);
|
|
2628
2639
|
setIsActioning(false);
|
|
2629
2640
|
setActionModal(null);
|
|
2630
2641
|
setActionMessage("");
|
|
2631
|
-
}, 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 () => {
|
|
2632
2643
|
setIsActioning(true);
|
|
2633
2644
|
await onDeleteArchive(selectedApp.id, archiveToDelete.id);
|
|
2634
2645
|
setIsActioning(false);
|
|
@@ -2637,7 +2648,7 @@ var UniversalAgentConsole = ({
|
|
|
2637
2648
|
};
|
|
2638
2649
|
|
|
2639
2650
|
// src/components/UniversalOverviewPage.tsx
|
|
2640
|
-
import
|
|
2651
|
+
import React33 from "react";
|
|
2641
2652
|
var UniversalOverviewPage = ({
|
|
2642
2653
|
headerTitle,
|
|
2643
2654
|
headerDescription,
|
|
@@ -2647,7 +2658,7 @@ var UniversalOverviewPage = ({
|
|
|
2647
2658
|
primaryAction,
|
|
2648
2659
|
alerts = []
|
|
2649
2660
|
}) => {
|
|
2650
|
-
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(
|
|
2651
2662
|
ThreeDButton,
|
|
2652
2663
|
{
|
|
2653
2664
|
href: primaryAction.href,
|
|
@@ -2656,7 +2667,7 @@ var UniversalOverviewPage = ({
|
|
|
2656
2667
|
},
|
|
2657
2668
|
primaryAction.label,
|
|
2658
2669
|
primaryAction.icon
|
|
2659
|
-
) : /* @__PURE__ */
|
|
2670
|
+
) : /* @__PURE__ */ React33.createElement(
|
|
2660
2671
|
ThreeDActionButton,
|
|
2661
2672
|
{
|
|
2662
2673
|
onClick: primaryAction.onClick,
|
|
@@ -2665,18 +2676,18 @@ var UniversalOverviewPage = ({
|
|
|
2665
2676
|
},
|
|
2666
2677
|
primaryAction.label,
|
|
2667
2678
|
primaryAction.icon
|
|
2668
|
-
))), /* @__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) => {
|
|
2669
2680
|
const bgClass = alert.type === "warning" ? "bg-amber-50/50" : alert.type === "info" ? "bg-blue-50/50" : "bg-red-50/50";
|
|
2670
2681
|
const textClass = alert.type === "warning" ? "text-amber-600" : alert.type === "info" ? "text-blue-600" : "text-red-600";
|
|
2671
2682
|
const valClass = alert.type === "warning" ? "text-amber-700" : alert.type === "info" ? "text-blue-700" : "text-red-700";
|
|
2672
2683
|
const lblClass = alert.type === "warning" ? "text-amber-400" : alert.type === "info" ? "text-blue-400" : "text-red-400";
|
|
2673
|
-
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))));
|
|
2674
2685
|
}))));
|
|
2675
2686
|
};
|
|
2676
2687
|
|
|
2677
2688
|
// src/components/UniversalErrorView.tsx
|
|
2678
|
-
import
|
|
2679
|
-
import { HugeiconsIcon as
|
|
2689
|
+
import React34 from "react";
|
|
2690
|
+
import { HugeiconsIcon as HugeiconsIcon18 } from "@hugeicons/react";
|
|
2680
2691
|
import { ConfusedIcon } from "@hugeicons/core-free-icons";
|
|
2681
2692
|
var UniversalErrorView = ({
|
|
2682
2693
|
isBooting,
|
|
@@ -2689,7 +2700,7 @@ var UniversalErrorView = ({
|
|
|
2689
2700
|
returnLabel = "Return to Workspace"
|
|
2690
2701
|
}) => {
|
|
2691
2702
|
if (isBooting || isLoading && !activeData) {
|
|
2692
|
-
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));
|
|
2693
2704
|
}
|
|
2694
2705
|
if (!isLoading && (!activeData || activeError)) {
|
|
2695
2706
|
const errorString = typeof activeError === "string" ? activeError : JSON.stringify(activeError || "");
|
|
@@ -2708,7 +2719,7 @@ var UniversalErrorView = ({
|
|
|
2708
2719
|
title = "Access Restricted";
|
|
2709
2720
|
description = apiMessage || `You have insufficient permissions to view this ${envName}. Please contact your administrator.`;
|
|
2710
2721
|
}
|
|
2711
|
-
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(
|
|
2712
2723
|
"button",
|
|
2713
2724
|
{
|
|
2714
2725
|
onClick: () => window.location.href = returnUrl,
|
|
@@ -2717,14 +2728,14 @@ var UniversalErrorView = ({
|
|
|
2717
2728
|
returnLabel
|
|
2718
2729
|
) : (
|
|
2719
2730
|
// Soft errors (Network timeouts) allow them to retry or optionally retreat
|
|
2720
|
-
/* @__PURE__ */
|
|
2731
|
+
/* @__PURE__ */ React34.createElement(React34.Fragment, null, envName.toLowerCase().includes("application") && /* @__PURE__ */ React34.createElement(
|
|
2721
2732
|
"button",
|
|
2722
2733
|
{
|
|
2723
2734
|
onClick: () => window.location.href = returnUrl,
|
|
2724
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"
|
|
2725
2736
|
},
|
|
2726
2737
|
"Back Home"
|
|
2727
|
-
), /* @__PURE__ */
|
|
2738
|
+
), /* @__PURE__ */ React34.createElement(
|
|
2728
2739
|
"button",
|
|
2729
2740
|
{
|
|
2730
2741
|
onClick: onRetry,
|
|
@@ -2739,8 +2750,8 @@ var UniversalErrorView = ({
|
|
|
2739
2750
|
};
|
|
2740
2751
|
|
|
2741
2752
|
// src/components/UniversalLookupPage.tsx
|
|
2742
|
-
import
|
|
2743
|
-
import { HugeiconsIcon as
|
|
2753
|
+
import React35, { useState as useState17 } from "react";
|
|
2754
|
+
import { HugeiconsIcon as HugeiconsIcon19 } from "@hugeicons/react";
|
|
2744
2755
|
import { Search01Icon } from "@hugeicons/core-free-icons";
|
|
2745
2756
|
var UniversalLookupPage = ({
|
|
2746
2757
|
headerTitle,
|
|
@@ -2755,9 +2766,9 @@ var UniversalLookupPage = ({
|
|
|
2755
2766
|
resultContent,
|
|
2756
2767
|
modals
|
|
2757
2768
|
}) => {
|
|
2758
|
-
const [isTypeModalOpen, setIsTypeModalOpen] =
|
|
2769
|
+
const [isTypeModalOpen, setIsTypeModalOpen] = useState17(false);
|
|
2759
2770
|
const currentOptionLabel = searchOptions.find((opt) => opt.value === selectedSearchType)?.label || "Select Type";
|
|
2760
|
-
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(
|
|
2761
2772
|
"button",
|
|
2762
2773
|
{
|
|
2763
2774
|
type: "button",
|
|
@@ -2765,7 +2776,7 @@ var UniversalLookupPage = ({
|
|
|
2765
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"
|
|
2766
2777
|
},
|
|
2767
2778
|
currentOptionLabel
|
|
2768
|
-
), /* @__PURE__ */
|
|
2779
|
+
), /* @__PURE__ */ React35.createElement("div", { className: "flex-1" }, /* @__PURE__ */ React35.createElement(
|
|
2769
2780
|
TextInput,
|
|
2770
2781
|
{
|
|
2771
2782
|
placeholder: "Enter Exact ID, Email, or Slug...",
|
|
@@ -2773,7 +2784,7 @@ var UniversalLookupPage = ({
|
|
|
2773
2784
|
onChange: onSearchQueryChange,
|
|
2774
2785
|
disabled: isSearching
|
|
2775
2786
|
}
|
|
2776
|
-
))), /* @__PURE__ */
|
|
2787
|
+
))), /* @__PURE__ */ React35.createElement("div", { className: "flex justify-end" }, /* @__PURE__ */ React35.createElement(
|
|
2777
2788
|
ThreeDActionButton,
|
|
2778
2789
|
{
|
|
2779
2790
|
type: "submit",
|
|
@@ -2781,9 +2792,9 @@ var UniversalLookupPage = ({
|
|
|
2781
2792
|
isLoading: isSearching,
|
|
2782
2793
|
className: "min-w-32"
|
|
2783
2794
|
},
|
|
2784
|
-
/* @__PURE__ */
|
|
2795
|
+
/* @__PURE__ */ React35.createElement(HugeiconsIcon19, { icon: Search01Icon, size: 14, className: "mr-2" }),
|
|
2785
2796
|
" Lookup"
|
|
2786
|
-
)))), 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(
|
|
2787
2798
|
"button",
|
|
2788
2799
|
{
|
|
2789
2800
|
key: option.value,
|
|
@@ -2794,16 +2805,16 @@ var UniversalLookupPage = ({
|
|
|
2794
2805
|
},
|
|
2795
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"}`
|
|
2796
2807
|
},
|
|
2797
|
-
/* @__PURE__ */
|
|
2798
|
-
selectedSearchType === option.value && /* @__PURE__ */
|
|
2799
|
-
))), /* @__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);
|
|
2800
2811
|
};
|
|
2801
2812
|
|
|
2802
2813
|
// src/components/UniversalDirectoryPage.tsx
|
|
2803
|
-
import
|
|
2804
|
-
import { HugeiconsIcon as
|
|
2814
|
+
import React36 from "react";
|
|
2815
|
+
import { HugeiconsIcon as HugeiconsIcon20 } from "@hugeicons/react";
|
|
2805
2816
|
import { ArrowLeft01Icon as ArrowLeft01Icon6, ArrowRight01Icon as ArrowRight01Icon6, Loading03Icon as Loading03Icon10 } from "@hugeicons/core-free-icons";
|
|
2806
|
-
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" }));
|
|
2807
2818
|
var UniversalDirectoryPage = ({
|
|
2808
2819
|
headerTitle,
|
|
2809
2820
|
headerDescription,
|
|
@@ -2825,33 +2836,33 @@ var UniversalDirectoryPage = ({
|
|
|
2825
2836
|
detailsContent,
|
|
2826
2837
|
modals
|
|
2827
2838
|
}) => {
|
|
2828
|
-
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(
|
|
2829
2840
|
TextInput,
|
|
2830
2841
|
{
|
|
2831
2842
|
placeholder: searchPlaceholder,
|
|
2832
2843
|
value: searchQuery,
|
|
2833
2844
|
onChange: onSearchChange
|
|
2834
2845
|
}
|
|
2835
|
-
)), 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(
|
|
2836
2847
|
"div",
|
|
2837
2848
|
{
|
|
2838
2849
|
key: item.id,
|
|
2839
2850
|
onClick: () => onRowClick(item.id),
|
|
2840
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"
|
|
2841
2852
|
},
|
|
2842
|
-
/* @__PURE__ */
|
|
2843
|
-
item.rightBadge && /* @__PURE__ */
|
|
2844
|
-
))), 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);
|
|
2845
2856
|
};
|
|
2846
2857
|
|
|
2847
2858
|
// src/components/AiApproveDecline.tsx
|
|
2848
|
-
import
|
|
2849
|
-
import { HugeiconsIcon as
|
|
2859
|
+
import React37, { useState as useState18 } from "react";
|
|
2860
|
+
import { HugeiconsIcon as HugeiconsIcon21 } from "@hugeicons/react";
|
|
2850
2861
|
import { CheckmarkCircle01Icon as CheckmarkCircle01Icon2, CancelCircleIcon as CancelCircleIcon2, PencilEdit01Icon } from "@hugeicons/core-free-icons";
|
|
2851
2862
|
var AiApproveDecline = ({ suggestionTitle, suggestionValue, onApprove, onDecline, onEdit }) => {
|
|
2852
|
-
const [isEditing, setIsEditing] =
|
|
2853
|
-
const [editVal, setEditVal] =
|
|
2854
|
-
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(
|
|
2855
2866
|
"input",
|
|
2856
2867
|
{
|
|
2857
2868
|
type: "text",
|
|
@@ -2860,23 +2871,23 @@ var AiApproveDecline = ({ suggestionTitle, suggestionValue, onApprove, onDecline
|
|
|
2860
2871
|
className: "w-full text-sm p-2 border-b border-purple-200 bg-transparent outline-none focus:border-purple-400 transition-colors",
|
|
2861
2872
|
autoFocus: true
|
|
2862
2873
|
}
|
|
2863
|
-
)), /* @__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: () => {
|
|
2864
2875
|
onEdit?.(editVal);
|
|
2865
2876
|
setIsEditing(false);
|
|
2866
|
-
}, 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 })))));
|
|
2867
2878
|
};
|
|
2868
2879
|
|
|
2869
2880
|
// src/components/AiStageCheck.tsx
|
|
2870
|
-
import
|
|
2871
|
-
import { HugeiconsIcon as
|
|
2881
|
+
import React38 from "react";
|
|
2882
|
+
import { HugeiconsIcon as HugeiconsIcon22 } from "@hugeicons/react";
|
|
2872
2883
|
import { Loading03Icon as Loading03Icon11, CheckmarkCircle02Icon, CancelCircleIcon as CancelCircleIcon3 } from "@hugeicons/core-free-icons";
|
|
2873
2884
|
var AiStageCheck = ({ tasks }) => {
|
|
2874
|
-
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))));
|
|
2875
2886
|
};
|
|
2876
2887
|
|
|
2877
2888
|
// src/components/Stagger.tsx
|
|
2878
|
-
import
|
|
2879
|
-
import { HugeiconsIcon as
|
|
2889
|
+
import React39 from "react";
|
|
2890
|
+
import { HugeiconsIcon as HugeiconsIcon23 } from "@hugeicons/react";
|
|
2880
2891
|
import { Briefcase02Icon, Upload01Icon as Upload01Icon2, FileSyncIcon, CloudUploadIcon } from "@hugeicons/core-free-icons";
|
|
2881
2892
|
var Stagger = ({ steps, currentStep }) => {
|
|
2882
2893
|
const getIconForStep = (stepName) => {
|
|
@@ -2886,18 +2897,18 @@ var Stagger = ({ steps, currentStep }) => {
|
|
|
2886
2897
|
if (lowerName.includes("submit")) return CloudUploadIcon;
|
|
2887
2898
|
return Briefcase02Icon;
|
|
2888
2899
|
};
|
|
2889
|
-
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) => {
|
|
2890
2901
|
const isActive = idx === currentStep;
|
|
2891
2902
|
const isPassed = idx < currentStep;
|
|
2892
2903
|
const colorClass = isPassed ? "bg-emerald-500 text-white" : isActive ? "bg-neutral-200 text-neutral-500" : "bg-neutral-200 text-neutral-500";
|
|
2893
|
-
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 }));
|
|
2894
2905
|
}));
|
|
2895
2906
|
};
|
|
2896
2907
|
|
|
2897
2908
|
// src/components/UniversalRegistrationFlow.tsx
|
|
2898
|
-
import
|
|
2909
|
+
import React40, { useState as useState19, useEffect as useEffect11, useRef as useRef6 } from "react";
|
|
2899
2910
|
import toast6 from "react-hot-toast";
|
|
2900
|
-
import { HugeiconsIcon as
|
|
2911
|
+
import { HugeiconsIcon as HugeiconsIcon24 } from "@hugeicons/react";
|
|
2901
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";
|
|
2902
2913
|
var MACRO_STEPS = ["Details", "Documents", "Review", "Submit"];
|
|
2903
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"];
|
|
@@ -2911,12 +2922,12 @@ var UniversalRegistrationFlow = ({
|
|
|
2911
2922
|
onRedirectToBilling,
|
|
2912
2923
|
onRedirectToApplication
|
|
2913
2924
|
}) => {
|
|
2914
|
-
const [isBooting, setIsBooting] =
|
|
2915
|
-
const [macroStep, setMacroStep] =
|
|
2916
|
-
const [appStatus, setAppStatus] =
|
|
2917
|
-
const [isAbortModalOpen, setIsAbortModalOpen] =
|
|
2918
|
-
const [isAborting, setIsAborting] =
|
|
2919
|
-
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({
|
|
2920
2931
|
natureApproved: false,
|
|
2921
2932
|
nameApproved: false,
|
|
2922
2933
|
addressApproved: false,
|
|
@@ -2933,7 +2944,7 @@ var UniversalRegistrationFlow = ({
|
|
|
2933
2944
|
const other1Ref = useRef6(null);
|
|
2934
2945
|
const other2Ref = useRef6(null);
|
|
2935
2946
|
const other3Ref = useRef6(null);
|
|
2936
|
-
const [formData, setFormData] =
|
|
2947
|
+
const [formData, setFormData] = useState19({
|
|
2937
2948
|
businessDesc: "",
|
|
2938
2949
|
natureOfBusiness: null,
|
|
2939
2950
|
proposedName: "",
|
|
@@ -2960,22 +2971,22 @@ var UniversalRegistrationFlow = ({
|
|
|
2960
2971
|
otherDoc3Url: "",
|
|
2961
2972
|
otherDoc3Meta: null
|
|
2962
2973
|
});
|
|
2963
|
-
const [activeModal, setActiveModal] =
|
|
2964
|
-
const [iAgree, setIAgree] =
|
|
2965
|
-
const [isAnalyzingNature, setIsAnalyzingNature] =
|
|
2966
|
-
const [suggestedNature, setSuggestedNature] =
|
|
2967
|
-
const [isCheckingQualifier, setIsCheckingQualifier] =
|
|
2968
|
-
const [qualifierCheckResult, setQualifierCheckResult] =
|
|
2969
|
-
const [isCheckingName, setIsCheckingName] =
|
|
2970
|
-
const [nameCheckResult, setNameCheckResult] =
|
|
2971
|
-
const [globalExtractingId, setGlobalExtractingId] =
|
|
2972
|
-
const [globalUploadingPassport, setGlobalUploadingPassport] =
|
|
2973
|
-
const [globalUploadingSignature, setGlobalUploadingSignature] =
|
|
2974
|
-
const [isUploadingOther1, setIsUploadingOther1] =
|
|
2975
|
-
const [isUploadingOther2, setIsUploadingOther2] =
|
|
2976
|
-
const [isUploadingOther3, setIsUploadingOther3] =
|
|
2977
|
-
const [aiTasks, setAiTasks] =
|
|
2978
|
-
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);
|
|
2979
2990
|
const isReadOnly = ["PENDING", "AWAITING_PAYMENT", "COMPLETED"].includes(appStatus);
|
|
2980
2991
|
const isAnyUploading = globalExtractingId || globalUploadingPassport || globalUploadingSignature || isUploadingOther1 || isUploadingOther2 || isUploadingOther3;
|
|
2981
2992
|
const baseApi = async (action, payload = {}) => {
|
|
@@ -3466,23 +3477,23 @@ var UniversalRegistrationFlow = ({
|
|
|
3466
3477
|
const isStep0Valid = type === "company" ? formState.natureApproved && formState.nameApproved && formState.addressApproved && formState.membersDetailsApproved : formState.natureApproved && formState.nameApproved && formState.addressApproved && formState.ownerApproved;
|
|
3467
3478
|
const isStep1Valid = type === "company" ? formState.membersDocsApproved : formState.idApproved && formState.passportApproved && formState.signatureApproved;
|
|
3468
3479
|
const titleText = type === "company" ? "Company Incorporation (LLC)" : "Business Name Registration";
|
|
3469
|
-
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" }));
|
|
3470
3481
|
if (!["DRAFT", "QUEUED", "REJECTED"].includes(appStatus) && appStatus !== "") {
|
|
3471
|
-
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")))));
|
|
3472
3483
|
}
|
|
3473
|
-
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: () => {
|
|
3474
3485
|
const newForm = { ...formData, natureOfBusiness: suggestedNature };
|
|
3475
3486
|
setFormData(newForm);
|
|
3476
3487
|
approveSection("natureApproved", newForm);
|
|
3477
|
-
}, 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: () => {
|
|
3478
3489
|
const newForm = { ...formData, approvedName: nameCheckResult.approvedOption };
|
|
3479
3490
|
setFormData(newForm);
|
|
3480
3491
|
approveSection("nameApproved", newForm);
|
|
3481
|
-
}, onDecline: () => setNameCheckResult(null) }) : /* @__PURE__ */
|
|
3482
|
-
}, disabled: isReadOnly || isSubmitting })), /* @__PURE__ */
|
|
3483
|
-
}, disabled: isReadOnly || isSubmitting }), member.role !== "Director Only" && /* @__PURE__ */
|
|
3484
|
-
}, disabled: isReadOnly || isSubmitting }), /* @__PURE__ */
|
|
3485
|
-
}, 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) => {
|
|
3486
3497
|
const docType = `other${num}`;
|
|
3487
3498
|
const ref = num === 1 ? other1Ref : num === 2 ? other2Ref : other3Ref;
|
|
3488
3499
|
const isUploading = num === 1 ? isUploadingOther1 : num === 2 ? isUploadingOther2 : isUploadingOther3;
|
|
@@ -3490,20 +3501,20 @@ var UniversalRegistrationFlow = ({
|
|
|
3490
3501
|
if (!fileUrl && !isUploading) {
|
|
3491
3502
|
const prevUrl = num > 1 ? formData[`otherDoc${num - 1}Url`] : true;
|
|
3492
3503
|
if (!prevUrl) return null;
|
|
3493
|
-
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);
|
|
3494
3505
|
}
|
|
3495
3506
|
if (isUploading) {
|
|
3496
|
-
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, "...");
|
|
3497
3508
|
}
|
|
3498
|
-
return /* @__PURE__ */
|
|
3499
|
-
}))), /* @__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) => {
|
|
3500
3511
|
const isSelected = activeModal.isGlobalState ? formData.state === opt : formData.members[activeModal.memberIndex][activeModal.type] === opt;
|
|
3501
|
-
return /* @__PURE__ */
|
|
3512
|
+
return /* @__PURE__ */ React40.createElement("button", { key: opt, onClick: () => {
|
|
3502
3513
|
if (activeModal.isGlobalState) setFormData({ ...formData, state: opt });
|
|
3503
3514
|
else updateCompanyMemberInfo(activeModal.memberIndex, activeModal.type, opt);
|
|
3504
3515
|
setActiveModal({ isOpen: false, type: null, memberIndex: null });
|
|
3505
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);
|
|
3506
|
-
})), /* @__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")))));
|
|
3507
3518
|
};
|
|
3508
3519
|
export {
|
|
3509
3520
|
AITranscriptionFeature,
|
|
@@ -3538,7 +3549,6 @@ export {
|
|
|
3538
3549
|
UniversalDashboardPage,
|
|
3539
3550
|
UniversalDirectoryPage,
|
|
3540
3551
|
UniversalErrorView,
|
|
3541
|
-
UniversalHeader,
|
|
3542
3552
|
UniversalIdentityPage,
|
|
3543
3553
|
UniversalLookupPage,
|
|
3544
3554
|
UniversalMembersPage,
|