@retinalabsllc/zairusjs 4.0.15 → 4.0.17
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.js +208 -196
- package/dist/index.mjs +206 -194
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -1644,7 +1644,7 @@ import {
|
|
|
1644
1644
|
} from "@hugeicons/core-free-icons";
|
|
1645
1645
|
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" }));
|
|
1646
1646
|
var ECOSYSTEM_APPS = [
|
|
1647
|
-
{ id: "desktop", name: "Retina", description: "Ai Document Editor", iconSrc: "https://retinalabs.company/assets/images/
|
|
1647
|
+
{ id: "desktop", name: "Retina", description: "Ai Document Editor", iconSrc: "https://retinalabs.company/assets/images/retina_.avif", url: "https://app.retinaapps.com/" },
|
|
1648
1648
|
{ id: "audditur", name: "Audditur", description: "AI Legal & Compliance", iconSrc: "https://retinalabs.company/assets/images/audditur.avif", url: "https://app.audditur.com/" }
|
|
1649
1649
|
];
|
|
1650
1650
|
var UniversalSidebar = ({
|
|
@@ -1740,9 +1740,9 @@ var UniversalSidebar = ({
|
|
|
1740
1740
|
{
|
|
1741
1741
|
src: currentAppConfig.iconSrc,
|
|
1742
1742
|
alt: currentAppConfig.name,
|
|
1743
|
-
className: "w-
|
|
1743
|
+
className: "w-7 h-7 rounded-md object-contain shrink-0"
|
|
1744
1744
|
}
|
|
1745
|
-
) : /* @__PURE__ */ React25.createElement("div", { className: " rounded-md shrink-0 flex items-center justify-center" }), (!isCollapsed || isMobileOpen) && /* @__PURE__ */ React25.createElement("div", { className: "flex flex-col justify-center min-w-0 pr-2 flex-1" }, /* @__PURE__ */ React25.createElement("span", { className: "text-[13px] text
|
|
1745
|
+
) : /* @__PURE__ */ React25.createElement("div", { className: " rounded-md shrink-0 flex items-center justify-center" }), (!isCollapsed || isMobileOpen) && /* @__PURE__ */ React25.createElement("div", { className: "flex flex-col justify-center min-w-0 pr-2 flex-1" }, /* @__PURE__ */ React25.createElement("span", { className: "text-[13px] gradient-text leading-none truncate tracking-wide mb-1" }, title), subtitle && /* @__PURE__ */ React25.createElement("span", { className: "text-[9px] text-neutral-500 truncate tracking-[0.2em] leading-none " }, subtitle))), /* @__PURE__ */ React25.createElement("div", { className: "md:hidden flex shrink-0" }, /* @__PURE__ */ React25.createElement(
|
|
1746
1746
|
"button",
|
|
1747
1747
|
{
|
|
1748
1748
|
onClick: closeMobile,
|
|
@@ -1964,7 +1964,7 @@ var UniversalOrganizationPage = ({
|
|
|
1964
1964
|
};
|
|
1965
1965
|
const hasChanges = orgName !== initialOrgName || slug !== initialSlug;
|
|
1966
1966
|
const isSaveDisabled = isSubmitting || isReadOnly || isCheckingSlug || !hasChanges || orgName.length < 3 || slug.length < 3 || slug !== initialSlug && slugAvailable === false;
|
|
1967
|
-
return /* @__PURE__ */ React26.createElement("div", { className: "flex flex-col gap-8 animate-in max-w-5xl 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: "
|
|
1967
|
+
return /* @__PURE__ */ React26.createElement("div", { className: "flex flex-col gap-8 animate-in max-w-5xl 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: " gradient-text text-xl 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: "p-2 w-9 h-9 bg-neutral-50 text-neutral-500 rounded-full " }, /* @__PURE__ */ React26.createElement(HugeiconsIcon13, { icon: CircleLock02Icon, size: 18, className: "text-current" }))), /* @__PURE__ */ React26.createElement("div", { className: "w-full max-w-5xl" }, /* @__PURE__ */ React26.createElement("form", { className: "flex flex-col gap-8", onSubmit: handleSave, autoComplete: "off" }, /* @__PURE__ */ React26.createElement(
|
|
1968
1968
|
TextInput,
|
|
1969
1969
|
{
|
|
1970
1970
|
label: "Organization Name",
|
|
@@ -2088,7 +2088,7 @@ var UniversalIdentityPage = ({
|
|
|
2088
2088
|
};
|
|
2089
2089
|
const hasChanges = primaryValue !== initialPrimaryValue || secondaryValue !== initialSecondaryValue;
|
|
2090
2090
|
const isSaveDisabled = isSubmitting || isReadOnly || !hasChanges || primaryValue.trim().length < 3;
|
|
2091
|
-
return /* @__PURE__ */ React27.createElement("div", { className: "flex flex-col gap-8 animate-in max-w-5xl 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: "
|
|
2091
|
+
return /* @__PURE__ */ React27.createElement("div", { className: "flex flex-col gap-8 animate-in max-w-5xl 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: " gradient-text text-xl mb-1 tracking-tight" }, headerTitle), /* @__PURE__ */ React27.createElement("p", { className: "text-xs text-neutral-500" }, headerDescription)), isReadOnly && /* @__PURE__ */ React27.createElement("span", { className: "p-2 w-9 h-9 bg-neutral-50 text-neutral-500 rounded-full " }, /* @__PURE__ */ React27.createElement(HugeiconsIcon14, { icon: CircleLock02Icon2, size: 18, className: "text-current" }))), /* @__PURE__ */ React27.createElement("div", { className: "w-full max-w-5xl" }, /* @__PURE__ */ React27.createElement("form", { className: "flex flex-col gap-8", onSubmit: handleSave, autoComplete: "off" }, /* @__PURE__ */ React27.createElement(
|
|
2092
2092
|
TextInput,
|
|
2093
2093
|
{
|
|
2094
2094
|
label: primaryInputLabel,
|
|
@@ -2157,9 +2157,9 @@ var UniversalIdentityPage = ({
|
|
|
2157
2157
|
};
|
|
2158
2158
|
|
|
2159
2159
|
// src/components/UniversalMembersPage.tsx
|
|
2160
|
-
import
|
|
2160
|
+
import React29, { useState as useState17, useEffect as useEffect14, useRef as useRef9 } from "react";
|
|
2161
2161
|
import toast4 from "react-hot-toast";
|
|
2162
|
-
import { HugeiconsIcon as
|
|
2162
|
+
import { HugeiconsIcon as HugeiconsIcon16 } from "@hugeicons/react";
|
|
2163
2163
|
import {
|
|
2164
2164
|
UserAdd01Icon,
|
|
2165
2165
|
ArrowLeft01Icon as ArrowLeft01Icon3,
|
|
@@ -2168,8 +2168,73 @@ import {
|
|
|
2168
2168
|
ArrowDown01Icon,
|
|
2169
2169
|
Loading03Icon as Loading03Icon6
|
|
2170
2170
|
} from "@hugeicons/core-free-icons";
|
|
2171
|
-
|
|
2172
|
-
|
|
2171
|
+
|
|
2172
|
+
// src/components/Banner.tsx
|
|
2173
|
+
import React28, { useState as useState16 } from "react";
|
|
2174
|
+
import { HugeiconsIcon as HugeiconsIcon15 } from "@hugeicons/react";
|
|
2175
|
+
import {
|
|
2176
|
+
Alert02Icon,
|
|
2177
|
+
CheckmarkBadge01Icon,
|
|
2178
|
+
InformationCircleIcon,
|
|
2179
|
+
Cancel01Icon
|
|
2180
|
+
} from "@hugeicons/core-free-icons";
|
|
2181
|
+
var Banner = ({
|
|
2182
|
+
title,
|
|
2183
|
+
message,
|
|
2184
|
+
type,
|
|
2185
|
+
icon,
|
|
2186
|
+
isDismissible = true,
|
|
2187
|
+
onDismiss,
|
|
2188
|
+
action
|
|
2189
|
+
}) => {
|
|
2190
|
+
const [isVisible, setIsVisible] = useState16(true);
|
|
2191
|
+
if (!isVisible) return null;
|
|
2192
|
+
const handleDismiss = () => {
|
|
2193
|
+
setIsVisible(false);
|
|
2194
|
+
if (onDismiss) onDismiss();
|
|
2195
|
+
};
|
|
2196
|
+
const config = {
|
|
2197
|
+
success: {
|
|
2198
|
+
bg: "bg-emerald-50",
|
|
2199
|
+
iconColor: "text-emerald-600",
|
|
2200
|
+
titleColor: "text-emerald-900",
|
|
2201
|
+
msgColor: "text-emerald-700",
|
|
2202
|
+
defaultIcon: CheckmarkBadge01Icon,
|
|
2203
|
+
closeHover: "hover:bg-emerald-100 text-emerald-500"
|
|
2204
|
+
},
|
|
2205
|
+
warning: {
|
|
2206
|
+
bg: "bg-amber-50",
|
|
2207
|
+
iconColor: "text-amber-600",
|
|
2208
|
+
titleColor: "text-amber-900",
|
|
2209
|
+
msgColor: "text-amber-700",
|
|
2210
|
+
defaultIcon: InformationCircleIcon,
|
|
2211
|
+
closeHover: "hover:bg-amber-100 text-amber-500"
|
|
2212
|
+
},
|
|
2213
|
+
alert: {
|
|
2214
|
+
bg: "bg-red-50",
|
|
2215
|
+
iconColor: "text-red-600",
|
|
2216
|
+
titleColor: "text-red-900",
|
|
2217
|
+
msgColor: "text-red-700",
|
|
2218
|
+
defaultIcon: Alert02Icon,
|
|
2219
|
+
closeHover: "hover:bg-red-100 text-red-500"
|
|
2220
|
+
}
|
|
2221
|
+
};
|
|
2222
|
+
const currentConfig = config[type];
|
|
2223
|
+
const IconToUse = icon || currentConfig.defaultIcon;
|
|
2224
|
+
return /* @__PURE__ */ React28.createElement("div", { className: `relative w-full rounded-2xl p-4 flex items-start gap-4 transition-all duration-300 animate-in fade-in slide-in-from-top-2 ${currentConfig.bg}` }, /* @__PURE__ */ React28.createElement("div", { className: `shrink-0 mt-0.5 ${currentConfig.iconColor}` }, /* @__PURE__ */ React28.createElement(HugeiconsIcon15, { icon: IconToUse, size: 20 })), /* @__PURE__ */ React28.createElement("div", { className: "flex-1 flex flex-col min-w-0 pr-6" }, /* @__PURE__ */ React28.createElement("h4", { className: `text-sm tracking-tight mb-1 ${currentConfig.titleColor}` }, title), /* @__PURE__ */ React28.createElement("p", { className: `text-xs leading-relaxed ${currentConfig.msgColor}` }, message), action && /* @__PURE__ */ React28.createElement("div", { className: "mt-3" }, action)), isDismissible && /* @__PURE__ */ React28.createElement(
|
|
2225
|
+
"button",
|
|
2226
|
+
{
|
|
2227
|
+
onClick: handleDismiss,
|
|
2228
|
+
className: `absolute top-3 right-3 p-1.5 rounded-full transition-colors outline-none shrink-0 ${currentConfig.closeHover}`,
|
|
2229
|
+
"aria-label": "Dismiss banner"
|
|
2230
|
+
},
|
|
2231
|
+
/* @__PURE__ */ React28.createElement(HugeiconsIcon15, { icon: Cancel01Icon, size: 16 })
|
|
2232
|
+
));
|
|
2233
|
+
};
|
|
2234
|
+
|
|
2235
|
+
// src/components/UniversalMembersPage.tsx
|
|
2236
|
+
var ButtonSpinner3 = () => /* @__PURE__ */ React29.createElement(HugeiconsIcon16, { icon: Loading03Icon6, size: 16, className: "animate-spin text-white" });
|
|
2237
|
+
var PageSpinner2 = () => /* @__PURE__ */ React29.createElement("div", { className: "flex justify-center items-center py-12" }, /* @__PURE__ */ React29.createElement(HugeiconsIcon16, { icon: Loading03Icon6, size: 32, className: "animate-spin mb-4 text-black" }));
|
|
2173
2238
|
var getInitials = (name) => {
|
|
2174
2239
|
if (!name) return "U";
|
|
2175
2240
|
const parts = name.trim().split(" ");
|
|
@@ -2212,16 +2277,16 @@ var UniversalMembersPage = ({
|
|
|
2212
2277
|
onRemoveMember,
|
|
2213
2278
|
onUpdateRole
|
|
2214
2279
|
}) => {
|
|
2215
|
-
const [currentView, setCurrentView] =
|
|
2216
|
-
const [selectedMember, setSelectedMember] =
|
|
2217
|
-
const [inviteEmail, setInviteEmail] =
|
|
2218
|
-
const [inviteFirst, setInviteFirst] =
|
|
2219
|
-
const [inviteLast, setInviteLast] =
|
|
2220
|
-
const [isInviting, setIsInviting] =
|
|
2221
|
-
const [isRoleModalOpen, setIsRoleModalOpen] =
|
|
2222
|
-
const [isUpdatingRole, setIsUpdatingRole] =
|
|
2223
|
-
const [memberToDelete, setMemberToDelete] =
|
|
2224
|
-
const [isDeleting, setIsDeleting] =
|
|
2280
|
+
const [currentView, setCurrentView] = useState17("list");
|
|
2281
|
+
const [selectedMember, setSelectedMember] = useState17(null);
|
|
2282
|
+
const [inviteEmail, setInviteEmail] = useState17("");
|
|
2283
|
+
const [inviteFirst, setInviteFirst] = useState17("");
|
|
2284
|
+
const [inviteLast, setInviteLast] = useState17("");
|
|
2285
|
+
const [isInviting, setIsInviting] = useState17(false);
|
|
2286
|
+
const [isRoleModalOpen, setIsRoleModalOpen] = useState17(false);
|
|
2287
|
+
const [isUpdatingRole, setIsUpdatingRole] = useState17(false);
|
|
2288
|
+
const [memberToDelete, setMemberToDelete] = useState17(null);
|
|
2289
|
+
const [isDeleting, setIsDeleting] = useState17(false);
|
|
2225
2290
|
const dropdownRef = useRef9(null);
|
|
2226
2291
|
useEffect14(() => {
|
|
2227
2292
|
function handleClickOutside(event) {
|
|
@@ -2297,15 +2362,15 @@ var UniversalMembersPage = ({
|
|
|
2297
2362
|
setSelectedMember(null);
|
|
2298
2363
|
setIsRoleModalOpen(false);
|
|
2299
2364
|
};
|
|
2300
|
-
return /* @__PURE__ */
|
|
2365
|
+
return /* @__PURE__ */ React29.createElement("div", { className: "flex flex-col gap-8 animate-in max-w-5xl fade-in duration-300 p-6 rounded-2xl bg-white " }, /* @__PURE__ */ React29.createElement(ManagedToaster, null), /* @__PURE__ */ React29.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-4" }, currentView === "list" && /* @__PURE__ */ React29.createElement(React29.Fragment, null, /* @__PURE__ */ React29.createElement("div", null, /* @__PURE__ */ React29.createElement("h1", { className: " gradient-text text-xl mb-1 tracking-tight" }, headerTitle), /* @__PURE__ */ React29.createElement("p", { className: "text-xs text-neutral-500" }, headerDescription)), canManage && /* @__PURE__ */ React29.createElement(
|
|
2301
2366
|
ThreeDActionButton,
|
|
2302
2367
|
{
|
|
2303
2368
|
onClick: () => setCurrentView("invite"),
|
|
2304
2369
|
className: "w-fit shrink-0 gap-2"
|
|
2305
2370
|
},
|
|
2306
|
-
/* @__PURE__ */
|
|
2371
|
+
/* @__PURE__ */ React29.createElement(HugeiconsIcon16, { icon: UserAdd01Icon, size: 12 }),
|
|
2307
2372
|
"Add Member"
|
|
2308
|
-
)), currentView !== "list" && /* @__PURE__ */
|
|
2373
|
+
)), currentView !== "list" && /* @__PURE__ */ React29.createElement("div", { className: "flex flex-col items-start gap-3" }, /* @__PURE__ */ React29.createElement("button", { onClick: goBack, className: "text-[11px] text-neutral-400 hover:text-black tracking-[0.2em] flex items-center gap-1.5 transition-colors outline-none" }, /* @__PURE__ */ React29.createElement(HugeiconsIcon16, { icon: ArrowLeft01Icon3, size: 12 }), " Back"), /* @__PURE__ */ React29.createElement("h1", { className: " text-lg text-black tracking-tight" }, currentView === "invite" ? "Add New Member" : "Member Profile"))), currentView === "list" && /* @__PURE__ */ React29.createElement("div", { className: "w-full overflow-hidden" }, isLoading ? /* @__PURE__ */ React29.createElement(PageSpinner2, null) : /* @__PURE__ */ React29.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ React29.createElement("div", { className: "divide-y divide-neutral-100" }, members.length === 0 ? /* @__PURE__ */ React29.createElement("p", { className: "text-xs text-neutral-500 py-6 text-center" }, "No organization member") : members.map((member) => /* @__PURE__ */ React29.createElement(
|
|
2309
2374
|
"div",
|
|
2310
2375
|
{
|
|
2311
2376
|
key: member.id,
|
|
@@ -2315,7 +2380,7 @@ var UniversalMembersPage = ({
|
|
|
2315
2380
|
},
|
|
2316
2381
|
className: "flex items-center justify-between p-4 sm:p-5 hover:bg-neutral-50/50 transition-colors cursor-pointer group min-w-0"
|
|
2317
2382
|
},
|
|
2318
|
-
/* @__PURE__ */
|
|
2383
|
+
/* @__PURE__ */ React29.createElement("div", { className: "flex items-center gap-3 sm:gap-4 min-w-0 flex-1" }, member.displayImage && member.displayImage !== "NO_IMAGE" ? /* @__PURE__ */ React29.createElement("div", { className: "w-10 h-10 shrink-0 rounded-full overflow-hidden bg-neutral-100" }, /* @__PURE__ */ React29.createElement(
|
|
2319
2384
|
"img",
|
|
2320
2385
|
{
|
|
2321
2386
|
src: member.displayImage,
|
|
@@ -2323,25 +2388,25 @@ var UniversalMembersPage = ({
|
|
|
2323
2388
|
className: "w-full h-full object-cover blur-sm transition-all duration-300",
|
|
2324
2389
|
onLoad: (e) => e.currentTarget.classList.remove("blur-sm")
|
|
2325
2390
|
}
|
|
2326
|
-
)) : /* @__PURE__ */
|
|
2327
|
-
/* @__PURE__ */
|
|
2328
|
-
))), /* @__PURE__ */
|
|
2391
|
+
)) : /* @__PURE__ */ React29.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__ */ React29.createElement("div", { className: "min-w-0 flex-1" }, /* @__PURE__ */ React29.createElement("p", { className: "text-sm text-black truncate pr-2 sm:pr-4" }, member.fullName, " ", member.userId === currentUserId && /* @__PURE__ */ React29.createElement("span", { className: "text-neutral-400 ml-1 sm:ml-2" }, "(You)")), /* @__PURE__ */ React29.createElement("p", { className: "text-xs text-neutral-500 truncate pr-2 sm:pr-4 mt-0.5" }, member.email))),
|
|
2392
|
+
/* @__PURE__ */ React29.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__ */ React29.createElement("span", { className: "text-[11px] tracking-[0.2em] text-black border border-neutral-100 px-4 py-2 rounded-full bg-white whitespace-nowrap" }, canManage ? "Manage" : "View"))
|
|
2393
|
+
))), /* @__PURE__ */ React29.createElement("div", { className: "flex items-center justify-between p-4 sm:p-5" }, /* @__PURE__ */ React29.createElement("span", { className: "text-[11px] text-neutral-400 tracking-[0.2em]" }, "Page ", currentPage, " of ", totalPages), /* @__PURE__ */ React29.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React29.createElement(
|
|
2329
2394
|
"button",
|
|
2330
2395
|
{
|
|
2331
2396
|
onClick: () => onPageChange(currentPage - 1),
|
|
2332
2397
|
disabled: currentPage === 1 || isLoading,
|
|
2333
2398
|
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"
|
|
2334
2399
|
},
|
|
2335
|
-
/* @__PURE__ */
|
|
2336
|
-
), /* @__PURE__ */
|
|
2400
|
+
/* @__PURE__ */ React29.createElement(HugeiconsIcon16, { icon: ArrowLeft01Icon3, size: 14 })
|
|
2401
|
+
), /* @__PURE__ */ React29.createElement(
|
|
2337
2402
|
"button",
|
|
2338
2403
|
{
|
|
2339
2404
|
onClick: () => onPageChange(currentPage + 1),
|
|
2340
2405
|
disabled: currentPage >= totalPages || isLoading,
|
|
2341
2406
|
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"
|
|
2342
2407
|
},
|
|
2343
|
-
/* @__PURE__ */
|
|
2344
|
-
))))), currentView === "details" && selectedMember && /* @__PURE__ */
|
|
2408
|
+
/* @__PURE__ */ React29.createElement(HugeiconsIcon16, { icon: ArrowRight01Icon3, size: 14 })
|
|
2409
|
+
))))), currentView === "details" && selectedMember && /* @__PURE__ */ React29.createElement("div", { className: "w-full max-w-5xl text-left" }, /* @__PURE__ */ React29.createElement("div", { className: "flex flex-col gap-8" }, /* @__PURE__ */ React29.createElement("div", { className: "flex items-center gap-5" }, selectedMember.displayImage && selectedMember.displayImage !== "NO_IMAGE" ? /* @__PURE__ */ React29.createElement("div", { className: "w-16 h-16 shrink-0 rounded-full overflow-hidden bg-neutral-100" }, /* @__PURE__ */ React29.createElement(
|
|
2345
2410
|
"img",
|
|
2346
2411
|
{
|
|
2347
2412
|
src: selectedMember.displayImage,
|
|
@@ -2349,7 +2414,7 @@ var UniversalMembersPage = ({
|
|
|
2349
2414
|
className: "w-full h-full object-cover blur-sm transition-all duration-300",
|
|
2350
2415
|
onLoad: (e) => e.currentTarget.classList.remove("blur-sm")
|
|
2351
2416
|
}
|
|
2352
|
-
)) : /* @__PURE__ */
|
|
2417
|
+
)) : /* @__PURE__ */ React29.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__ */ React29.createElement("div", null, /* @__PURE__ */ React29.createElement("h2", { className: " text-lg text-black" }, selectedMember.fullName), /* @__PURE__ */ React29.createElement("p", { className: "text-sm text-neutral-500 mt-1" }, selectedMember.email))), /* @__PURE__ */ React29.createElement("div", { className: "grid grid-cols-2 gap-6 border-t border-neutral-100 pt-8" }, /* @__PURE__ */ React29.createElement("div", null, /* @__PURE__ */ React29.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-3" }, "Role"), canChangeRoles && selectedMember.userId !== currentUserId ? /* @__PURE__ */ React29.createElement(
|
|
2353
2418
|
"button",
|
|
2354
2419
|
{
|
|
2355
2420
|
onClick: () => !isUpdatingRole && setIsRoleModalOpen(true),
|
|
@@ -2357,16 +2422,24 @@ var UniversalMembersPage = ({
|
|
|
2357
2422
|
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"}`
|
|
2358
2423
|
},
|
|
2359
2424
|
selectedMember.role,
|
|
2360
|
-
isUpdatingRole ? /* @__PURE__ */
|
|
2361
|
-
) : /* @__PURE__ */
|
|
2425
|
+
isUpdatingRole ? /* @__PURE__ */ React29.createElement(ButtonSpinner3, null) : /* @__PURE__ */ React29.createElement(HugeiconsIcon16, { icon: ArrowDown01Icon, size: 14, className: "text-neutral-400" })
|
|
2426
|
+
) : /* @__PURE__ */ React29.createElement("span", { className: "text-xs text-black bg-neutral-50 px-4 py-2 rounded-full inline-block" }, selectedMember.role)), /* @__PURE__ */ React29.createElement("div", null, /* @__PURE__ */ React29.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-3" }, "Joined Date"), /* @__PURE__ */ React29.createElement("span", { className: "text-sm text-black" }, new Date(selectedMember.joinedAt).toLocaleDateString()))), canManage && selectedMember.userId !== currentUserId && /* @__PURE__ */ React29.createElement("div", { className: "pt-8 mt-2 border-t border-neutral-100" }, /* @__PURE__ */ React29.createElement(
|
|
2362
2427
|
"button",
|
|
2363
2428
|
{
|
|
2364
2429
|
onClick: () => setMemberToDelete(selectedMember),
|
|
2365
2430
|
className: "flex items-center gap-2 text-[11px] tracking-widest text-red-600 hover:text-red-700 transition-colors w-fit outline-none"
|
|
2366
2431
|
},
|
|
2367
|
-
/* @__PURE__ */
|
|
2432
|
+
/* @__PURE__ */ React29.createElement(HugeiconsIcon16, { icon: Delete01Icon, size: 14 }),
|
|
2368
2433
|
" Remove Member"
|
|
2369
|
-
)))), currentView === "invite" && canManage && /* @__PURE__ */
|
|
2434
|
+
)))), currentView === "invite" && canManage && /* @__PURE__ */ React29.createElement("div", { className: "w-full max-w-5xl text-left" }, /* @__PURE__ */ React29.createElement("form", { onSubmit: handleInvite, className: "space-y-8", autoComplete: "off" }, /* @__PURE__ */ React29.createElement(
|
|
2435
|
+
Banner,
|
|
2436
|
+
{
|
|
2437
|
+
title: "Universal Workspace Access",
|
|
2438
|
+
message: "Any member you add here will be granted access across your Retina Organization accounts. These permissions are universal.",
|
|
2439
|
+
type: "warning",
|
|
2440
|
+
isDismissible: false
|
|
2441
|
+
}
|
|
2442
|
+
), /* @__PURE__ */ React29.createElement(
|
|
2370
2443
|
TextInput,
|
|
2371
2444
|
{
|
|
2372
2445
|
label: "Email Address",
|
|
@@ -2375,7 +2448,7 @@ var UniversalMembersPage = ({
|
|
|
2375
2448
|
disabled: isInviting,
|
|
2376
2449
|
placeholder: "developer@acme.com"
|
|
2377
2450
|
}
|
|
2378
|
-
), requireNamesForInvite && /* @__PURE__ */
|
|
2451
|
+
), requireNamesForInvite && /* @__PURE__ */ React29.createElement("div", { className: "flex flex-col sm:flex-row gap-6" }, /* @__PURE__ */ React29.createElement(
|
|
2379
2452
|
TextInput,
|
|
2380
2453
|
{
|
|
2381
2454
|
label: "First Name",
|
|
@@ -2384,7 +2457,7 @@ var UniversalMembersPage = ({
|
|
|
2384
2457
|
disabled: isInviting,
|
|
2385
2458
|
placeholder: "Jane"
|
|
2386
2459
|
}
|
|
2387
|
-
), /* @__PURE__ */
|
|
2460
|
+
), /* @__PURE__ */ React29.createElement(
|
|
2388
2461
|
TextInput,
|
|
2389
2462
|
{
|
|
2390
2463
|
label: "Last Name",
|
|
@@ -2393,7 +2466,7 @@ var UniversalMembersPage = ({
|
|
|
2393
2466
|
disabled: isInviting,
|
|
2394
2467
|
placeholder: "Doe"
|
|
2395
2468
|
}
|
|
2396
|
-
)), /* @__PURE__ */
|
|
2469
|
+
)), /* @__PURE__ */ React29.createElement("div", { className: "pt-4 mt-2" }, /* @__PURE__ */ React29.createElement(
|
|
2397
2470
|
ThreeDActionButton,
|
|
2398
2471
|
{
|
|
2399
2472
|
type: "submit",
|
|
@@ -2402,7 +2475,7 @@ var UniversalMembersPage = ({
|
|
|
2402
2475
|
className: "min-w-40"
|
|
2403
2476
|
},
|
|
2404
2477
|
"Send Invitation"
|
|
2405
|
-
)))), isRoleModalOpen && canChangeRoles && /* @__PURE__ */
|
|
2478
|
+
)))), isRoleModalOpen && canChangeRoles && /* @__PURE__ */ React29.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ React29.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: () => !isUpdatingRole && setIsRoleModalOpen(false) }), /* @__PURE__ */ React29.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__ */ React29.createElement("div", { className: "p-6 text-center w-full" }, /* @__PURE__ */ React29.createElement("h3", { className: " text-[14px] text-black tracking-tight" }, "Update Role")), /* @__PURE__ */ React29.createElement("div", { className: "w-full flex flex-col pl-2 pr-2" }, availableRoles.map((roleOption) => /* @__PURE__ */ React29.createElement(
|
|
2406
2479
|
"button",
|
|
2407
2480
|
{
|
|
2408
2481
|
key: roleOption,
|
|
@@ -2410,9 +2483,9 @@ var UniversalMembersPage = ({
|
|
|
2410
2483
|
disabled: isUpdatingRole,
|
|
2411
2484
|
className: `text-left px-4 py-3 text-[11px] 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"}`
|
|
2412
2485
|
},
|
|
2413
|
-
/* @__PURE__ */
|
|
2414
|
-
selectedMember?.role === roleOption && /* @__PURE__ */
|
|
2415
|
-
))), /* @__PURE__ */
|
|
2486
|
+
/* @__PURE__ */ React29.createElement("span", { className: "truncate pr-2" }, roleOption),
|
|
2487
|
+
selectedMember?.role === roleOption && /* @__PURE__ */ React29.createElement("div", null)
|
|
2488
|
+
))), /* @__PURE__ */ React29.createElement("div", { className: "w-full flex" }, /* @__PURE__ */ React29.createElement(
|
|
2416
2489
|
"button",
|
|
2417
2490
|
{
|
|
2418
2491
|
onClick: () => setIsRoleModalOpen(false),
|
|
@@ -2420,13 +2493,13 @@ var UniversalMembersPage = ({
|
|
|
2420
2493
|
className: "w-full py-2.5 text-[13px] text-neutral-600 hover:bg-neutral-50 transition-colors disabled:opacity-50 outline-none"
|
|
2421
2494
|
},
|
|
2422
2495
|
"Cancel"
|
|
2423
|
-
)))), memberToDelete && canManage && /* @__PURE__ */
|
|
2496
|
+
)))), memberToDelete && canManage && /* @__PURE__ */ React29.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ React29.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: () => !isDeleting && setMemberToDelete(null) }), /* @__PURE__ */ React29.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__ */ React29.createElement("div", { className: "p-6 text-center w-full" }, /* @__PURE__ */ React29.createElement("h3", { className: " text-[17px] text-black tracking-tight mb-1" }, "Remove Member"), /* @__PURE__ */ React29.createElement("p", { className: "text-[11px] text-neutral-500 leading-snug mt-2" }, "Are you sure you want to remove this member? They will lose access instantly.")), /* @__PURE__ */ React29.createElement("div", { className: "w-full flex" }, /* @__PURE__ */ React29.createElement("button", { onClick: () => setMemberToDelete(null), disabled: isDeleting, className: "flex-1 py-3 text-[13px] text-neutral-600 hover:bg-neutral-50 transition-colors disabled:opacity-50 outline-none" }, "Cancel"), /* @__PURE__ */ React29.createElement("button", { onClick: handleDelete, disabled: isDeleting, className: "flex-1 py-3 text-[13px] text-red-600 hover:bg-neutral-50 transition-colors disabled:opacity-50 flex justify-center outline-none" }, isDeleting ? /* @__PURE__ */ React29.createElement(ButtonSpinner3, null) : "Remove")))));
|
|
2424
2497
|
};
|
|
2425
2498
|
|
|
2426
2499
|
// src/components/UniversalProfileSettings.tsx
|
|
2427
|
-
import
|
|
2500
|
+
import React30, { useState as useState18, useEffect as useEffect15 } from "react";
|
|
2428
2501
|
import toast5 from "react-hot-toast";
|
|
2429
|
-
import { HugeiconsIcon as
|
|
2502
|
+
import { HugeiconsIcon as HugeiconsIcon17 } from "@hugeicons/react";
|
|
2430
2503
|
import {
|
|
2431
2504
|
CircleLock02Icon as CircleLock02Icon3
|
|
2432
2505
|
} from "@hugeicons/core-free-icons";
|
|
@@ -2439,9 +2512,9 @@ var UniversalProfileSettings = ({
|
|
|
2439
2512
|
isReadOnly = false,
|
|
2440
2513
|
onSaveProfile
|
|
2441
2514
|
}) => {
|
|
2442
|
-
const [firstName, setFirstName] =
|
|
2443
|
-
const [lastName, setLastName] =
|
|
2444
|
-
const [isSubmitting, setIsSubmitting] =
|
|
2515
|
+
const [firstName, setFirstName] = useState18(initialFirstName);
|
|
2516
|
+
const [lastName, setLastName] = useState18(initialLastName);
|
|
2517
|
+
const [isSubmitting, setIsSubmitting] = useState18(false);
|
|
2445
2518
|
useEffect15(() => {
|
|
2446
2519
|
setFirstName(initialFirstName || "");
|
|
2447
2520
|
setLastName(initialLastName || "");
|
|
@@ -2472,7 +2545,7 @@ var UniversalProfileSettings = ({
|
|
|
2472
2545
|
};
|
|
2473
2546
|
const hasChanges = firstName !== initialFirstName || lastName !== initialLastName;
|
|
2474
2547
|
const isSaveDisabled = isSubmitting || isReadOnly || !hasChanges || firstName.trim().length === 0 || lastName.trim().length === 0;
|
|
2475
|
-
return /* @__PURE__ */
|
|
2548
|
+
return /* @__PURE__ */ React30.createElement("div", { className: "flex flex-col max-w-5xl rounded-2xl p-6 bg-white 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" }, /* @__PURE__ */ React30.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React30.createElement("h1", { className: " gradient-text text-xl mb-1 truncate tracking-tight" }, "Personal Settings"), /* @__PURE__ */ React30.createElement("p", { className: "text-xs text-neutral-500 truncate" }, "Manage your personal account profile.")), isReadOnly && /* @__PURE__ */ React30.createElement("span", { className: "p-2 w-9 h-9 bg-neutral-50 text-neutral-500 rounded-full " }, /* @__PURE__ */ React30.createElement(HugeiconsIcon17, { icon: CircleLock02Icon3, size: 18, className: "text-current" }))), /* @__PURE__ */ React30.createElement("div", { className: "w-full max-w-5xl" }, /* @__PURE__ */ React30.createElement("form", { className: "flex flex-col gap-8", onSubmit: handleSave, autoComplete: "off" }, /* @__PURE__ */ React30.createElement("div", { className: "flex flex-col sm:flex-row gap-6" }, /* @__PURE__ */ React30.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ React30.createElement(
|
|
2476
2549
|
TextInput,
|
|
2477
2550
|
{
|
|
2478
2551
|
label: "First Name",
|
|
@@ -2481,7 +2554,7 @@ var UniversalProfileSettings = ({
|
|
|
2481
2554
|
disabled: isReadOnly || isSubmitting,
|
|
2482
2555
|
placeholder: "System"
|
|
2483
2556
|
}
|
|
2484
|
-
)), /* @__PURE__ */
|
|
2557
|
+
)), /* @__PURE__ */ React30.createElement("div", { className: "flex-1 min-w-0" }, /* @__PURE__ */ React30.createElement(
|
|
2485
2558
|
TextInput,
|
|
2486
2559
|
{
|
|
2487
2560
|
label: "Last Name",
|
|
@@ -2490,7 +2563,7 @@ var UniversalProfileSettings = ({
|
|
|
2490
2563
|
disabled: isReadOnly || isSubmitting,
|
|
2491
2564
|
placeholder: "Admin"
|
|
2492
2565
|
}
|
|
2493
|
-
))), /* @__PURE__ */
|
|
2566
|
+
))), /* @__PURE__ */ React30.createElement("div", { className: "space-y-2 min-w-0" }, /* @__PURE__ */ React30.createElement(
|
|
2494
2567
|
TextInput,
|
|
2495
2568
|
{
|
|
2496
2569
|
label: "Email ID",
|
|
@@ -2499,7 +2572,7 @@ var UniversalProfileSettings = ({
|
|
|
2499
2572
|
},
|
|
2500
2573
|
disabled: true
|
|
2501
2574
|
}
|
|
2502
|
-
), /* @__PURE__ */
|
|
2575
|
+
), /* @__PURE__ */ React30.createElement("p", { className: "text-[11px] text-neutral-400 mt-1 truncate" }, "To change your email address, please contact support.")), /* @__PURE__ */ React30.createElement("div", { className: "flex flex-col sm:flex-row sm:items-center justify-between pt-8 mt-2 gap-6 sm:gap-4 " }, /* @__PURE__ */ React30.createElement("div", { className: "flex items-center gap-6 min-w-0" }, /* @__PURE__ */ React30.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React30.createElement("span", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block truncate " }, "Account Status"), /* @__PURE__ */ React30.createElement("span", { className: "text-xs text-black block truncate" }, accountStatus)), /* @__PURE__ */ React30.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React30.createElement("span", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block truncate " }, "Member Since"), /* @__PURE__ */ React30.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__ */ React30.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__ */ React30.createElement(
|
|
2503
2576
|
"button",
|
|
2504
2577
|
{
|
|
2505
2578
|
type: "button",
|
|
@@ -2510,7 +2583,7 @@ var UniversalProfileSettings = ({
|
|
|
2510
2583
|
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"
|
|
2511
2584
|
},
|
|
2512
2585
|
"Cancel"
|
|
2513
|
-
), /* @__PURE__ */
|
|
2586
|
+
), /* @__PURE__ */ React30.createElement(
|
|
2514
2587
|
ThreeDActionButton,
|
|
2515
2588
|
{
|
|
2516
2589
|
type: "submit",
|
|
@@ -2523,8 +2596,8 @@ var UniversalProfileSettings = ({
|
|
|
2523
2596
|
};
|
|
2524
2597
|
|
|
2525
2598
|
// src/components/UniversalBillingPage.tsx
|
|
2526
|
-
import
|
|
2527
|
-
import { HugeiconsIcon as
|
|
2599
|
+
import React31, { useState as useState19 } from "react";
|
|
2600
|
+
import { HugeiconsIcon as HugeiconsIcon18 } from "@hugeicons/react";
|
|
2528
2601
|
import {
|
|
2529
2602
|
ArrowLeft01Icon as ArrowLeft01Icon4,
|
|
2530
2603
|
ArrowRight01Icon as ArrowRight01Icon4,
|
|
@@ -2532,8 +2605,8 @@ import {
|
|
|
2532
2605
|
ArrowDown01Icon as ArrowDown01Icon2,
|
|
2533
2606
|
CircleLock02Icon as CircleLock02Icon4
|
|
2534
2607
|
} from "@hugeicons/core-free-icons";
|
|
2535
|
-
var PageSpinner3 = () => /* @__PURE__ */
|
|
2536
|
-
var ButtonSpinner4 = () => /* @__PURE__ */
|
|
2608
|
+
var PageSpinner3 = () => /* @__PURE__ */ React31.createElement("div", { className: "flex justify-center items-center py-12" }, /* @__PURE__ */ React31.createElement(HugeiconsIcon18, { icon: Loading03Icon7, size: 32, className: "animate-spin mb-4 text-neutral-400" }));
|
|
2609
|
+
var ButtonSpinner4 = () => /* @__PURE__ */ React31.createElement(HugeiconsIcon18, { icon: Loading03Icon7, size: 16, className: "animate-spin text-neutral-500" });
|
|
2537
2610
|
var formatDate = (dateString) => {
|
|
2538
2611
|
if (!dateString) return "N/A";
|
|
2539
2612
|
return new Date(dateString).toLocaleDateString("en-US", {
|
|
@@ -2545,6 +2618,10 @@ var formatDate = (dateString) => {
|
|
|
2545
2618
|
var formatUsd = (amount) => {
|
|
2546
2619
|
return `$${(amount || 0).toLocaleString("en-US", { minimumFractionDigits: 2, maximumFractionDigits: 2 })}`;
|
|
2547
2620
|
};
|
|
2621
|
+
var capitalizeWords = (input) => {
|
|
2622
|
+
if (!input) return "";
|
|
2623
|
+
return input.toLowerCase().split(" ").map((part) => part.length ? part[0].toUpperCase() + part.slice(1) : part).join(" ");
|
|
2624
|
+
};
|
|
2548
2625
|
var UniversalBillingPage = ({
|
|
2549
2626
|
headerTitle,
|
|
2550
2627
|
headerDescription,
|
|
@@ -2575,13 +2652,13 @@ var UniversalBillingPage = ({
|
|
|
2575
2652
|
onPayInvoice,
|
|
2576
2653
|
onUpdateInvoiceStatus
|
|
2577
2654
|
}) => {
|
|
2578
|
-
const [currentView, setCurrentView] =
|
|
2579
|
-
const [selectedInvoice, setSelectedInvoice] =
|
|
2580
|
-
const [isTimeframeModalOpen, setIsTimeframeModalOpen] =
|
|
2581
|
-
const [isPaying, setIsPaying] =
|
|
2582
|
-
const [isActionModalOpen, setIsActionModalOpen] =
|
|
2583
|
-
const [isUpdating, setIsUpdating] =
|
|
2584
|
-
const [twoFactorCode, setTwoFactorCode] =
|
|
2655
|
+
const [currentView, setCurrentView] = useState19("list");
|
|
2656
|
+
const [selectedInvoice, setSelectedInvoice] = useState19(null);
|
|
2657
|
+
const [isTimeframeModalOpen, setIsTimeframeModalOpen] = useState19(false);
|
|
2658
|
+
const [isPaying, setIsPaying] = useState19(false);
|
|
2659
|
+
const [isActionModalOpen, setIsActionModalOpen] = useState19(false);
|
|
2660
|
+
const [isUpdating, setIsUpdating] = useState19(false);
|
|
2661
|
+
const [twoFactorCode, setTwoFactorCode] = useState19("");
|
|
2585
2662
|
const handlePayment = async () => {
|
|
2586
2663
|
if (!selectedInvoice || isReadOnly || !onPayInvoice || isPaying) return;
|
|
2587
2664
|
setIsPaying(true);
|
|
@@ -2608,14 +2685,14 @@ var UniversalBillingPage = ({
|
|
|
2608
2685
|
setIsUpdating(false);
|
|
2609
2686
|
}
|
|
2610
2687
|
};
|
|
2611
|
-
return /* @__PURE__ */
|
|
2688
|
+
return /* @__PURE__ */ React31.createElement("div", { className: "flex max-w-5xl rounded-2xl bg-white p-6 flex-col gap-8 animate-in fade-in duration-300 " }, /* @__PURE__ */ React31.createElement(ManagedToaster, null), /* @__PURE__ */ React31.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-3 sm:gap-4" }, currentView === "list" ? /* @__PURE__ */ React31.createElement("div", { className: "min-w-0 w-full" }, /* @__PURE__ */ React31.createElement("h1", { className: "text-lg gradient-text mb-1 truncate tracking-tight" }, headerTitle), /* @__PURE__ */ React31.createElement("p", { className: "text-xs text-neutral-500 truncate mb-6" }, headerDescription), showSearchAndFilter && onSearchChange && onTimeframeChange && /* @__PURE__ */ React31.createElement("div", { className: "flex flex-col sm:flex-row gap-4 mb-4" }, /* @__PURE__ */ React31.createElement(
|
|
2612
2689
|
TextInput,
|
|
2613
2690
|
{
|
|
2614
2691
|
placeholder: "Search by ID or Name...",
|
|
2615
2692
|
value: searchQuery,
|
|
2616
2693
|
onChange: onSearchChange
|
|
2617
2694
|
}
|
|
2618
|
-
), /* @__PURE__ */
|
|
2695
|
+
), /* @__PURE__ */ React31.createElement(
|
|
2619
2696
|
"button",
|
|
2620
2697
|
{
|
|
2621
2698
|
type: "button",
|
|
@@ -2623,10 +2700,10 @@ var UniversalBillingPage = ({
|
|
|
2623
2700
|
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"
|
|
2624
2701
|
},
|
|
2625
2702
|
timeframe === "ALL" ? "All Time" : timeframe === "24H" ? "Past 24 Hours" : timeframe === "7D" ? "Past 7 Days" : "Past 30 Days"
|
|
2626
|
-
))) : /* @__PURE__ */
|
|
2703
|
+
))) : /* @__PURE__ */ React31.createElement("div", { className: "flex flex-col items-start gap-3" }, /* @__PURE__ */ React31.createElement("button", { onClick: () => setCurrentView("list"), className: "text-[11px] text-neutral-400 hover:text-black tracking-[0.2em] flex items-center gap-1.5 transition-colors outline-none" }, /* @__PURE__ */ React31.createElement(HugeiconsIcon18, { icon: ArrowLeft01Icon4, size: 12 }), " Back")), isReadOnly && currentView === "list" && /* @__PURE__ */ React31.createElement("span", { className: "p-2 w-9 h-9 bg-neutral-50 text-neutral-500 rounded-full " }, /* @__PURE__ */ React31.createElement(HugeiconsIcon18, { icon: CircleLock02Icon4, size: 18, className: "text-current" }))), currentView === "list" && /* @__PURE__ */ React31.createElement("div", { className: "w-full max-w-5xl" }, /* @__PURE__ */ React31.createElement("div", { className: "flex flex-col gap-8 w-full" }, (metricPrimaryLabel || metricSecondaryLabel) && /* @__PURE__ */ React31.createElement("div", { className: "flex flex-col sm:flex-row sm:justify-between sm:items-start pb-8 gap-6 sm:gap-0" }, metricPrimaryLabel && /* @__PURE__ */ React31.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React31.createElement("h3", { className: "text-[11px] text-neutral-400 tracking-[0.2em] mb-2 truncate block " }, metricPrimaryLabel), /* @__PURE__ */ React31.createElement("div", { className: "text-2xl text-black tracking-tight truncate" }, formatUsd(metricPrimaryValue)), metricPrimarySubtext && /* @__PURE__ */ React31.createElement("p", { className: "text-[11px] text-neutral-500 mt-1 tracking-widest " }, metricPrimarySubtext)), metricSecondaryLabel && /* @__PURE__ */ React31.createElement("div", { className: "min-w-0 sm:text-right" }, /* @__PURE__ */ React31.createElement("h3", { className: "text-[11px] text-neutral-400 tracking-[0.2em] mb-2 truncate block " }, metricSecondaryLabel), /* @__PURE__ */ React31.createElement("div", { className: "text-xl text-emerald-600 tracking-tight truncate" }, formatUsd(metricSecondaryValue)), metricSecondarySubtext && /* @__PURE__ */ React31.createElement("p", { className: "text-[11px] text-neutral-500 mt-1 tracking-widest " }, metricSecondarySubtext))), !isReadOnly && showBillingOverview && /* @__PURE__ */ React31.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-3 gap-8 sm:gap-4" }, /* @__PURE__ */ React31.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React31.createElement("h3", { className: "text-[11px] text-neutral-400 tracking-[0.2em] mb-3 truncate block " }, "Billing Status"), /* @__PURE__ */ React31.createElement("div", { className: "flex items-center gap-2 min-w-0" }, /* @__PURE__ */ React31.createElement("div", { className: `w-2 h-2 rounded-full shrink-0 ${billingStatus === "ACTIVE" ? "bg-green-500" : "bg-neutral-300"}` }), /* @__PURE__ */ React31.createElement("p", { className: "text-xs text-black tracking-widest truncate" }, billingStatus || "UNKNOWN"))), /* @__PURE__ */ React31.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React31.createElement("h3", { className: "text-[11px] text-neutral-400 tracking-[0.2em] mb-3 truncate block " }, "Next Billing Date"), /* @__PURE__ */ React31.createElement("p", { className: "text-sm text-black truncate" }, formatDate(nextBillingDate))), lastPaidDate && /* @__PURE__ */ React31.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React31.createElement("h3", { className: "text-[11px] text-neutral-400 tracking-[0.2em] mb-3 truncate block " }, "Last Paid Date"), /* @__PURE__ */ React31.createElement("p", { className: "text-sm text-neutral-600 truncate" }, formatDate(lastPaidDate)))), !isReadOnly && showUsageMetrics && usageMetrics.length > 0 && /* @__PURE__ */ React31.createElement("div", { className: "pt-8 border-t border-neutral-100" }, /* @__PURE__ */ React31.createElement("h3", { className: "text-[11px] text-neutral-400 tracking-[0.2em] mb-6 truncate block " }, "Usage & Limits"), /* @__PURE__ */ React31.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__ */ React31.createElement("div", { key: idx, className: "flex justify-between pb-2" }, /* @__PURE__ */ React31.createElement("span", { className: "text-neutral-500 text-xs" }, metric.label), /* @__PURE__ */ React31.createElement("span", { className: "text-xs text-black" }, metric.value))))), /* @__PURE__ */ React31.createElement("div", { className: "pt-8 border-t border-neutral-100" }, /* @__PURE__ */ React31.createElement("h3", { className: "text-[11px] text-neutral-400 tracking-[0.2em] mb-4 truncate block " }, "Transaction History"), isLoading ? /* @__PURE__ */ React31.createElement(PageSpinner3, null) : invoices.length === 0 ? /* @__PURE__ */ React31.createElement(React31.Fragment, null, /* @__PURE__ */ React31.createElement("p", { className: "text-xs text-neutral-500 py-4" }, "No records found.")) : /* @__PURE__ */ React31.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ React31.createElement("div", { className: "divide-y divide-neutral-100" }, invoices.map((inv) => /* @__PURE__ */ React31.createElement("div", { key: inv.id, onClick: () => {
|
|
2627
2704
|
setSelectedInvoice(inv);
|
|
2628
2705
|
setCurrentView("details");
|
|
2629
|
-
}, className: "flex items-center justify-between py-4 hover:bg-neutral-50/50 cursor-pointer group min-w-0 px-2 transition-colors" }, /* @__PURE__ */
|
|
2706
|
+
}, className: "flex items-center justify-between py-4 hover:bg-neutral-50/50 cursor-pointer group min-w-0 px-2 transition-colors" }, /* @__PURE__ */ React31.createElement("div", { className: "flex flex-col gap-1 min-w-0 flex-1" }, /* @__PURE__ */ React31.createElement("p", { className: "text-sm text-black truncate pr-4" }, capitalizeWords(inv.name)), /* @__PURE__ */ React31.createElement("p", { className: "text-xs text-neutral-500 truncate" }, inv.subtext)), /* @__PURE__ */ React31.createElement("div", { className: "flex flex-col items-end gap-1 shrink-0 pl-4" }, /* @__PURE__ */ React31.createElement("p", { className: "text-sm text-black" }, formatUsd(inv.amountDue)), /* @__PURE__ */ React31.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__ */ React31.createElement("div", { className: "flex items-center justify-between pt-4 mt-2" }, /* @__PURE__ */ React31.createElement("span", { className: "text-[11px] text-neutral-400 tracking-[0.2em]" }, "Page ", currentPage, " of ", totalPages), /* @__PURE__ */ React31.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React31.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__ */ React31.createElement(HugeiconsIcon18, { icon: ArrowLeft01Icon4, size: 14 })), /* @__PURE__ */ React31.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__ */ React31.createElement(HugeiconsIcon18, { icon: ArrowRight01Icon4, size: 14 })))))))), currentView === "details" && selectedInvoice && /* @__PURE__ */ React31.createElement("div", { className: "w-full max-w-5xl animate-in fade-in duration-300" }, /* @__PURE__ */ React31.createElement("div", { className: "flex flex-col gap-6 w-full" }, /* @__PURE__ */ React31.createElement("div", null, /* @__PURE__ */ React31.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-1 " }, "Breakdown"), /* @__PURE__ */ React31.createElement("h2", { className: "text-lg text-black mb-1" }, capitalizeWords(selectedInvoice.name)), /* @__PURE__ */ React31.createElement("p", { className: "text-xs text-neutral-500" }, "Generated on ", formatDate(selectedInvoice.createdAt))), /* @__PURE__ */ React31.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6 " }, /* @__PURE__ */ React31.createElement("div", null, /* @__PURE__ */ React31.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-1 " }, "Amount"), /* @__PURE__ */ React31.createElement("p", { className: "text-xl text-black" }, formatUsd(selectedInvoice.amountDue))), /* @__PURE__ */ React31.createElement("div", null, /* @__PURE__ */ React31.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-1 " }, "Status"), isModMode ? /* @__PURE__ */ React31.createElement(
|
|
2630
2707
|
"button",
|
|
2631
2708
|
{
|
|
2632
2709
|
onClick: () => !isUpdating && setIsActionModalOpen(true),
|
|
@@ -2634,8 +2711,8 @@ var UniversalBillingPage = ({
|
|
|
2634
2711
|
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"}`
|
|
2635
2712
|
},
|
|
2636
2713
|
selectedInvoice.status,
|
|
2637
|
-
isUpdating ? /* @__PURE__ */
|
|
2638
|
-
) : /* @__PURE__ */
|
|
2714
|
+
isUpdating ? /* @__PURE__ */ React31.createElement(ButtonSpinner4, null) : /* @__PURE__ */ React31.createElement(HugeiconsIcon18, { icon: ArrowDown01Icon2, size: 14, className: "text-neutral-400" })
|
|
2715
|
+
) : /* @__PURE__ */ React31.createElement("span", { className: `text-[11px] 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__ */ React31.createElement("div", { className: "md:col-span-2 pt-4 border-t border-neutral-100/60 mt-2" }, /* @__PURE__ */ React31.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-1 " }, "Reference ID"), /* @__PURE__ */ React31.createElement("p", { className: "text-xs text-neutral-500 inline-block" }, selectedInvoice.id))), /* @__PURE__ */ React31.createElement("div", { className: "flex flex-col sm:flex-row sm:items-center justify-end gap-4 pt-4" }, !isModMode && (selectedInvoice.status === "ISSUED" || selectedInvoice.status === "OVERDUE") && onPayInvoice && /* @__PURE__ */ React31.createElement("div", { className: "flex flex-col items-end gap-2 w-full sm:w-auto" }, /* @__PURE__ */ React31.createElement(
|
|
2639
2716
|
ThreeDActionButton,
|
|
2640
2717
|
{
|
|
2641
2718
|
onClick: handlePayment,
|
|
@@ -2644,12 +2721,12 @@ var UniversalBillingPage = ({
|
|
|
2644
2721
|
className: "w-full sm:w-auto"
|
|
2645
2722
|
},
|
|
2646
2723
|
"Pay Invoice"
|
|
2647
|
-
)), !isModMode && selectedInvoice.status === "PAID" && /* @__PURE__ */
|
|
2724
|
+
)), !isModMode && selectedInvoice.status === "PAID" && /* @__PURE__ */ React31.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__ */ 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-80 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: "text-[14px] text-black tracking-tight mb-2" }, "Select Timeframe"), /* @__PURE__ */ React31.createElement("p", { className: "text-[11px] text-neutral-500" }, "Choose the range of transactions to display.")), /* @__PURE__ */ React31.createElement("div", { className: "w-full flex flex-col pl-2 pr-2" }, [
|
|
2648
2725
|
{ value: "ALL", label: "All Time" },
|
|
2649
2726
|
{ value: "24H", label: "Past 24 Hours" },
|
|
2650
2727
|
{ value: "7D", label: "Past 7 Days" },
|
|
2651
2728
|
{ value: "30D", label: "Past 30 Days" }
|
|
2652
|
-
].map((option) => /* @__PURE__ */
|
|
2729
|
+
].map((option) => /* @__PURE__ */ React31.createElement(
|
|
2653
2730
|
"button",
|
|
2654
2731
|
{
|
|
2655
2732
|
key: option.value,
|
|
@@ -2660,9 +2737,9 @@ var UniversalBillingPage = ({
|
|
|
2660
2737
|
},
|
|
2661
2738
|
className: `text-left px-4 py-3 text-[11px] 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"}`
|
|
2662
2739
|
},
|
|
2663
|
-
/* @__PURE__ */
|
|
2664
|
-
timeframe === option.value && /* @__PURE__ */
|
|
2665
|
-
))), /* @__PURE__ */
|
|
2740
|
+
/* @__PURE__ */ React31.createElement("span", { className: "truncate pr-2" }, option.label),
|
|
2741
|
+
timeframe === option.value && /* @__PURE__ */ React31.createElement("div", null)
|
|
2742
|
+
))), /* @__PURE__ */ React31.createElement("div", { className: "w-full flex mt-2" }, /* @__PURE__ */ React31.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__ */ 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: () => !isUpdating && setIsActionModalOpen(false) }), /* @__PURE__ */ React31.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__ */ React31.createElement("div", { className: "p-6 text-center w-full" }, /* @__PURE__ */ React31.createElement("h3", { className: "text-[14px] text-black tracking-tight mb-2" }, "Update Invoice Status"), /* @__PURE__ */ React31.createElement(
|
|
2666
2743
|
TextInput,
|
|
2667
2744
|
{
|
|
2668
2745
|
placeholder: "Enter 2FA Code...",
|
|
@@ -2670,7 +2747,7 @@ var UniversalBillingPage = ({
|
|
|
2670
2747
|
onChange: setTwoFactorCode,
|
|
2671
2748
|
type: "password"
|
|
2672
2749
|
}
|
|
2673
|
-
)), /* @__PURE__ */
|
|
2750
|
+
)), /* @__PURE__ */ React31.createElement("div", { className: "w-full flex flex-col pl-2 pr-2" }, ["DRAFT", "ISSUED", "PAID", "VOIDED", "OVERDUE"].map((statusOption) => /* @__PURE__ */ React31.createElement(
|
|
2674
2751
|
"button",
|
|
2675
2752
|
{
|
|
2676
2753
|
key: statusOption,
|
|
@@ -2678,16 +2755,16 @@ var UniversalBillingPage = ({
|
|
|
2678
2755
|
disabled: isUpdating || !twoFactorCode,
|
|
2679
2756
|
className: `text-left px-4 py-3 text-[11px] 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"}`
|
|
2680
2757
|
},
|
|
2681
|
-
/* @__PURE__ */
|
|
2682
|
-
selectedInvoice?.status === statusOption && /* @__PURE__ */
|
|
2683
|
-
))), /* @__PURE__ */
|
|
2758
|
+
/* @__PURE__ */ React31.createElement("span", { className: "truncate pr-2" }, statusOption),
|
|
2759
|
+
selectedInvoice?.status === statusOption && /* @__PURE__ */ React31.createElement("div", null)
|
|
2760
|
+
))), /* @__PURE__ */ React31.createElement("div", { className: "w-full flex mt-2" }, /* @__PURE__ */ React31.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")))));
|
|
2684
2761
|
};
|
|
2685
2762
|
|
|
2686
2763
|
// src/components/UniversalCheckoutView.tsx
|
|
2687
|
-
import
|
|
2688
|
-
import { HugeiconsIcon as
|
|
2764
|
+
import React32, { useState as useState20 } from "react";
|
|
2765
|
+
import { HugeiconsIcon as HugeiconsIcon19 } from "@hugeicons/react";
|
|
2689
2766
|
import { Loading03Icon as Loading03Icon8 } from "@hugeicons/core-free-icons";
|
|
2690
|
-
var PageSpinner4 = () => /* @__PURE__ */
|
|
2767
|
+
var PageSpinner4 = () => /* @__PURE__ */ React32.createElement("div", { className: "flex justify-center items-center py-20" }, /* @__PURE__ */ React32.createElement(HugeiconsIcon19, { icon: Loading03Icon8, size: 32, className: "animate-spin text-neutral-400" }));
|
|
2691
2768
|
var formatDate2 = (dateString) => {
|
|
2692
2769
|
if (!dateString) return "N/A";
|
|
2693
2770
|
return new Date(dateString).toLocaleDateString("en-US", {
|
|
@@ -2706,8 +2783,8 @@ var UniversalCheckoutView = ({
|
|
|
2706
2783
|
onPayInvoice,
|
|
2707
2784
|
onBackClick
|
|
2708
2785
|
}) => {
|
|
2709
|
-
const [isPaying, setIsPaying] =
|
|
2710
|
-
const [localStatus, setLocalStatus] =
|
|
2786
|
+
const [isPaying, setIsPaying] = useState20(false);
|
|
2787
|
+
const [localStatus, setLocalStatus] = useState20(null);
|
|
2711
2788
|
const handlePayment = async () => {
|
|
2712
2789
|
if (!invoice || isReadOnly || isPaying) return;
|
|
2713
2790
|
setIsPaying(true);
|
|
@@ -2721,7 +2798,7 @@ var UniversalCheckoutView = ({
|
|
|
2721
2798
|
}
|
|
2722
2799
|
};
|
|
2723
2800
|
const displayStatus = localStatus || invoice?.status;
|
|
2724
|
-
return /* @__PURE__ */
|
|
2801
|
+
return /* @__PURE__ */ React32.createElement("div", { className: "flex max-w-5xl rounded-2xl bg-white p-6 sm:p-8 flex-col gap-6 animate-in fade-in duration-300 mx-auto w-full border border-neutral-100" }, /* @__PURE__ */ React32.createElement(ManagedToaster, null), isLoading ? /* @__PURE__ */ React32.createElement(PageSpinner4, null) : !invoice ? /* @__PURE__ */ React32.createElement("div", { className: "py-12 text-center text-sm text-neutral-500" }, "Invoice not found or could not be loaded.") : /* @__PURE__ */ React32.createElement("div", { className: "flex flex-col gap-8 w-full animate-in fade-in duration-300" }, /* @__PURE__ */ React32.createElement("div", null, /* @__PURE__ */ React32.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-1 " }, "Checkout Summary"), /* @__PURE__ */ React32.createElement("h2", { className: "text-lg text-black mb-1" }, invoice.name), /* @__PURE__ */ React32.createElement("p", { className: "text-xs text-neutral-500" }, "Generated on ", formatDate2(invoice.createdAt))), /* @__PURE__ */ React32.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6" }, /* @__PURE__ */ React32.createElement("div", null, /* @__PURE__ */ React32.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-1 " }, "Amount Due"), /* @__PURE__ */ React32.createElement("p", { className: "text-xl text-black" }, formatUsd2(invoice.amountDue))), /* @__PURE__ */ React32.createElement("div", null, /* @__PURE__ */ React32.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-1 " }, "Status"), /* @__PURE__ */ React32.createElement("span", { className: `text-[11px] tracking-widest px-3 py-1 mt-1 inline-block rounded-full ${displayStatus === "PAID" ? "bg-emerald-100 text-emerald-700" : "bg-neutral-100 text-neutral-700"}` }, displayStatus)), /* @__PURE__ */ React32.createElement("div", { className: "md:col-span-2 pt-4 border-t border-neutral-200/60 mt-2" }, /* @__PURE__ */ React32.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-1 " }, "Reference ID"), /* @__PURE__ */ React32.createElement("p", { className: "text-xs text-neutral-500 inline-block" }, invoice.invoiceNumber))), /* @__PURE__ */ React32.createElement("div", { className: "flex flex-col sm:flex-row sm:items-center justify-end gap-4 pt-4" }, (displayStatus === "ISSUED" || displayStatus === "OVERDUE") && /* @__PURE__ */ React32.createElement("div", { className: "flex flex-col items-end gap-2 w-full sm:w-auto" }, /* @__PURE__ */ React32.createElement(
|
|
2725
2802
|
ThreeDActionButton,
|
|
2726
2803
|
{
|
|
2727
2804
|
onClick: handlePayment,
|
|
@@ -2730,12 +2807,12 @@ var UniversalCheckoutView = ({
|
|
|
2730
2807
|
className: "w-full sm:w-auto"
|
|
2731
2808
|
},
|
|
2732
2809
|
"Pay Invoice"
|
|
2733
|
-
)), displayStatus === "PAID" && /* @__PURE__ */
|
|
2810
|
+
)), displayStatus === "PAID" && /* @__PURE__ */ React32.createElement("span", { className: "text-[12px] tracking-widest text-emerald-600 px-6 py-3 bg-emerald-50 rounded-full w-full sm:w-auto text-center" }, "Payment Successful"))));
|
|
2734
2811
|
};
|
|
2735
2812
|
|
|
2736
2813
|
// src/components/UniversalDashboardPage.tsx
|
|
2737
|
-
import
|
|
2738
|
-
import { HugeiconsIcon as
|
|
2814
|
+
import React33, { useState as useState21 } from "react";
|
|
2815
|
+
import { HugeiconsIcon as HugeiconsIcon20 } from "@hugeicons/react";
|
|
2739
2816
|
import { ArrowDown01Icon as ArrowDown01Icon3, Loading03Icon as Loading03Icon9 } from "@hugeicons/core-free-icons";
|
|
2740
2817
|
var UniversalDashboardPage = ({
|
|
2741
2818
|
headerTitle,
|
|
@@ -2747,20 +2824,20 @@ var UniversalDashboardPage = ({
|
|
|
2747
2824
|
lists,
|
|
2748
2825
|
isLoading = false
|
|
2749
2826
|
}) => {
|
|
2750
|
-
const [isTimeframeModalOpen, setIsTimeframeModalOpen] =
|
|
2827
|
+
const [isTimeframeModalOpen, setIsTimeframeModalOpen] = useState21(false);
|
|
2751
2828
|
const selectedTimeframe = timeframes.find((t) => t.id === activeTimeframe) || timeframes[0];
|
|
2752
2829
|
if (isLoading) {
|
|
2753
|
-
return /* @__PURE__ */
|
|
2830
|
+
return /* @__PURE__ */ React33.createElement("div", { className: "flex justify-center items-center py-12" }, /* @__PURE__ */ React33.createElement(HugeiconsIcon20, { icon: Loading03Icon9, size: 32, className: "animate-spin mb-4 text-black" }));
|
|
2754
2831
|
}
|
|
2755
|
-
return /* @__PURE__ */
|
|
2832
|
+
return /* @__PURE__ */ React33.createElement("div", { className: "flex flex-col gap-8 animate-in fade-in duration-300 pb-10" }, /* @__PURE__ */ React33.createElement(ManagedToaster, null), /* @__PURE__ */ React33.createElement("div", { className: "flex flex-col sm:flex-row items-start sm:items-center justify-between gap-4" }, /* @__PURE__ */ React33.createElement("div", null, /* @__PURE__ */ React33.createElement("h1", { className: " gradient-text text-xl mb-1 tracking-tight" }, headerTitle), /* @__PURE__ */ React33.createElement("p", { className: "text-xs text-neutral-500" }, headerDescription)), timeframes.length > 0 && selectedTimeframe && onTimeframeChange && /* @__PURE__ */ React33.createElement(
|
|
2756
2833
|
"button",
|
|
2757
2834
|
{
|
|
2758
2835
|
onClick: () => setIsTimeframeModalOpen(true),
|
|
2759
2836
|
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"
|
|
2760
2837
|
},
|
|
2761
|
-
/* @__PURE__ */
|
|
2762
|
-
/* @__PURE__ */
|
|
2763
|
-
)), stats.length > 0 && /* @__PURE__ */
|
|
2838
|
+
/* @__PURE__ */ React33.createElement("span", null, selectedTimeframe.label),
|
|
2839
|
+
/* @__PURE__ */ React33.createElement(HugeiconsIcon20, { icon: ArrowDown01Icon3, size: 14, className: "text-neutral-400" })
|
|
2840
|
+
)), stats.length > 0 && /* @__PURE__ */ React33.createElement("div", { className: "w-full rounded-2xl overflow-hidden bg-white" }, /* @__PURE__ */ React33.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__ */ React33.createElement("div", { key: idx, className: "p-6 flex flex-col gap-1 min-w-0" }, /* @__PURE__ */ React33.createElement("p", { className: "text-[11px] tracking-[0.2em] text-neutral-400 truncate " }, stat.label), /* @__PURE__ */ React33.createElement("p", { className: `text-xl tracking-tight truncate ${stat.valueClass || "text-black"}` }, stat.value))))), lists.length > 0 && /* @__PURE__ */ React33.createElement("div", { className: "flex flex-col gap-8 w-full max-w-4xl" }, lists.map((list, idx) => /* @__PURE__ */ React33.createElement("div", { key: idx, className: "bg-white rounded-2xl p-6 flex flex-col min-w-0" }, /* @__PURE__ */ React33.createElement("div", { className: "flex items-center gap-3 mb-6" }, /* @__PURE__ */ React33.createElement("div", { className: "text-neutral-400" }, list.icon), /* @__PURE__ */ React33.createElement("h2", { className: " text-[11px] text-black tracking-[0.2em] " }, list.title)), /* @__PURE__ */ React33.createElement("div", { className: "divide-y divide-neutral-100 flex-1 overflow-y-auto" }, list.items.length === 0 ? /* @__PURE__ */ React33.createElement("p", { className: "text-xs text-neutral-500 py-4" }, list.emptyMessage) : list.items.map((item) => /* @__PURE__ */ React33.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__ */ React33.createElement("div", { className: "min-w-0 flex-1" }, /* @__PURE__ */ React33.createElement("p", { className: "text-sm text-black truncate pr-4" }, item.primaryText), /* @__PURE__ */ React33.createElement("p", { className: "text-[11px] text-neutral-500 truncate tracking-widest mt-0.5" }, item.secondaryText)), /* @__PURE__ */ React33.createElement("div", { className: "flex items-center gap-4 shrink-0 pl-4" }, item.rightText && /* @__PURE__ */ React33.createElement("p", { className: "text-xs text-black" }, item.rightText), item.rightBadge && /* @__PURE__ */ React33.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__ */ React33.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ React33.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: () => setIsTimeframeModalOpen(false) }), /* @__PURE__ */ React33.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__ */ React33.createElement("div", { className: "p-6 text-center w-full" }, /* @__PURE__ */ React33.createElement("h3", { className: " text-[14px] text-black tracking-tight" }, "Select Timeframe")), /* @__PURE__ */ React33.createElement("div", { className: "w-full flex flex-col pl-2 pr-2 pb-2" }, timeframes.map((tf) => /* @__PURE__ */ React33.createElement(
|
|
2764
2841
|
"button",
|
|
2765
2842
|
{
|
|
2766
2843
|
key: tf.id,
|
|
@@ -2770,9 +2847,9 @@ var UniversalDashboardPage = ({
|
|
|
2770
2847
|
},
|
|
2771
2848
|
className: `text-left px-4 py-3 text-[11px] 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"}`
|
|
2772
2849
|
},
|
|
2773
|
-
/* @__PURE__ */
|
|
2774
|
-
activeTimeframe === tf.id && /* @__PURE__ */
|
|
2775
|
-
))), /* @__PURE__ */
|
|
2850
|
+
/* @__PURE__ */ React33.createElement("span", { className: "truncate pr-2" }, tf.label),
|
|
2851
|
+
activeTimeframe === tf.id && /* @__PURE__ */ React33.createElement("div", null)
|
|
2852
|
+
))), /* @__PURE__ */ React33.createElement("div", { className: "w-full flex border-t border-neutral-50" }, /* @__PURE__ */ React33.createElement(
|
|
2776
2853
|
"button",
|
|
2777
2854
|
{
|
|
2778
2855
|
onClick: () => setIsTimeframeModalOpen(false),
|
|
@@ -2783,14 +2860,14 @@ var UniversalDashboardPage = ({
|
|
|
2783
2860
|
};
|
|
2784
2861
|
|
|
2785
2862
|
// src/components/UniversalAgentConsole.tsx
|
|
2786
|
-
import
|
|
2787
|
-
import { HugeiconsIcon as
|
|
2863
|
+
import React34, { useState as useState22, useRef as useRef10 } from "react";
|
|
2864
|
+
import { HugeiconsIcon as HugeiconsIcon21 } from "@hugeicons/react";
|
|
2788
2865
|
import {
|
|
2789
2866
|
ArrowLeft01Icon as ArrowLeft01Icon6,
|
|
2790
2867
|
ArrowRight01Icon as ArrowRight01Icon5,
|
|
2791
2868
|
Loading03Icon as Loading03Icon10,
|
|
2792
2869
|
AttachmentIcon,
|
|
2793
|
-
Cancel01Icon,
|
|
2870
|
+
Cancel01Icon as Cancel01Icon2,
|
|
2794
2871
|
Upload01Icon,
|
|
2795
2872
|
Download01Icon,
|
|
2796
2873
|
ArrowDown01Icon as ArrowDown01Icon4,
|
|
@@ -2826,12 +2903,12 @@ var UniversalAgentConsole = ({
|
|
|
2826
2903
|
onDeleteArchive
|
|
2827
2904
|
}) => {
|
|
2828
2905
|
const archiveRef = useRef10(null);
|
|
2829
|
-
const [pendingFiles, setPendingFiles] =
|
|
2830
|
-
const [isUploading, setIsUploading] =
|
|
2831
|
-
const [isActioning, setIsActioning] =
|
|
2832
|
-
const [actionModal, setActionModal] =
|
|
2833
|
-
const [actionMessage, setActionMessage] =
|
|
2834
|
-
const [archiveToDelete, setArchiveToDelete] =
|
|
2906
|
+
const [pendingFiles, setPendingFiles] = useState22([]);
|
|
2907
|
+
const [isUploading, setIsUploading] = useState22(false);
|
|
2908
|
+
const [isActioning, setIsActioning] = useState22(false);
|
|
2909
|
+
const [actionModal, setActionModal] = useState22(null);
|
|
2910
|
+
const [actionMessage, setActionMessage] = useState22("");
|
|
2911
|
+
const [archiveToDelete, setArchiveToDelete] = useState22(null);
|
|
2835
2912
|
const handleFileSelect = (e) => {
|
|
2836
2913
|
if (e.target.files && e.target.files.length > 0) {
|
|
2837
2914
|
setPendingFiles((prev) => [...prev, ...Array.from(e.target.files)]);
|
|
@@ -2857,36 +2934,36 @@ var UniversalAgentConsole = ({
|
|
|
2857
2934
|
}
|
|
2858
2935
|
};
|
|
2859
2936
|
const DynamicArrayAccordion = ({ items, parentKey }) => {
|
|
2860
|
-
const [activeFAQ, setActiveFAQ] =
|
|
2861
|
-
return /* @__PURE__ */
|
|
2937
|
+
const [activeFAQ, setActiveFAQ] = useState22(null);
|
|
2938
|
+
return /* @__PURE__ */ React34.createElement("div", { className: "flex flex-col relative z-10 bg-transparent w-full mt-2 border-t border-neutral-100" }, items.map((item, index) => {
|
|
2862
2939
|
const isOpen = activeFAQ === index;
|
|
2863
2940
|
let label = `${parentKey ? formatKeyName(parentKey) : "Item"} ${index + 1}`;
|
|
2864
2941
|
if (item.fullName) label = toTitleCaseSafe(item.fullName);
|
|
2865
2942
|
else if (item.role) label = item.role;
|
|
2866
2943
|
else if (item.proposedName) label = toTitleCaseSafe(item.proposedName);
|
|
2867
|
-
return /* @__PURE__ */
|
|
2944
|
+
return /* @__PURE__ */ React34.createElement("div", { key: index, className: `transition-all duration-300 ${index !== items.length - 1 ? "border-b border-neutral-100" : ""}` }, /* @__PURE__ */ React34.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__ */ React34.createElement("span", { className: `text-[13px] md:text-[14px] transition-colors ${isOpen ? "text-black" : "text-neutral-700 group-hover:text-black"}` }, label), /* @__PURE__ */ React34.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__ */ React34.createElement(HugeiconsIcon21, { icon: ArrowDown01Icon4, size: 16 }))), /* @__PURE__ */ React34.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__ */ React34.createElement("div", { className: "overflow-hidden" }, /* @__PURE__ */ React34.createElement("div", { className: "pt-2 flex flex-col gap-3 pr-4 md:pr-12" }, renderDynamicObject(item)))));
|
|
2868
2945
|
}));
|
|
2869
2946
|
};
|
|
2870
2947
|
const renderValue = (key, value) => {
|
|
2871
2948
|
if (value === null || value === void 0 || value === "") return null;
|
|
2872
2949
|
if (typeof value === "string") {
|
|
2873
|
-
if (value.startsWith("http") || value.startsWith("data:image")) return /* @__PURE__ */
|
|
2874
|
-
if (key.toLowerCase().includes("name") && !value.includes("@")) return /* @__PURE__ */
|
|
2875
|
-
return /* @__PURE__ */
|
|
2950
|
+
if (value.startsWith("http") || value.startsWith("data:image")) return /* @__PURE__ */ React34.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__ */ React34.createElement(HugeiconsIcon21, { icon: Download01Icon, size: 14 }), " Download File");
|
|
2951
|
+
if (key.toLowerCase().includes("name") && !value.includes("@")) return /* @__PURE__ */ React34.createElement("p", { className: "text-[11px] md:text-[13px] leading-[1.8] text-neutral-600" }, toTitleCaseSafe(value));
|
|
2952
|
+
return /* @__PURE__ */ React34.createElement("p", { className: "text-[11px] md:text-[13px] leading-[1.8] text-neutral-600" }, value);
|
|
2876
2953
|
}
|
|
2877
2954
|
if (Array.isArray(value)) {
|
|
2878
2955
|
const validItems = value.filter((item) => item !== null && item !== void 0 && item !== "");
|
|
2879
2956
|
if (validItems.length === 0) return null;
|
|
2880
|
-
if (typeof validItems[0] === "string") return /* @__PURE__ */
|
|
2881
|
-
return /* @__PURE__ */
|
|
2957
|
+
if (typeof validItems[0] === "string") return /* @__PURE__ */ React34.createElement("ul", { className: "list-disc pl-4 mt-1" }, validItems.map((v, i) => /* @__PURE__ */ React34.createElement("li", { key: i, className: "text-[11px] md:text-[13px] leading-[1.8] text-neutral-600" }, toTitleCaseSafe(v))));
|
|
2958
|
+
return /* @__PURE__ */ React34.createElement(DynamicArrayAccordion, { items: validItems, parentKey: key });
|
|
2882
2959
|
}
|
|
2883
2960
|
if (typeof value === "object") {
|
|
2884
2961
|
if (Object.keys(value).length === 0) return null;
|
|
2885
2962
|
const renderedObj = renderDynamicObject(value);
|
|
2886
2963
|
if (!renderedObj || Array.isArray(renderedObj) && renderedObj.length === 0) return null;
|
|
2887
|
-
return /* @__PURE__ */
|
|
2964
|
+
return /* @__PURE__ */ React34.createElement("div", { className: "flex flex-col gap-3 mt-1 w-full border-l border-neutral-100 pl-4 py-2" }, renderedObj);
|
|
2888
2965
|
}
|
|
2889
|
-
return /* @__PURE__ */
|
|
2966
|
+
return /* @__PURE__ */ React34.createElement("span", { className: "text-sm text-black" }, String(value));
|
|
2890
2967
|
};
|
|
2891
2968
|
const renderDynamicObject = (obj) => {
|
|
2892
2969
|
if (!obj) return null;
|
|
@@ -2897,22 +2974,22 @@ var UniversalAgentConsole = ({
|
|
|
2897
2974
|
return true;
|
|
2898
2975
|
});
|
|
2899
2976
|
if (entries.length === 0) return null;
|
|
2900
|
-
return entries.map(([k, v]) => /* @__PURE__ */
|
|
2977
|
+
return entries.map(([k, v]) => /* @__PURE__ */ React34.createElement("div", { key: k, className: "flex flex-col items-start min-w-0 wrap-break-word w-full mb-3 last:mb-0" }, /* @__PURE__ */ React34.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 mb-1 " }, formatKeyName(k)), renderValue(k, v)));
|
|
2901
2978
|
};
|
|
2902
|
-
return /* @__PURE__ */
|
|
2979
|
+
return /* @__PURE__ */ React34.createElement("div", { className: "flex flex-col gap-8 animate-in fade-in duration-300 pb-10" }, /* @__PURE__ */ React34.createElement(ManagedToaster, null), currentView === "list" && /* @__PURE__ */ React34.createElement(React34.Fragment, null, /* @__PURE__ */ React34.createElement("div", { className: "flex flex-col items-start gap-1" }, /* @__PURE__ */ React34.createElement("h1", { className: " text-xl text-black tracking-tight" }, headerTitle), /* @__PURE__ */ React34.createElement("p", { className: "text-sm text-neutral-500" }, headerDescription)), stats.length > 0 && /* @__PURE__ */ React34.createElement("div", { className: "w-full rounded-2xl max-w-5xl overflow-hidden bg-white" }, /* @__PURE__ */ React34.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__ */ React34.createElement("div", { key: idx, className: "p-6 flex items-center gap-4 hover:bg-neutral-50/50 transition-colors min-w-0" }, /* @__PURE__ */ React34.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__ */ React34.createElement("div", { className: "min-w-0 flex-1" }, /* @__PURE__ */ React34.createElement("p", { className: "text-[11px] tracking-[0.2em] text-neutral-400 mb-1 truncate " }, stat.label), /* @__PURE__ */ React34.createElement("p", { className: "text-xl text-black tracking-tight truncate" }, stat.value)))))), tabs.length > 0 && /* @__PURE__ */ React34.createElement("div", { className: "flex items-center gap-6" }, tabs.map((tab) => /* @__PURE__ */ React34.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__ */ React34.createElement("div", { className: "w-full bg-white rounded-2xl max-w-5xl overflow-hidden flex flex-col min-h-100" }, isLoadingList ? /* @__PURE__ */ React34.createElement("div", { className: "flex justify-center items-center py-12" }, /* @__PURE__ */ React34.createElement(HugeiconsIcon21, { icon: Loading03Icon10, size: 32, className: "animate-spin text-black" })) : listData.length === 0 ? /* @__PURE__ */ React34.createElement(React34.Fragment, null, /* @__PURE__ */ React34.createElement("div", { className: "flex-1 flex justify-center items-center text-neutral-500 text-sm py-20" }, "No matching applications found.")) : /* @__PURE__ */ React34.createElement(React34.Fragment, null, /* @__PURE__ */ React34.createElement("div", { className: "divide-y divide-neutral-100 flex-1" }, listData.map((item) => /* @__PURE__ */ React34.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__ */ React34.createElement("div", { className: "min-w-0 flex-1" }, /* @__PURE__ */ React34.createElement("p", { className: "text-sm text-black truncate pr-4" }, item.title), /* @__PURE__ */ React34.createElement("p", { className: "text-xs text-neutral-500 truncate mt-1" }, item.subtitle)), /* @__PURE__ */ React34.createElement("div", { className: "flex flex-col items-end gap-1 shrink-0 pl-4" }, /* @__PURE__ */ React34.createElement("span", { className: `text-[11px] tracking-widest px-3 py-1 rounded-full ${item.status === "COMPLETED" ? "bg-emerald-50 text-emerald-600" : "bg-neutral-50 text-neutral-600"}` }, item.status.replace(/_/g, " ")), /* @__PURE__ */ React34.createElement("span", { className: "text-[11px] text-neutral-400 mt-1" }, item.date))))), totalPages > 1 && /* @__PURE__ */ React34.createElement("div", { className: "flex items-center justify-between p-5 bg-neutral-50/50" }, /* @__PURE__ */ React34.createElement("span", { className: "text-[11px] text-neutral-400 tracking-[0.2em]" }, "Page ", currentPage, " of ", totalPages), /* @__PURE__ */ React34.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ React34.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__ */ React34.createElement(HugeiconsIcon21, { icon: ArrowLeft01Icon6, size: 14 })), /* @__PURE__ */ React34.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__ */ React34.createElement(HugeiconsIcon21, { icon: ArrowRight01Icon5, size: 14 }))))))), currentView === "details" && selectedApp && /* @__PURE__ */ React34.createElement("div", { className: "w-full bg-white rounded-2xl p-6 sm:p-10 animate-in fade-in duration-300 max-w-5xl flex flex-col" }, /* @__PURE__ */ React34.createElement("div", { className: "flex items-center justify-between gap-4 pb-6" }, /* @__PURE__ */ React34.createElement("button", { onClick: () => {
|
|
2903
2980
|
onBackToList();
|
|
2904
2981
|
setPendingFiles([]);
|
|
2905
|
-
}, className: "flex items-center gap-2 text-[11px] text-neutral-400 hover:text-black tracking-widest transition-colors outline-none " }, /* @__PURE__ */
|
|
2982
|
+
}, className: "flex items-center gap-2 text-[11px] text-neutral-400 hover:text-black tracking-widest transition-colors outline-none " }, /* @__PURE__ */ React34.createElement(HugeiconsIcon21, { icon: ArrowLeft01Icon6, size: 14 }), " Back to List"), /* @__PURE__ */ React34.createElement("span", { className: `text-[11px] tracking-widest px-4 py-1.5 rounded-full ${selectedApp.status === "COMPLETED" ? "bg-emerald-50 text-emerald-600" : "bg-neutral-50 text-neutral-600"}` }, selectedApp.status.replace(/_/g, " "))), /* @__PURE__ */ React34.createElement("div", { className: "flex flex-col gap-2 mb-8" }, /* @__PURE__ */ React34.createElement("h2", { className: " text-xl text-black tracking-tight" }, selectedApp.name || selectedApp.title), /* @__PURE__ */ React34.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__ */ React34.createElement("div", { className: "flex flex-col gap-5" }, renderDynamicObject(selectedApp.metadata)) : selectedApp.agentId === currentAgentId ? /* @__PURE__ */ React34.createElement("div", { className: "flex flex-col gap-5" }, /* @__PURE__ */ React34.createElement("p", { className: "text-sm text-neutral-500" }, "No application data extracted.")) : null, selectedApp.agentId && /* @__PURE__ */ React34.createElement("div", { className: "flex flex-col gap-4 pt-8 mt-4 border-t border-neutral-100" }, /* @__PURE__ */ React34.createElement("div", { className: "flex flex-col gap-1 mb-4" }, /* @__PURE__ */ React34.createElement("h3", { className: " text-sm text-black" }, "Official Archives"), /* @__PURE__ */ React34.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__ */ React34.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__ */ React34.createElement("div", { className: "flex items-center gap-3 min-w-0" }, /* @__PURE__ */ React34.createElement(HugeiconsIcon21, { icon: File02Icon, size: 18, className: "shrink-0" }), /* @__PURE__ */ React34.createElement("span", { className: "truncate pr-2" }, arch.name)), /* @__PURE__ */ React34.createElement("button", { onClick: () => setArchiveToDelete(arch), className: "text-emerald-700 hover:text-red-500 transition-colors p-1 outline-none shrink-0" }, /* @__PURE__ */ React34.createElement(HugeiconsIcon21, { icon: Delete02Icon, size: 16 })))), pendingFiles.map((file, idx) => /* @__PURE__ */ React34.createElement("div", { key: idx, className: "flex items-center justify-between text-neutral-600 text-sm w-full" }, /* @__PURE__ */ React34.createElement("div", { className: "flex items-center gap-3 min-w-0" }, /* @__PURE__ */ React34.createElement(HugeiconsIcon21, { icon: AttachmentIcon, size: 18, className: "shrink-0" }), /* @__PURE__ */ React34.createElement("span", { className: "truncate pr-2" }, file.name)), /* @__PURE__ */ React34.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__ */ React34.createElement(HugeiconsIcon21, { icon: Cancel01Icon2, size: 16 })))), /* @__PURE__ */ React34.createElement("input", { type: "file", multiple: true, ref: archiveRef, onChange: handleFileSelect, className: "hidden", accept: "application/pdf,image/*" }), /* @__PURE__ */ React34.createElement("div", { className: "flex flex-col sm:flex-row items-center gap-3 w-full" }, /* @__PURE__ */ React34.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__ */ React34.createElement(HugeiconsIcon21, { icon: Upload01Icon, size: 18, className: "text-neutral-400" }), " Select Files to Upload"), pendingFiles.length > 0 && /* @__PURE__ */ React34.createElement("div", { className: "flex flex-col sm:flex-row items-center gap-3 w-full sm:w-auto shrink-0" }, /* @__PURE__ */ React34.createElement("button", { onClick: () => setPendingFiles([]), disabled: isUploading, className: "px-6 py-2 text-neutral-600 text-[11px] tracking-widest rounded-full hover:bg-neutral-100 outline-none w-full sm:w-auto " }, "Clear All"), /* @__PURE__ */ React34.createElement(ThreeDActionButton, { onClick: executeUpload, disabled: isUploading, isLoading: isUploading, className: "w-full sm:w-auto" }, "Upload ", pendingFiles.length, " File(s)")))), /* @__PURE__ */ React34.createElement("div", { className: "flex flex-col sm:flex-row items-center justify-between gap-4 mt-8 pt-6" }, !selectedApp.agentId ? /* @__PURE__ */ React34.createElement(ThreeDActionButton, { onClick: async () => {
|
|
2906
2983
|
setIsActioning(true);
|
|
2907
2984
|
await onAcceptApplication(selectedApp.id);
|
|
2908
2985
|
setIsActioning(false);
|
|
2909
|
-
}, disabled: isActioning, isLoading: isActioning, className: "w-full sm:w-auto" }, "Accept Application") : selectedApp.agentId !== currentAgentId ? /* @__PURE__ */
|
|
2986
|
+
}, disabled: isActioning, isLoading: isActioning, className: "w-full sm:w-auto" }, "Accept Application") : selectedApp.agentId !== currentAgentId ? /* @__PURE__ */ React34.createElement("div", { className: "w-full p-4 border border-red-100 bg-red-50/30 rounded-xl flex items-start gap-3" }, /* @__PURE__ */ React34.createElement(HugeiconsIcon21, { icon: Cancel01Icon2, size: 16, className: "text-red-500 shrink-0 mt-0.5" }), /* @__PURE__ */ React34.createElement("div", null, /* @__PURE__ */ React34.createElement("p", { className: "text-sm text-red-700" }, "Application Taken"), /* @__PURE__ */ React34.createElement("p", { className: "text-xs text-red-600 mt-1" }, "Currently handled by ", selectedApp.agentName || "another agent", "."))) : /* @__PURE__ */ React34.createElement("div", { className: "w-full flex flex-col sm:flex-row items-center gap-4 justify-between" }, /* @__PURE__ */ React34.createElement("p", { className: "text-xs text-neutral-500" }, "You are the assigned agent."), /* @__PURE__ */ React34.createElement("div", { className: "flex flex-col sm:flex-row items-center justify-end gap-3 w-full sm:w-auto" }, /* @__PURE__ */ React34.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 " }, "Query"), /* @__PURE__ */ React34.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 " }, "Reject"), /* @__PURE__ */ React34.createElement(ThreeDActionButton, { onClick: () => setActionModal("success"), disabled: selectedApp.status === "COMPLETED", className: "w-full sm:w-auto" }, "Mark Success"))))), actionModal && /* @__PURE__ */ React34.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ React34.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: () => !isActioning && setActionModal(null) }), /* @__PURE__ */ React34.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__ */ React34.createElement("div", { className: "p-6" }, /* @__PURE__ */ React34.createElement("h3", { className: " text-lg text-black tracking-tight capitalize mb-2" }, actionModal === "success" ? "Complete Application" : `${actionModal} Application`), /* @__PURE__ */ React34.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__ */ React34.createElement("div", { className: "p-6 pb-2" }, /* @__PURE__ */ React34.createElement(TextInput, { label: "Reason for Action", value: actionMessage, onChange: setActionMessage, placeholder: "Enter your reason here...", disabled: isActioning })), /* @__PURE__ */ React34.createElement("div", { className: "flex items-center p-6 pt-4 gap-3" }, /* @__PURE__ */ React34.createElement("button", { onClick: () => setActionModal(null), disabled: isActioning, className: "flex-1 py-3 text-[11px] tracking-widest text-neutral-600 rounded-full hover:bg-neutral-50 transition-colors outline-none disabled:opacity-50" }, "Cancel"), /* @__PURE__ */ React34.createElement(ThreeDActionButton, { onClick: async () => {
|
|
2910
2987
|
setIsActioning(true);
|
|
2911
2988
|
await onUpdateStatus(selectedApp.id, actionModal === "success" ? "COMPLETED" : actionModal === "reject" ? "REJECTED" : "QUEUED", actionMessage);
|
|
2912
2989
|
setIsActioning(false);
|
|
2913
2990
|
setActionModal(null);
|
|
2914
2991
|
setActionMessage("");
|
|
2915
|
-
}, disabled: isActioning || (actionModal === "query" || actionModal === "reject") && actionMessage.trim().length < 5, isLoading: isActioning, className: "flex-1" }, "Confirm ", actionModal)))), archiveToDelete && /* @__PURE__ */
|
|
2992
|
+
}, disabled: isActioning || (actionModal === "query" || actionModal === "reject") && actionMessage.trim().length < 5, isLoading: isActioning, className: "flex-1" }, "Confirm ", actionModal)))), archiveToDelete && /* @__PURE__ */ React34.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ React34.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: () => !isActioning && setArchiveToDelete(null) }), /* @__PURE__ */ React34.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__ */ React34.createElement("div", { className: "p-6" }, /* @__PURE__ */ React34.createElement("h3", { className: " text-lg text-black tracking-tight mb-2" }, "Delete Document?"), /* @__PURE__ */ React34.createElement("p", { className: "text-xs text-neutral-500" }, 'Are you sure you want to permanently delete "', archiveToDelete.name, '"?')), /* @__PURE__ */ React34.createElement("div", { className: "flex items-center p-6 gap-3" }, /* @__PURE__ */ React34.createElement("button", { onClick: () => setArchiveToDelete(null), disabled: isActioning, className: "flex-1 py-3 text-[11px] tracking-widest text-neutral-600 rounded-full hover:bg-neutral-50 transition-colors outline-none disabled:opacity-50" }, "Cancel"), /* @__PURE__ */ React34.createElement(ThreeDActionButton, { onClick: async () => {
|
|
2916
2993
|
setIsActioning(true);
|
|
2917
2994
|
await onDeleteArchive(selectedApp.id, archiveToDelete.id);
|
|
2918
2995
|
setIsActioning(false);
|
|
@@ -2922,71 +2999,6 @@ var UniversalAgentConsole = ({
|
|
|
2922
2999
|
|
|
2923
3000
|
// src/components/UniversalOverviewPage.tsx
|
|
2924
3001
|
import React35 from "react";
|
|
2925
|
-
|
|
2926
|
-
// src/components/Banner.tsx
|
|
2927
|
-
import React34, { useState as useState22 } from "react";
|
|
2928
|
-
import { HugeiconsIcon as HugeiconsIcon21 } from "@hugeicons/react";
|
|
2929
|
-
import {
|
|
2930
|
-
Alert02Icon,
|
|
2931
|
-
CheckmarkBadge01Icon,
|
|
2932
|
-
InformationCircleIcon,
|
|
2933
|
-
Cancel01Icon as Cancel01Icon2
|
|
2934
|
-
} from "@hugeicons/core-free-icons";
|
|
2935
|
-
var Banner = ({
|
|
2936
|
-
title,
|
|
2937
|
-
message,
|
|
2938
|
-
type,
|
|
2939
|
-
icon,
|
|
2940
|
-
isDismissible = true,
|
|
2941
|
-
onDismiss,
|
|
2942
|
-
action
|
|
2943
|
-
}) => {
|
|
2944
|
-
const [isVisible, setIsVisible] = useState22(true);
|
|
2945
|
-
if (!isVisible) return null;
|
|
2946
|
-
const handleDismiss = () => {
|
|
2947
|
-
setIsVisible(false);
|
|
2948
|
-
if (onDismiss) onDismiss();
|
|
2949
|
-
};
|
|
2950
|
-
const config = {
|
|
2951
|
-
success: {
|
|
2952
|
-
bg: "bg-emerald-50",
|
|
2953
|
-
iconColor: "text-emerald-600",
|
|
2954
|
-
titleColor: "text-emerald-900",
|
|
2955
|
-
msgColor: "text-emerald-700",
|
|
2956
|
-
defaultIcon: CheckmarkBadge01Icon,
|
|
2957
|
-
closeHover: "hover:bg-emerald-100 text-emerald-500"
|
|
2958
|
-
},
|
|
2959
|
-
warning: {
|
|
2960
|
-
bg: "bg-amber-50",
|
|
2961
|
-
iconColor: "text-amber-600",
|
|
2962
|
-
titleColor: "text-amber-900",
|
|
2963
|
-
msgColor: "text-amber-700",
|
|
2964
|
-
defaultIcon: InformationCircleIcon,
|
|
2965
|
-
closeHover: "hover:bg-amber-100 text-amber-500"
|
|
2966
|
-
},
|
|
2967
|
-
alert: {
|
|
2968
|
-
bg: "bg-red-50",
|
|
2969
|
-
iconColor: "text-red-600",
|
|
2970
|
-
titleColor: "text-red-900",
|
|
2971
|
-
msgColor: "text-red-700",
|
|
2972
|
-
defaultIcon: Alert02Icon,
|
|
2973
|
-
closeHover: "hover:bg-red-100 text-red-500"
|
|
2974
|
-
}
|
|
2975
|
-
};
|
|
2976
|
-
const currentConfig = config[type];
|
|
2977
|
-
const IconToUse = icon || currentConfig.defaultIcon;
|
|
2978
|
-
return /* @__PURE__ */ React34.createElement("div", { className: `relative w-full rounded-2xl p-4 flex items-start gap-4 transition-all duration-300 animate-in fade-in slide-in-from-top-2 ${currentConfig.bg}` }, /* @__PURE__ */ React34.createElement("div", { className: `shrink-0 mt-0.5 ${currentConfig.iconColor}` }, /* @__PURE__ */ React34.createElement(HugeiconsIcon21, { icon: IconToUse, size: 20 })), /* @__PURE__ */ React34.createElement("div", { className: "flex-1 flex flex-col min-w-0 pr-6" }, /* @__PURE__ */ React34.createElement("h4", { className: `text-sm tracking-tight mb-1 ${currentConfig.titleColor}` }, title), /* @__PURE__ */ React34.createElement("p", { className: `text-xs leading-relaxed ${currentConfig.msgColor}` }, message), action && /* @__PURE__ */ React34.createElement("div", { className: "mt-3" }, action)), isDismissible && /* @__PURE__ */ React34.createElement(
|
|
2979
|
-
"button",
|
|
2980
|
-
{
|
|
2981
|
-
onClick: handleDismiss,
|
|
2982
|
-
className: `absolute top-3 right-3 p-1.5 rounded-full transition-colors outline-none shrink-0 ${currentConfig.closeHover}`,
|
|
2983
|
-
"aria-label": "Dismiss banner"
|
|
2984
|
-
},
|
|
2985
|
-
/* @__PURE__ */ React34.createElement(HugeiconsIcon21, { icon: Cancel01Icon2, size: 16 })
|
|
2986
|
-
));
|
|
2987
|
-
};
|
|
2988
|
-
|
|
2989
|
-
// src/components/UniversalOverviewPage.tsx
|
|
2990
3002
|
var UniversalOverviewPage = ({
|
|
2991
3003
|
headerTitle,
|
|
2992
3004
|
headerDescription,
|
|
@@ -2997,7 +3009,7 @@ var UniversalOverviewPage = ({
|
|
|
2997
3009
|
alerts = [],
|
|
2998
3010
|
banner
|
|
2999
3011
|
}) => {
|
|
3000
|
-
return /* @__PURE__ */ React35.createElement("div", { className: "flex flex-col gap-8 animate-in fade-in duration-300 pb-10" }, /* @__PURE__ */ React35.createElement("div", { className: "flex items-center justify-between gap-4" }, /* @__PURE__ */ React35.createElement("div", null, /* @__PURE__ */ React35.createElement("h1", { className: "
|
|
3012
|
+
return /* @__PURE__ */ React35.createElement("div", { className: "flex flex-col gap-8 animate-in fade-in duration-300 pb-10" }, /* @__PURE__ */ React35.createElement("div", { className: "flex items-center justify-between gap-4" }, /* @__PURE__ */ React35.createElement("div", null, /* @__PURE__ */ React35.createElement("h1", { className: " gradient-text text-xl mb-1 tracking-tight" }, headerTitle), /* @__PURE__ */ React35.createElement("p", { className: "text-xs text-neutral-500" }, headerDescription))), quickStats.length > 0 && /* @__PURE__ */ React35.createElement("div", { className: "w-full rounded-2xl overflow-hidden max-w-5xl bg-white" }, /* @__PURE__ */ React35.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__ */ React35.createElement("div", { key: idx, className: "p-6 flex items-center gap-4 hover:bg-neutral-50/50 transition-colors min-w-0" }, /* @__PURE__ */ React35.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__ */ React35.createElement("div", { className: "min-w-0 flex-1" }, /* @__PURE__ */ React35.createElement("p", { className: "text-[11px] tracking-[0.2em] text-neutral-400 mb-1 truncate " }, stat.label), /* @__PURE__ */ React35.createElement("p", { className: "text-lg md:text-xl text-black tracking-tight truncate" }, stat.value)))))), banner && banner.isVisible && /* @__PURE__ */ React35.createElement("div", { className: "w-full max-w-5xl" }, /* @__PURE__ */ React35.createElement(
|
|
3001
3013
|
Banner,
|
|
3002
3014
|
{
|
|
3003
3015
|
title: banner.title,
|
|
@@ -3118,7 +3130,7 @@ var UniversalLookupPage = ({
|
|
|
3118
3130
|
}) => {
|
|
3119
3131
|
const [isTypeModalOpen, setIsTypeModalOpen] = useState23(false);
|
|
3120
3132
|
const currentOptionLabel = searchOptions.find((opt) => opt.value === selectedSearchType)?.label || "Select Type";
|
|
3121
|
-
return /* @__PURE__ */ React37.createElement("div", { className: "flex flex-col max-w-5xl rounded-2xl p-6 bg-white gap-8 animate-in fade-in duration-300 pb-20" }, /* @__PURE__ */ React37.createElement(ManagedToaster, null), /* @__PURE__ */ React37.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-3 sm:gap-4" }, /* @__PURE__ */ React37.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React37.createElement("h1", { className: " text
|
|
3133
|
+
return /* @__PURE__ */ React37.createElement("div", { className: "flex flex-col max-w-5xl rounded-2xl p-6 bg-white gap-8 animate-in fade-in duration-300 pb-20" }, /* @__PURE__ */ React37.createElement(ManagedToaster, null), /* @__PURE__ */ React37.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-3 sm:gap-4" }, /* @__PURE__ */ React37.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React37.createElement("h1", { className: " gradient-text text-xl mb-1 truncate tracking-tight" }, headerTitle), /* @__PURE__ */ React37.createElement("p", { className: "text-xs text-neutral-500 truncate" }, headerDescription))), /* @__PURE__ */ React37.createElement("div", { className: "w-full max-w-5xl pb-8" }, /* @__PURE__ */ React37.createElement("form", { className: "flex flex-col gap-6", onSubmit: onSearch, autoComplete: "off" }, /* @__PURE__ */ React37.createElement("div", { className: "flex gap-4" }, /* @__PURE__ */ React37.createElement(
|
|
3122
3134
|
"button",
|
|
3123
3135
|
{
|
|
3124
3136
|
type: "button",
|
|
@@ -3586,13 +3598,13 @@ import { CheckmarkCircle01Icon as CheckmarkCircle01Icon2, CancelCircleIcon as Ca
|
|
|
3586
3598
|
var AiApproveDecline = ({ suggestionTitle, suggestionValue, onApprove, onDecline, onEdit }) => {
|
|
3587
3599
|
const [isEditing, setIsEditing] = useState26(false);
|
|
3588
3600
|
const [editVal, setEditVal] = useState26(typeof suggestionValue === "string" ? suggestionValue : "");
|
|
3589
|
-
return /* @__PURE__ */ React44.createElement("div", { className: "border border-
|
|
3601
|
+
return /* @__PURE__ */ React44.createElement("div", { className: "border border-orange-100 bg-linear-to-bl from-orange-50/80 via-white to-white p-5 rounded-2xl flex flex-col gap-4 relative overflow-hidden" }, /* @__PURE__ */ React44.createElement("div", null, /* @__PURE__ */ React44.createElement("span", { className: "text-[11px] tracking-widest text-orange-600 block mb-1 " }, "AI Suggestion: ", suggestionTitle), !isEditing ? /* @__PURE__ */ React44.createElement("div", { className: "text-sm text-black" }, suggestionValue) : /* @__PURE__ */ React44.createElement(
|
|
3590
3602
|
"input",
|
|
3591
3603
|
{
|
|
3592
3604
|
type: "text",
|
|
3593
3605
|
value: editVal,
|
|
3594
3606
|
onChange: (e) => setEditVal(e.target.value),
|
|
3595
|
-
className: "w-full text-sm p-2 border-b border-
|
|
3607
|
+
className: "w-full text-sm p-2 border-b border-orange-200 bg-transparent outline-none focus:border-orange-400 transition-colors",
|
|
3596
3608
|
autoFocus: true
|
|
3597
3609
|
}
|
|
3598
3610
|
)), /* @__PURE__ */ React44.createElement("div", { className: "flex items-center gap-1 mt-2" }, !isEditing ? /* @__PURE__ */ React44.createElement(React44.Fragment, null, /* @__PURE__ */ React44.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__ */ React44.createElement(HugeiconsIcon29, { icon: CheckmarkCircle01Icon2, size: 28 })), /* @__PURE__ */ React44.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__ */ React44.createElement(HugeiconsIcon29, { icon: CancelCircleIcon2, size: 28 })), onEdit && /* @__PURE__ */ React44.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__ */ React44.createElement(HugeiconsIcon29, { icon: PencilEdit01Icon, size: 18 }))) : /* @__PURE__ */ React44.createElement(React44.Fragment, null, /* @__PURE__ */ React44.createElement("button", { onClick: () => {
|
|
@@ -3606,7 +3618,7 @@ import React45 from "react";
|
|
|
3606
3618
|
import { HugeiconsIcon as HugeiconsIcon30 } from "@hugeicons/react";
|
|
3607
3619
|
import { Loading03Icon as Loading03Icon14, CheckmarkCircle02Icon, CancelCircleIcon as CancelCircleIcon3 } from "@hugeicons/core-free-icons";
|
|
3608
3620
|
var AiStageCheck = ({ tasks }) => {
|
|
3609
|
-
return /* @__PURE__ */ React45.createElement("div", { className: "flex flex-col gap-3 p-5 rounded-2xl border border-
|
|
3621
|
+
return /* @__PURE__ */ React45.createElement("div", { className: "flex flex-col gap-3 p-5 rounded-2xl border border-orange-100 bg-linear-to-bl from-orange-50/80 via-white to-white relative overflow-hidden" }, /* @__PURE__ */ React45.createElement("span", { className: "text-[11px] tracking-widest text-orange-600 mb-1 " }, "AI Processing"), tasks.map((task) => /* @__PURE__ */ React45.createElement("div", { key: task.id, className: "flex items-center gap-3" }, task.status === "pending" && /* @__PURE__ */ React45.createElement("div", { className: "w-4 h-4 rounded-full border border-orange-200" }), task.status === "loading" && /* @__PURE__ */ React45.createElement(HugeiconsIcon30, { icon: Loading03Icon14, size: 16, className: "animate-spin text-orange-500" }), task.status === "success" && /* @__PURE__ */ React45.createElement(HugeiconsIcon30, { icon: CheckmarkCircle02Icon, size: 16, className: "text-emerald-500" }), task.status === "error" && /* @__PURE__ */ React45.createElement(HugeiconsIcon30, { icon: CancelCircleIcon3, size: 16, className: "text-red-500" }), /* @__PURE__ */ React45.createElement("span", { className: `text-xs transition-colors ${task.status === "success" ? "text-black" : task.status === "loading" ? "text-orange-700" : "text-neutral-500"}` }, task.label))));
|
|
3610
3622
|
};
|
|
3611
3623
|
|
|
3612
3624
|
// src/components/Stagger.tsx
|
|
@@ -4219,7 +4231,7 @@ var UniversalRegistrationFlow = ({
|
|
|
4219
4231
|
const newForm = { ...formData, natureOfBusiness: suggestedNature };
|
|
4220
4232
|
setFormData(newForm);
|
|
4221
4233
|
approveSection("natureApproved", newForm);
|
|
4222
|
-
}, onDecline: () => setSuggestedNature(null) }))) : /* @__PURE__ */ React47.createElement("div", { className: " flex items-center justify-between" }, /* @__PURE__ */ React47.createElement("div", { className: "pr-4" }, /* @__PURE__ */ React47.createElement("p", { className: "text-sm text-black" }, formData.natureOfBusiness?.specificLabel), /* @__PURE__ */ React47.createElement("p", { className: "text-xs text-neutral-400 mt-1" }, formData.businessDesc)), !isReadOnly && /* @__PURE__ */ React47.createElement("button", { onClick: () => editSection("natureApproved"), className: "p-2 text-neutral-400 hover:text-black transition-colors outline-none shrink-0" }, /* @__PURE__ */ React47.createElement(HugeiconsIcon32, { icon: PencilEdit01Icon2, size: 16 })))), formState.natureApproved && /* @__PURE__ */ React47.createElement("div", { className: "flex flex-col gap-4 pt-6 animate-in slide-in-from-top-4 duration-500" }, /* @__PURE__ */ React47.createElement("div", { className: "flex items-center text-black" }, /* @__PURE__ */ React47.createElement("h3", { className: "text-sm " }, "What name would you like to register?")), /* @__PURE__ */ React47.createElement("p", { className: "text-xs text-neutral-400 -mt-2" }, "Provide two options. We will verify availability against the official registry."), !formState.nameApproved ? /* @__PURE__ */ React47.createElement(React47.Fragment, null, /* @__PURE__ */ React47.createElement("div", { className: "flex flex-col gap-4" }, /* @__PURE__ */ React47.createElement(TextInput, { label: "Proposed Name 1 (Preferred)", value: formData.proposedName, onChange: (v) => setFormData({ ...formData, proposedName: v }), disabled: isReadOnly || isSubmitting }), /* @__PURE__ */ React47.createElement(TextInput, { label: "Proposed Name 2 (Alternative)", value: formData.proposedName2, onChange: (v) => setFormData({ ...formData, proposedName2: v }), disabled: isReadOnly || isSubmitting }), /* @__PURE__ */ React47.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__ */ React47.createElement("div", { className: " mt-2" }, /* @__PURE__ */ React47.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__ */ React47.createElement("div", { className: "mt-2 animate-in fade-in" }, /* @__PURE__ */ React47.createElement("div", { className: "border border-
|
|
4234
|
+
}, onDecline: () => setSuggestedNature(null) }))) : /* @__PURE__ */ React47.createElement("div", { className: " flex items-center justify-between" }, /* @__PURE__ */ React47.createElement("div", { className: "pr-4" }, /* @__PURE__ */ React47.createElement("p", { className: "text-sm text-black" }, formData.natureOfBusiness?.specificLabel), /* @__PURE__ */ React47.createElement("p", { className: "text-xs text-neutral-400 mt-1" }, formData.businessDesc)), !isReadOnly && /* @__PURE__ */ React47.createElement("button", { onClick: () => editSection("natureApproved"), className: "p-2 text-neutral-400 hover:text-black transition-colors outline-none shrink-0" }, /* @__PURE__ */ React47.createElement(HugeiconsIcon32, { icon: PencilEdit01Icon2, size: 16 })))), formState.natureApproved && /* @__PURE__ */ React47.createElement("div", { className: "flex flex-col gap-4 pt-6 animate-in slide-in-from-top-4 duration-500" }, /* @__PURE__ */ React47.createElement("div", { className: "flex items-center text-black" }, /* @__PURE__ */ React47.createElement("h3", { className: "text-sm " }, "What name would you like to register?")), /* @__PURE__ */ React47.createElement("p", { className: "text-xs text-neutral-400 -mt-2" }, "Provide two options. We will verify availability against the official registry."), !formState.nameApproved ? /* @__PURE__ */ React47.createElement(React47.Fragment, null, /* @__PURE__ */ React47.createElement("div", { className: "flex flex-col gap-4" }, /* @__PURE__ */ React47.createElement(TextInput, { label: "Proposed Name 1 (Preferred)", value: formData.proposedName, onChange: (v) => setFormData({ ...formData, proposedName: v }), disabled: isReadOnly || isSubmitting }), /* @__PURE__ */ React47.createElement(TextInput, { label: "Proposed Name 2 (Alternative)", value: formData.proposedName2, onChange: (v) => setFormData({ ...formData, proposedName2: v }), disabled: isReadOnly || isSubmitting }), /* @__PURE__ */ React47.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__ */ React47.createElement("div", { className: " mt-2" }, /* @__PURE__ */ React47.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__ */ React47.createElement("div", { className: "mt-2 animate-in fade-in" }, /* @__PURE__ */ React47.createElement("div", { className: "border border-orange-100 bg-linear-to-bl from-orange-50/80 via-white to-white p-5 rounded-2xl flex flex-col gap-4 relative overflow-hidden" }, /* @__PURE__ */ React47.createElement("div", null, /* @__PURE__ */ React47.createElement("span", { className: "text-[11px] tracking-widest text-orange-600 block mb-1" }, "AI Suggestion: Structural Qualifier Missing"), /* @__PURE__ */ React47.createElement("p", { className: "text-sm text-black mb-3" }, "Nigerian registrations require a structural qualifier to be approved."), /* @__PURE__ */ React47.createElement("div", { className: "flex flex-col gap-2" }, (qualifierCheckResult.suggestions || []).map((alt, i) => /* @__PURE__ */ React47.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__ */ React47.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__ */ React47.createElement("div", { className: " mt-2 animate-in fade-in" }, nameCheckResult.status === "APPROVED" || nameCheckResult.status === "APPROVED_WARNING" || nameCheckResult.status === "SKIPPED" ? /* @__PURE__ */ React47.createElement(AiApproveDecline, { suggestionTitle: nameCheckResult.status === "APPROVED" ? "Name Available!" : "Fallback Approval", suggestionValue: /* @__PURE__ */ React47.createElement("div", null, /* @__PURE__ */ React47.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__ */ React47.createElement("p", { className: "text-xs text-neutral-600" }, nameCheckResult.message), /* @__PURE__ */ React47.createElement("p", { className: "text-xs text-neutral-600 mt-2 " }, "Proposed Option: ", nameCheckResult.approvedOption)), onApprove: () => {
|
|
4223
4235
|
const newForm = { ...formData, approvedName: nameCheckResult.approvedOption };
|
|
4224
4236
|
setFormData(newForm);
|
|
4225
4237
|
approveSection("nameApproved", newForm);
|
|
@@ -4227,7 +4239,7 @@ var UniversalRegistrationFlow = ({
|
|
|
4227
4239
|
}, disabled: isReadOnly || isSubmitting })), /* @__PURE__ */ React47.createElement(ThreeDActionButton, { onClick: () => approveSection("addressApproved"), disabled: !formData.address || !formData.city || !formData.state || isReadOnly, className: "w-fit mt-2" }, "Confirm Address")) : /* @__PURE__ */ React47.createElement("div", { className: " flex items-center justify-between" }, /* @__PURE__ */ React47.createElement("p", { className: "text-sm text-neutral-500" }, formData.address, ", ", formData.city, ", ", formData.state), !isReadOnly && /* @__PURE__ */ React47.createElement("button", { onClick: () => editSection("addressApproved"), className: "p-2 text-neutral-400 hover:text-black transition-colors outline-none shrink-0" }, /* @__PURE__ */ React47.createElement(HugeiconsIcon32, { icon: PencilEdit01Icon2, size: 16 })))), formState.addressApproved && type === "company" && /* @__PURE__ */ React47.createElement("div", { className: "flex flex-col gap-4 pt-6 animate-in slide-in-from-top-4 duration-500" }, /* @__PURE__ */ React47.createElement("div", { className: "flex items-center justify-between gap-2 text-black" }, /* @__PURE__ */ React47.createElement("div", { className: "flex items-center" }, /* @__PURE__ */ React47.createElement("h3", { className: "text-sm " }, "Directors & Shareholders")), !formState.membersDetailsApproved && /* @__PURE__ */ React47.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__ */ React47.createElement("p", { className: "text-xs text-neutral-400 -mt-2" }, "Provide details for all individuals. Ensure total share percentage equals 100%."), !formState.membersDetailsApproved ? /* @__PURE__ */ React47.createElement("div", { className: "flex flex-col gap-6 " }, formData.members.map((member, i) => /* @__PURE__ */ React47.createElement("div", { key: member.id, className: "flex flex-col gap-4 border border-neutral-100 p-5 rounded-2xl bg-neutral-50/30" }, /* @__PURE__ */ React47.createElement("div", { className: "flex justify-between items-center mb-1" }, /* @__PURE__ */ React47.createElement("span", { className: "text-[11px] tracking-widest text-neutral-400" }, "Member ", i + 1), formData.members.length > 1 && !isReadOnly && /* @__PURE__ */ React47.createElement("button", { onClick: () => removeCompanyMember(i), className: "text-red-500 text-xs hover:text-red-600" }, "Remove")), /* @__PURE__ */ React47.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-4" }, /* @__PURE__ */ React47.createElement(TextInput, { label: "Role", value: member.role, readOnly: true, onClick: () => !isReadOnly && setActiveModal({ isOpen: true, type: "role", memberIndex: i }), onChange: () => {
|
|
4228
4240
|
}, disabled: isReadOnly || isSubmitting }), member.role !== "Director Only" && /* @__PURE__ */ React47.createElement(NumberInput, { label: "Share Percentage (%)", value: member.sharePercentage, onChange: (v) => updateCompanyMemberInfo(i, "sharePercentage", v), disabled: isReadOnly || isSubmitting })), /* @__PURE__ */ React47.createElement(TextInput, { label: "Full Name", value: member.fullName, onChange: (v) => updateCompanyMemberInfo(i, "fullName", v), disabled: isReadOnly || isSubmitting }), /* @__PURE__ */ React47.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-4" }, /* @__PURE__ */ React47.createElement(NumberInput, { label: "Phone Number", value: member.phone, onChange: (v) => updateCompanyMemberInfo(i, "phone", v), disabled: isReadOnly || isSubmitting }), /* @__PURE__ */ React47.createElement(TextInput, { label: "Email Address", value: member.email, onChange: (v) => updateCompanyMemberInfo(i, "email", v), disabled: isReadOnly || isSubmitting })), /* @__PURE__ */ React47.createElement(TextInput, { label: "Nationality", value: member.nationality, readOnly: true, onClick: () => !isReadOnly && setActiveModal({ isOpen: true, type: "nationality", memberIndex: i }), onChange: () => {
|
|
4229
4241
|
}, disabled: isReadOnly || isSubmitting }), /* @__PURE__ */ React47.createElement(TextInput, { label: "Residential Address", value: member.address, onChange: (v) => updateCompanyMemberInfo(i, "address", v), disabled: isReadOnly || isSubmitting }), /* @__PURE__ */ React47.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-4" }, /* @__PURE__ */ React47.createElement(TextInput, { label: "City", value: member.city, onChange: (v) => updateCompanyMemberInfo(i, "city", v), disabled: isReadOnly || isSubmitting }), /* @__PURE__ */ React47.createElement(TextInput, { label: "State", value: member.state, readOnly: true, onClick: () => !isReadOnly && setActiveModal({ isOpen: true, type: "state", memberIndex: i }), onChange: () => {
|
|
4230
|
-
}, disabled: isReadOnly || isSubmitting })))), /* @__PURE__ */ React47.createElement("div", { className: "flex items-center justify-between mt-2" }, !isReadOnly && /* @__PURE__ */ React47.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__ */ React47.createElement(ThreeDActionButton, { onClick: () => approveSection("membersDetailsApproved"), disabled: !areCompanyMembersValid() || isReadOnly, className: "w-fit" }, "Confirm Members"))) : /* @__PURE__ */ React47.createElement("div", { className: " flex items-center justify-between" }, /* @__PURE__ */ React47.createElement("div", null, /* @__PURE__ */ React47.createElement("p", { className: "text-sm text-black" }, formData.members.length, " Member(s) Registered"), /* @__PURE__ */ React47.createElement("p", { className: "text-xs text-neutral-500 mt-1" }, "Total Shares: 100% Verified.")), !isReadOnly && /* @__PURE__ */ React47.createElement("button", { onClick: () => editSection("membersDetailsApproved"), className: "p-2 text-neutral-400 hover:text-black transition-colors outline-none shrink-0" }, /* @__PURE__ */ React47.createElement(HugeiconsIcon32, { icon: PencilEdit01Icon2, size: 16 })))), formState.addressApproved && type === "business" && /* @__PURE__ */ React47.createElement("div", { className: "flex flex-col gap-4 pt-6 animate-in slide-in-from-top-4 duration-500" }, /* @__PURE__ */ React47.createElement("div", { className: "flex items-center text-black" }, /* @__PURE__ */ React47.createElement("h3", { className: "text-sm " }, "Who owns the business?")), /* @__PURE__ */ React47.createElement("p", { className: "text-xs text-neutral-400 -mt-2" }, "Provide basic contact info. We will extract your DOB and ID number automatically in the next step."), !formState.ownerApproved ? /* @__PURE__ */ React47.createElement("div", { className: "flex flex-col gap-4 " }, /* @__PURE__ */ React47.createElement(TextInput, { label: "Full Name", value: formData.ownerName, onChange: (v) => setFormData({ ...formData, ownerName: v }), disabled: isReadOnly || isSubmitting }), /* @__PURE__ */ React47.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-4" }, /* @__PURE__ */ React47.createElement(NumberInput, { label: "Phone Number", value: formData.ownerPhone, onChange: (v) => setFormData({ ...formData, ownerPhone: v }), disabled: isReadOnly || isSubmitting }), /* @__PURE__ */ React47.createElement(TextInput, { label: "Email Address", value: formData.ownerEmail, onChange: (v) => setFormData({ ...formData, ownerEmail: v }), disabled: isReadOnly || isSubmitting })), /* @__PURE__ */ React47.createElement(ThreeDActionButton, { onClick: () => approveSection("ownerApproved"), disabled: !formData.ownerName || !formData.ownerPhone || !formData.ownerEmail || isReadOnly, className: "w-fit mt-2" }, "Confirm Owner Details")) : /* @__PURE__ */ React47.createElement("div", { className: " flex items-center justify-between" }, /* @__PURE__ */ React47.createElement("div", null, /* @__PURE__ */ React47.createElement("p", { className: "text-sm text-black" }, formData.ownerName), /* @__PURE__ */ React47.createElement("p", { className: "text-xs text-neutral-500 mt-1" }, formData.ownerEmail, " \u2022 ", formData.ownerPhone)), !isReadOnly && /* @__PURE__ */ React47.createElement("button", { onClick: () => editSection("ownerApproved"), className: "p-2 text-neutral-400 hover:text-black transition-colors outline-none shrink-0" }, /* @__PURE__ */ React47.createElement(HugeiconsIcon32, { icon: PencilEdit01Icon2, size: 16 })))), /* @__PURE__ */ React47.createElement("div", { className: "flex items-center justify-between mt-8 pt-6 " }, /* @__PURE__ */ React47.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__ */ React47.createElement(HugeiconsIcon32, { icon: ArrowLeft01Icon10, size: 14 }), " Close"), /* @__PURE__ */ React47.createElement(ThreeDActionButton, { onClick: handleNext, disabled: !isStep0Valid, className: "w-fit shrink-0" }, "Next Step"))), macroStep === 1 && /* @__PURE__ */ React47.createElement("div", { className: "flex flex-col gap-8 animate-in fade-in" }, type === "company" ? /* @__PURE__ */ React47.createElement(React47.Fragment, null, /* @__PURE__ */ React47.createElement("div", { className: "flex flex-col gap-2" }, /* @__PURE__ */ React47.createElement("h3", { className: "text-sm text-black" }, "Member Identity Documents"), /* @__PURE__ */ React47.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__ */ React47.createElement("div", { className: "flex flex-col gap-6" }, formData.members.map((member, i) => /* @__PURE__ */ React47.createElement("div", { key: member.id, className: "flex flex-col gap-4" }, /* @__PURE__ */ React47.createElement("span", { className: "text-[11px] tracking-widest text-black mb-1" }, member.fullName || `Member ${i + 1}`, " ", /* @__PURE__ */ React47.createElement("span", { className: "text-neutral-400 ml-2" }, "(", member.role, ")")), /* @__PURE__ */ React47.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__ */ React47.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__ */ React47.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__ */ React47.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__ */ React47.createElement(HugeiconsIcon32, { icon: Upload01Icon3, size: 18, className: "text-neutral-400" }), " Upload Valid ID (NIN, License, Voter's Card)") : globalExtractingId && !member.idExtractedData ? /* @__PURE__ */ React47.createElement("div", { className: " mt-2" }, /* @__PURE__ */ React47.createElement(AiStageCheck, { tasks: aiTasks })) : member.idExtractedData ? /* @__PURE__ */ React47.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__ */ React47.createElement("div", null, /* @__PURE__ */ React47.createElement("span", { className: "text-[11px] tracking-widest text-purple-600 block mb-2" }, "Review Extracted ID"), /* @__PURE__ */ React47.createElement("div", { className: "flex flex-col gap-4" }, /* @__PURE__ */ React47.createElement(TextInput, { label: "Full Name on ID", value: member.idExtractedData.fullName, onChange: (v) => updateCompanyMemberInfo(i, "idExtractedData", { ...member.idExtractedData, fullName: v }), disabled: isReadOnly || isAnyUploading }), /* @__PURE__ */ React47.createElement("div", { className: "grid grid-cols-2 gap-4" }, /* @__PURE__ */ React47.createElement(TextInput, { label: "ID Number", value: member.idExtractedData.idNumber, onChange: (v) => updateCompanyMemberInfo(i, "idExtractedData", { ...member.idExtractedData, idNumber: v }), disabled: isReadOnly || isAnyUploading }), /* @__PURE__ */ React47.createElement(TextInput, { label: "Date of Birth", value: member.idExtractedData.dob, onChange: (v) => updateCompanyMemberInfo(i, "idExtractedData", { ...member.idExtractedData, dob: v }), disabled: isReadOnly || isAnyUploading })))), /* @__PURE__ */ React47.createElement("div", { className: "flex items-center gap-2 mt-2" }, !isReadOnly && /* @__PURE__ */ React47.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__ */ React47.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__ */ React47.createElement(HugeiconsIcon32, { icon: Upload01Icon3, size: 18, className: "text-neutral-400" }), " Upload Passport Photo") : globalUploadingPassport && !member.passportFileUrl ? /* @__PURE__ */ React47.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__ */ React47.createElement(HugeiconsIcon32, { icon: Loading03Icon15, size: 18, className: "animate-spin text-black" }), " Uploading Passport...") : member.passportFileUrl ? /* @__PURE__ */ React47.createElement("div", { className: "flex items-center justify-between p-4 bg-emerald-50 rounded-full text-emerald-800 text-sm w-full" }, /* @__PURE__ */ React47.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React47.createElement(HugeiconsIcon32, { icon: IdentificationIcon, size: 18 }), " Passport Uploaded"), !isReadOnly && /* @__PURE__ */ React47.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__ */ React47.createElement(HugeiconsIcon32, { icon: Delete02Icon3, size: 16 }))) : null, !member.signatureFileUrl && !globalUploadingSignature ? /* @__PURE__ */ React47.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__ */ React47.createElement(HugeiconsIcon32, { icon: Upload01Icon3, size: 18, className: "text-neutral-400" }), " Upload Signature") : globalUploadingSignature && !member.signatureFileUrl ? /* @__PURE__ */ React47.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__ */ React47.createElement(HugeiconsIcon32, { icon: Loading03Icon15, size: 18, className: "animate-spin text-black" }), " Uploading Signature...") : member.signatureFileUrl ? /* @__PURE__ */ React47.createElement("div", { className: "flex items-center justify-between p-4 bg-emerald-50 rounded-full text-emerald-800 text-sm w-full" }, /* @__PURE__ */ React47.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React47.createElement(HugeiconsIcon32, { icon: SignatureIcon, size: 18 }), " Signature Uploaded"), !isReadOnly && /* @__PURE__ */ React47.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__ */ React47.createElement(HugeiconsIcon32, { icon: Delete02Icon3, size: 16 }))) : null)), /* @__PURE__ */ React47.createElement("div", { className: "flex justify-end" }, /* @__PURE__ */ React47.createElement(ThreeDActionButton, { onClick: () => approveSection("membersDocsApproved"), disabled: !areCompanyMemberDocsValid() || isReadOnly || isAnyUploading, className: "w-fit" }, "Confirm All Documents"))) : /* @__PURE__ */ React47.createElement("div", { className: " flex items-center justify-between bg-emerald-50 p-6 rounded-full" }, /* @__PURE__ */ React47.createElement("div", null, /* @__PURE__ */ React47.createElement("p", { className: "text-sm text-emerald-800" }, "Documents Uploaded"), /* @__PURE__ */ React47.createElement("p", { className: "text-xs text-emerald-600 mt-1" }, "Data safely extracted.")), !isReadOnly && /* @__PURE__ */ React47.createElement("button", { onClick: () => editSection("membersDocsApproved"), className: "p-2 text-emerald-700 hover:text-black transition-colors outline-none shrink-0" }, /* @__PURE__ */ React47.createElement(HugeiconsIcon32, { icon: PencilEdit01Icon2, size: 16 })))) : /* @__PURE__ */ React47.createElement(React47.Fragment, null, /* @__PURE__ */ React47.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__ */ React47.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__ */ React47.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__ */ React47.createElement("div", { className: "flex flex-col gap-4" }, /* @__PURE__ */ React47.createElement("div", { className: "flex items-center gap-2 text-black" }, /* @__PURE__ */ React47.createElement("h3", { className: "text-sm " }, "Upload Means of Identification")), /* @__PURE__ */ React47.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__ */ React47.createElement(React47.Fragment, null, /* @__PURE__ */ React47.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__ */ React47.createElement(HugeiconsIcon32, { icon: Upload01Icon3, size: 24, className: "text-neutral-400" }), /* @__PURE__ */ React47.createElement("span", { className: "text-xs" }, "Select ID Image to Upload")), globalExtractingId && /* @__PURE__ */ React47.createElement("div", { className: " mt-2" }, /* @__PURE__ */ React47.createElement(AiStageCheck, { tasks: aiTasks })), formData.idExtractedData && /* @__PURE__ */ React47.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__ */ React47.createElement("div", null, /* @__PURE__ */ React47.createElement("span", { className: "text-[11px] tracking-widest text-purple-600 block mb-2" }, "Review AI Extracted Data"), /* @__PURE__ */ React47.createElement("p", { className: "text-xs text-neutral-500 mb-4" }, "Please verify the extracted information and correct any OCR mistakes before approving."), /* @__PURE__ */ React47.createElement("div", { className: "flex flex-col gap-4" }, /* @__PURE__ */ React47.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__ */ React47.createElement("div", { className: "grid grid-cols-2 gap-4" }, /* @__PURE__ */ React47.createElement(TextInput, { label: "ID Number", value: formData.idExtractedData.idNumber, onChange: (v) => setFormData((f) => ({ ...f, idExtractedData: { ...f.idExtractedData, idNumber: v } })), disabled: isReadOnly || isAnyUploading }), /* @__PURE__ */ React47.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__ */ React47.createElement("div", { className: "flex items-center gap-2 mt-2" }, /* @__PURE__ */ React47.createElement(ThreeDActionButton, { onClick: () => approveSection("idApproved"), disabled: isAnyUploading || isReadOnly, className: "w-fit shrink-0" }, "Approve Data"), !isReadOnly && /* @__PURE__ */ React47.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__ */ React47.createElement("div", { className: " flex items-center justify-between bg-emerald-50 p-6 rounded-full" }, /* @__PURE__ */ React47.createElement("div", null, /* @__PURE__ */ React47.createElement("p", { className: "text-sm text-emerald-800" }, "ID Document Verified"), /* @__PURE__ */ React47.createElement("p", { className: "text-xs text-emerald-600 mt-1" }, "Data safely extracted and stored.")), !isReadOnly && /* @__PURE__ */ React47.createElement("button", { onClick: () => editSection("idApproved"), className: "p-2 text-emerald-700 hover:text-black transition-colors outline-none shrink-0" }, /* @__PURE__ */ React47.createElement(HugeiconsIcon32, { icon: PencilEdit01Icon2, size: 16 })))), /* @__PURE__ */ React47.createElement("div", { className: "flex flex-col gap-4 pt-6 animate-in slide-in-from-top-4 duration-500" }, /* @__PURE__ */ React47.createElement("div", { className: "flex flex-col gap-3 " }, !formState.passportApproved && !globalUploadingPassport ? /* @__PURE__ */ React47.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__ */ React47.createElement(HugeiconsIcon32, { icon: Upload01Icon3, size: 18, className: "text-neutral-400" }), " Upload Passport Photo") : globalUploadingPassport && !formData.passportFileUrl ? /* @__PURE__ */ React47.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__ */ React47.createElement(HugeiconsIcon32, { icon: Loading03Icon15, size: 18, className: "animate-spin text-black" }), " Uploading Passport...") : /* @__PURE__ */ React47.createElement("div", { className: "flex items-center justify-between p-4 bg-emerald-50 rounded-full text-emerald-800 text-sm w-full" }, /* @__PURE__ */ React47.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React47.createElement(HugeiconsIcon32, { icon: IdentificationIcon, size: 18 }), " Passport Uploaded"), !isReadOnly && /* @__PURE__ */ React47.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__ */ React47.createElement(HugeiconsIcon32, { icon: Delete02Icon3, size: 16 }))), !formState.signatureApproved && !globalUploadingSignature ? /* @__PURE__ */ React47.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__ */ React47.createElement(HugeiconsIcon32, { icon: Upload01Icon3, size: 18, className: "text-neutral-400" }), " Upload Signature") : globalUploadingSignature && !formData.signatureFileUrl ? /* @__PURE__ */ React47.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__ */ React47.createElement(HugeiconsIcon32, { icon: Loading03Icon15, size: 18, className: "animate-spin text-black" }), " Uploading Signature...") : /* @__PURE__ */ React47.createElement("div", { className: "flex items-center justify-between p-4 bg-emerald-50 rounded-full text-emerald-800 text-sm w-full" }, /* @__PURE__ */ React47.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React47.createElement(HugeiconsIcon32, { icon: SignatureIcon, size: 18 }), " Signature Uploaded"), !isReadOnly && /* @__PURE__ */ React47.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__ */ React47.createElement(HugeiconsIcon32, { icon: Delete02Icon3, size: 16 })))))), /* @__PURE__ */ React47.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__ */ React47.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__ */ React47.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__ */ React47.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__ */ React47.createElement("div", { className: "flex flex-col gap-1 mb-2" }, /* @__PURE__ */ React47.createElement("h3", { className: "text-sm text-black" }, "Additional Documents (Optional)"), /* @__PURE__ */ React47.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__ */ React47.createElement("div", { className: "flex flex-col gap-3" }, [1, 2, 3].map((num) => {
|
|
4242
|
+
}, disabled: isReadOnly || isSubmitting })))), /* @__PURE__ */ React47.createElement("div", { className: "flex items-center justify-between mt-2" }, !isReadOnly && /* @__PURE__ */ React47.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__ */ React47.createElement(ThreeDActionButton, { onClick: () => approveSection("membersDetailsApproved"), disabled: !areCompanyMembersValid() || isReadOnly, className: "w-fit" }, "Confirm Members"))) : /* @__PURE__ */ React47.createElement("div", { className: " flex items-center justify-between" }, /* @__PURE__ */ React47.createElement("div", null, /* @__PURE__ */ React47.createElement("p", { className: "text-sm text-black" }, formData.members.length, " Member(s) Registered"), /* @__PURE__ */ React47.createElement("p", { className: "text-xs text-neutral-500 mt-1" }, "Total Shares: 100% Verified.")), !isReadOnly && /* @__PURE__ */ React47.createElement("button", { onClick: () => editSection("membersDetailsApproved"), className: "p-2 text-neutral-400 hover:text-black transition-colors outline-none shrink-0" }, /* @__PURE__ */ React47.createElement(HugeiconsIcon32, { icon: PencilEdit01Icon2, size: 16 })))), formState.addressApproved && type === "business" && /* @__PURE__ */ React47.createElement("div", { className: "flex flex-col gap-4 pt-6 animate-in slide-in-from-top-4 duration-500" }, /* @__PURE__ */ React47.createElement("div", { className: "flex items-center text-black" }, /* @__PURE__ */ React47.createElement("h3", { className: "text-sm " }, "Who owns the business?")), /* @__PURE__ */ React47.createElement("p", { className: "text-xs text-neutral-400 -mt-2" }, "Provide basic contact info. We will extract your DOB and ID number automatically in the next step."), !formState.ownerApproved ? /* @__PURE__ */ React47.createElement("div", { className: "flex flex-col gap-4 " }, /* @__PURE__ */ React47.createElement(TextInput, { label: "Full Name", value: formData.ownerName, onChange: (v) => setFormData({ ...formData, ownerName: v }), disabled: isReadOnly || isSubmitting }), /* @__PURE__ */ React47.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-4" }, /* @__PURE__ */ React47.createElement(NumberInput, { label: "Phone Number", value: formData.ownerPhone, onChange: (v) => setFormData({ ...formData, ownerPhone: v }), disabled: isReadOnly || isSubmitting }), /* @__PURE__ */ React47.createElement(TextInput, { label: "Email Address", value: formData.ownerEmail, onChange: (v) => setFormData({ ...formData, ownerEmail: v }), disabled: isReadOnly || isSubmitting })), /* @__PURE__ */ React47.createElement(ThreeDActionButton, { onClick: () => approveSection("ownerApproved"), disabled: !formData.ownerName || !formData.ownerPhone || !formData.ownerEmail || isReadOnly, className: "w-fit mt-2" }, "Confirm Owner Details")) : /* @__PURE__ */ React47.createElement("div", { className: " flex items-center justify-between" }, /* @__PURE__ */ React47.createElement("div", null, /* @__PURE__ */ React47.createElement("p", { className: "text-sm text-black" }, formData.ownerName), /* @__PURE__ */ React47.createElement("p", { className: "text-xs text-neutral-500 mt-1" }, formData.ownerEmail, " \u2022 ", formData.ownerPhone)), !isReadOnly && /* @__PURE__ */ React47.createElement("button", { onClick: () => editSection("ownerApproved"), className: "p-2 text-neutral-400 hover:text-black transition-colors outline-none shrink-0" }, /* @__PURE__ */ React47.createElement(HugeiconsIcon32, { icon: PencilEdit01Icon2, size: 16 })))), /* @__PURE__ */ React47.createElement("div", { className: "flex items-center justify-between mt-8 pt-6 " }, /* @__PURE__ */ React47.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__ */ React47.createElement(HugeiconsIcon32, { icon: ArrowLeft01Icon10, size: 14 }), " Close"), /* @__PURE__ */ React47.createElement(ThreeDActionButton, { onClick: handleNext, disabled: !isStep0Valid, className: "w-fit shrink-0" }, "Next Step"))), macroStep === 1 && /* @__PURE__ */ React47.createElement("div", { className: "flex flex-col gap-8 animate-in fade-in" }, type === "company" ? /* @__PURE__ */ React47.createElement(React47.Fragment, null, /* @__PURE__ */ React47.createElement("div", { className: "flex flex-col gap-2" }, /* @__PURE__ */ React47.createElement("h3", { className: "text-sm text-black" }, "Member Identity Documents"), /* @__PURE__ */ React47.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__ */ React47.createElement("div", { className: "flex flex-col gap-6" }, formData.members.map((member, i) => /* @__PURE__ */ React47.createElement("div", { key: member.id, className: "flex flex-col gap-4" }, /* @__PURE__ */ React47.createElement("span", { className: "text-[11px] tracking-widest text-black mb-1" }, member.fullName || `Member ${i + 1}`, " ", /* @__PURE__ */ React47.createElement("span", { className: "text-neutral-400 ml-2" }, "(", member.role, ")")), /* @__PURE__ */ React47.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__ */ React47.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__ */ React47.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__ */ React47.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__ */ React47.createElement(HugeiconsIcon32, { icon: Upload01Icon3, size: 18, className: "text-neutral-400" }), " Upload Valid ID (NIN, License, Voter's Card)") : globalExtractingId && !member.idExtractedData ? /* @__PURE__ */ React47.createElement("div", { className: " mt-2" }, /* @__PURE__ */ React47.createElement(AiStageCheck, { tasks: aiTasks })) : member.idExtractedData ? /* @__PURE__ */ React47.createElement("div", { className: " mt-2 animate-in fade-in border border-orange-100 bg-linear-to-bl from-orange-50/80 via-white to-white p-5 rounded-xl flex flex-col gap-4 relative overflow-hidden" }, /* @__PURE__ */ React47.createElement("div", null, /* @__PURE__ */ React47.createElement("span", { className: "text-[11px] tracking-widest text-orange-600 block mb-2" }, "Review Extracted ID"), /* @__PURE__ */ React47.createElement("div", { className: "flex flex-col gap-4" }, /* @__PURE__ */ React47.createElement(TextInput, { label: "Full Name on ID", value: member.idExtractedData.fullName, onChange: (v) => updateCompanyMemberInfo(i, "idExtractedData", { ...member.idExtractedData, fullName: v }), disabled: isReadOnly || isAnyUploading }), /* @__PURE__ */ React47.createElement("div", { className: "grid grid-cols-2 gap-4" }, /* @__PURE__ */ React47.createElement(TextInput, { label: "ID Number", value: member.idExtractedData.idNumber, onChange: (v) => updateCompanyMemberInfo(i, "idExtractedData", { ...member.idExtractedData, idNumber: v }), disabled: isReadOnly || isAnyUploading }), /* @__PURE__ */ React47.createElement(TextInput, { label: "Date of Birth", value: member.idExtractedData.dob, onChange: (v) => updateCompanyMemberInfo(i, "idExtractedData", { ...member.idExtractedData, dob: v }), disabled: isReadOnly || isAnyUploading })))), /* @__PURE__ */ React47.createElement("div", { className: "flex items-center gap-2 mt-2" }, !isReadOnly && /* @__PURE__ */ React47.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__ */ React47.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__ */ React47.createElement(HugeiconsIcon32, { icon: Upload01Icon3, size: 18, className: "text-neutral-400" }), " Upload Passport Photo") : globalUploadingPassport && !member.passportFileUrl ? /* @__PURE__ */ React47.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__ */ React47.createElement(HugeiconsIcon32, { icon: Loading03Icon15, size: 18, className: "animate-spin text-black" }), " Uploading Passport...") : member.passportFileUrl ? /* @__PURE__ */ React47.createElement("div", { className: "flex items-center justify-between p-4 bg-emerald-50 rounded-full text-emerald-800 text-sm w-full" }, /* @__PURE__ */ React47.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React47.createElement(HugeiconsIcon32, { icon: IdentificationIcon, size: 18 }), " Passport Uploaded"), !isReadOnly && /* @__PURE__ */ React47.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__ */ React47.createElement(HugeiconsIcon32, { icon: Delete02Icon3, size: 16 }))) : null, !member.signatureFileUrl && !globalUploadingSignature ? /* @__PURE__ */ React47.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__ */ React47.createElement(HugeiconsIcon32, { icon: Upload01Icon3, size: 18, className: "text-neutral-400" }), " Upload Signature") : globalUploadingSignature && !member.signatureFileUrl ? /* @__PURE__ */ React47.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__ */ React47.createElement(HugeiconsIcon32, { icon: Loading03Icon15, size: 18, className: "animate-spin text-black" }), " Uploading Signature...") : member.signatureFileUrl ? /* @__PURE__ */ React47.createElement("div", { className: "flex items-center justify-between p-4 bg-emerald-50 rounded-full text-emerald-800 text-sm w-full" }, /* @__PURE__ */ React47.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React47.createElement(HugeiconsIcon32, { icon: SignatureIcon, size: 18 }), " Signature Uploaded"), !isReadOnly && /* @__PURE__ */ React47.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__ */ React47.createElement(HugeiconsIcon32, { icon: Delete02Icon3, size: 16 }))) : null)), /* @__PURE__ */ React47.createElement("div", { className: "flex justify-end" }, /* @__PURE__ */ React47.createElement(ThreeDActionButton, { onClick: () => approveSection("membersDocsApproved"), disabled: !areCompanyMemberDocsValid() || isReadOnly || isAnyUploading, className: "w-fit" }, "Confirm All Documents"))) : /* @__PURE__ */ React47.createElement("div", { className: " flex items-center justify-between bg-emerald-50 p-6 rounded-full" }, /* @__PURE__ */ React47.createElement("div", null, /* @__PURE__ */ React47.createElement("p", { className: "text-sm text-emerald-800" }, "Documents Uploaded"), /* @__PURE__ */ React47.createElement("p", { className: "text-xs text-emerald-600 mt-1" }, "Data safely extracted.")), !isReadOnly && /* @__PURE__ */ React47.createElement("button", { onClick: () => editSection("membersDocsApproved"), className: "p-2 text-emerald-700 hover:text-black transition-colors outline-none shrink-0" }, /* @__PURE__ */ React47.createElement(HugeiconsIcon32, { icon: PencilEdit01Icon2, size: 16 })))) : /* @__PURE__ */ React47.createElement(React47.Fragment, null, /* @__PURE__ */ React47.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__ */ React47.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__ */ React47.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__ */ React47.createElement("div", { className: "flex flex-col gap-4" }, /* @__PURE__ */ React47.createElement("div", { className: "flex items-center gap-2 text-black" }, /* @__PURE__ */ React47.createElement("h3", { className: "text-sm " }, "Upload Means of Identification")), /* @__PURE__ */ React47.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__ */ React47.createElement(React47.Fragment, null, /* @__PURE__ */ React47.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__ */ React47.createElement(HugeiconsIcon32, { icon: Upload01Icon3, size: 24, className: "text-neutral-400" }), /* @__PURE__ */ React47.createElement("span", { className: "text-xs" }, "Select ID Image to Upload")), globalExtractingId && /* @__PURE__ */ React47.createElement("div", { className: " mt-2" }, /* @__PURE__ */ React47.createElement(AiStageCheck, { tasks: aiTasks })), formData.idExtractedData && /* @__PURE__ */ React47.createElement("div", { className: " mt-2 animate-in fade-in border border-orange-100 bg-linear-to-bl from-orange-50/80 via-white to-white p-5 rounded-2xl flex flex-col gap-4 relative overflow-hidden" }, /* @__PURE__ */ React47.createElement("div", null, /* @__PURE__ */ React47.createElement("span", { className: "text-[11px] tracking-widest text-orange-600 block mb-2" }, "Review AI Extracted Data"), /* @__PURE__ */ React47.createElement("p", { className: "text-xs text-neutral-500 mb-4" }, "Please verify the extracted information and correct any OCR mistakes before approving."), /* @__PURE__ */ React47.createElement("div", { className: "flex flex-col gap-4" }, /* @__PURE__ */ React47.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__ */ React47.createElement("div", { className: "grid grid-cols-2 gap-4" }, /* @__PURE__ */ React47.createElement(TextInput, { label: "ID Number", value: formData.idExtractedData.idNumber, onChange: (v) => setFormData((f) => ({ ...f, idExtractedData: { ...f.idExtractedData, idNumber: v } })), disabled: isReadOnly || isAnyUploading }), /* @__PURE__ */ React47.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__ */ React47.createElement("div", { className: "flex items-center gap-2 mt-2" }, /* @__PURE__ */ React47.createElement(ThreeDActionButton, { onClick: () => approveSection("idApproved"), disabled: isAnyUploading || isReadOnly, className: "w-fit shrink-0" }, "Approve Data"), !isReadOnly && /* @__PURE__ */ React47.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__ */ React47.createElement("div", { className: " flex items-center justify-between bg-emerald-50 p-6 rounded-full" }, /* @__PURE__ */ React47.createElement("div", null, /* @__PURE__ */ React47.createElement("p", { className: "text-sm text-emerald-800" }, "ID Document Verified"), /* @__PURE__ */ React47.createElement("p", { className: "text-xs text-emerald-600 mt-1" }, "Data safely extracted and stored.")), !isReadOnly && /* @__PURE__ */ React47.createElement("button", { onClick: () => editSection("idApproved"), className: "p-2 text-emerald-700 hover:text-black transition-colors outline-none shrink-0" }, /* @__PURE__ */ React47.createElement(HugeiconsIcon32, { icon: PencilEdit01Icon2, size: 16 })))), /* @__PURE__ */ React47.createElement("div", { className: "flex flex-col gap-4 pt-6 animate-in slide-in-from-top-4 duration-500" }, /* @__PURE__ */ React47.createElement("div", { className: "flex flex-col gap-3 " }, !formState.passportApproved && !globalUploadingPassport ? /* @__PURE__ */ React47.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__ */ React47.createElement(HugeiconsIcon32, { icon: Upload01Icon3, size: 18, className: "text-neutral-400" }), " Upload Passport Photo") : globalUploadingPassport && !formData.passportFileUrl ? /* @__PURE__ */ React47.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__ */ React47.createElement(HugeiconsIcon32, { icon: Loading03Icon15, size: 18, className: "animate-spin text-black" }), " Uploading Passport...") : /* @__PURE__ */ React47.createElement("div", { className: "flex items-center justify-between p-4 bg-emerald-50 rounded-full text-emerald-800 text-sm w-full" }, /* @__PURE__ */ React47.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React47.createElement(HugeiconsIcon32, { icon: IdentificationIcon, size: 18 }), " Passport Uploaded"), !isReadOnly && /* @__PURE__ */ React47.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__ */ React47.createElement(HugeiconsIcon32, { icon: Delete02Icon3, size: 16 }))), !formState.signatureApproved && !globalUploadingSignature ? /* @__PURE__ */ React47.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__ */ React47.createElement(HugeiconsIcon32, { icon: Upload01Icon3, size: 18, className: "text-neutral-400" }), " Upload Signature") : globalUploadingSignature && !formData.signatureFileUrl ? /* @__PURE__ */ React47.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__ */ React47.createElement(HugeiconsIcon32, { icon: Loading03Icon15, size: 18, className: "animate-spin text-black" }), " Uploading Signature...") : /* @__PURE__ */ React47.createElement("div", { className: "flex items-center justify-between p-4 bg-emerald-50 rounded-full text-emerald-800 text-sm w-full" }, /* @__PURE__ */ React47.createElement("div", { className: "flex items-center gap-3" }, /* @__PURE__ */ React47.createElement(HugeiconsIcon32, { icon: SignatureIcon, size: 18 }), " Signature Uploaded"), !isReadOnly && /* @__PURE__ */ React47.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__ */ React47.createElement(HugeiconsIcon32, { icon: Delete02Icon3, size: 16 })))))), /* @__PURE__ */ React47.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__ */ React47.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__ */ React47.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__ */ React47.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__ */ React47.createElement("div", { className: "flex flex-col gap-1 mb-2" }, /* @__PURE__ */ React47.createElement("h3", { className: "text-sm text-black" }, "Additional Documents (Optional)"), /* @__PURE__ */ React47.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__ */ React47.createElement("div", { className: "flex flex-col gap-3" }, [1, 2, 3].map((num) => {
|
|
4231
4243
|
const docType = `other${num}`;
|
|
4232
4244
|
const ref = num === 1 ? other1Ref : num === 2 ? other2Ref : other3Ref;
|
|
4233
4245
|
const isUploading = num === 1 ? isUploadingOther1 : num === 2 ? isUploadingOther2 : isUploadingOther3;
|
|
@@ -4331,7 +4343,7 @@ SECRET_KEY="${secKey}"
|
|
|
4331
4343
|
};
|
|
4332
4344
|
const hasWebhookChanges = webhookUrl !== initialWebhookUrl;
|
|
4333
4345
|
const isWebhookSaveDisabled = isSavingWebhook || isReadOnly || !hasWebhookChanges;
|
|
4334
|
-
return /* @__PURE__ */ React48.createElement("div", { className: "flex flex-col max-w-5xl rounded-2xl p-6 bg-white gap-8 animate-in fade-in duration-300" }, /* @__PURE__ */ React48.createElement(ManagedToaster, null), /* @__PURE__ */ React48.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-3 sm:gap-4" }, /* @__PURE__ */ React48.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React48.createElement("h1", { className: " text-xl text-black mb-1 truncate tracking-tight" }, "Developer Settings"), /* @__PURE__ */ React48.createElement("p", { className: "text-xs text-neutral-500 truncate" }, "Manage your API credentials and webhook integrations.")), isReadOnly && /* @__PURE__ */ React48.createElement("span", { className: "p-2 w-9 h-9 bg-neutral-50 text-neutral-500 rounded-full flex items-center justify-center shrink-0" }, /* @__PURE__ */ React48.createElement(HugeiconsIcon33, { icon: CircleLock02Icon5, size: 18, className: "text-current" }))), isLoading ? /* @__PURE__ */ React48.createElement(PageSpinner6, null) : /* @__PURE__ */ React48.createElement("div", { className: "w-full max-w-5xl flex flex-col gap-12" }, /* @__PURE__ */ React48.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ React48.createElement("div", { className: "space-y-2 min-w-0" }, /* @__PURE__ */ React48.createElement(
|
|
4346
|
+
return /* @__PURE__ */ React48.createElement("div", { className: "flex flex-col max-w-5xl rounded-2xl p-6 bg-white gap-8 animate-in fade-in duration-300" }, /* @__PURE__ */ React48.createElement(ManagedToaster, null), /* @__PURE__ */ React48.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-3 sm:gap-4" }, /* @__PURE__ */ React48.createElement("div", { className: "min-w-0" }, /* @__PURE__ */ React48.createElement("h1", { className: " text-xl text-black mb-1 truncate gradient-text tracking-tight" }, "Developer Settings"), /* @__PURE__ */ React48.createElement("p", { className: "text-xs text-neutral-500 truncate" }, "Manage your API credentials and webhook integrations.")), isReadOnly && /* @__PURE__ */ React48.createElement("span", { className: "p-2 w-9 h-9 bg-neutral-50 text-neutral-500 rounded-full flex items-center justify-center shrink-0" }, /* @__PURE__ */ React48.createElement(HugeiconsIcon33, { icon: CircleLock02Icon5, size: 18, className: "text-current" }))), isLoading ? /* @__PURE__ */ React48.createElement(PageSpinner6, null) : /* @__PURE__ */ React48.createElement("div", { className: "w-full max-w-5xl flex flex-col gap-12" }, /* @__PURE__ */ React48.createElement("div", { className: "flex flex-col gap-6" }, /* @__PURE__ */ React48.createElement("div", { className: "space-y-2 min-w-0" }, /* @__PURE__ */ React48.createElement(
|
|
4335
4347
|
TextInput,
|
|
4336
4348
|
{
|
|
4337
4349
|
label: "Public Key",
|