@retinalabsllc/zairusjs 16.1.2 → 16.1.30

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 CHANGED
@@ -75,6 +75,7 @@ __export(index_exports, {
75
75
  UniversalReferralPage: () => UniversalReferralPage,
76
76
  UniversalRewardPage: () => UniversalRewardPage,
77
77
  UniversalSecurityPage: () => UniversalSecurityPage,
78
+ UniversalSettings: () => UniversalSettings,
78
79
  UniversalSidebar: () => UniversalSidebar,
79
80
  UniversalTransactionPage: () => UniversalTransactionPage,
80
81
  UniversalVerificationPage: () => UniversalVerificationPage,
@@ -610,7 +611,7 @@ function AuthFormInner({
610
611
  onKeyDown: (e) => {
611
612
  if (e.key === "Backspace" && !otp[index] && index > 0) inputRefs.current[index - 1]?.focus();
612
613
  },
613
- className: "w-10 h-12 text-center text-lg bg-transparent border-b-2 border-neutral-200 text-black outline-none focus:border-black transition-all duration-300"
614
+ className: "w-10 h-10 text-center text-sm bg-transparent border-b-2 border-neutral-200 text-black outline-none focus:border-black transition-all duration-300"
614
615
  }
615
616
  ))), /* @__PURE__ */ import_react6.default.createElement("div", { className: "flex flex-col gap-4" }, /* @__PURE__ */ import_react6.default.createElement(ThreeDActionButton, { type: "submit", disabled: otp.join("").length < 6, isLoading: isSubmitting, className: "w-full" }, "Verify Code"), !userHas2FA && /* @__PURE__ */ import_react6.default.createElement(
616
617
  "button",
@@ -4496,6 +4497,7 @@ var UniversalBuyCryptoPage = ({
4496
4497
 
4497
4498
  // src/components/UniversalDepartmentsPage.tsx
4498
4499
  var import_react77 = __toESM(require("react"));
4500
+ var import_react_hot_toast13 = __toESM(require("react-hot-toast"));
4499
4501
  var import_react78 = require("@hugeicons/react");
4500
4502
  var import_core_free_icons27 = require("@hugeicons/core-free-icons");
4501
4503
  var formatMembersCount = (num) => {
@@ -4512,16 +4514,74 @@ var UniversalDepartmentsPage = ({
4512
4514
  currentPage,
4513
4515
  totalPages,
4514
4516
  onPageChange,
4515
- onDepartmentClick
4517
+ onDepartmentClick,
4518
+ onCreateDepartment
4516
4519
  }) => {
4517
- return /* @__PURE__ */ import_react77.default.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ import_react77.default.createElement("div", { className: "flex flex-col gap-8 p-6 rounded-2xl bg-white w-full" }, /* @__PURE__ */ import_react77.default.createElement("div", { className: "flex flex-col sm:flex-row sm:items-start justify-between gap-4" }, /* @__PURE__ */ import_react77.default.createElement("div", null, /* @__PURE__ */ import_react77.default.createElement("h1", { className: "text-black text-xl mb-1 tracking-tight" }, headerTitle), headerDescription && /* @__PURE__ */ import_react77.default.createElement("p", { className: "text-[12px] text-neutral-500" }, headerDescription))), /* @__PURE__ */ import_react77.default.createElement("div", { className: "w-full overflow-hidden" }, isLoading ? /* @__PURE__ */ import_react77.default.createElement(PageSpinner6, null) : /* @__PURE__ */ import_react77.default.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ import_react77.default.createElement("div", null, departments.length === 0 ? /* @__PURE__ */ import_react77.default.createElement("p", { className: "text-[12px] text-neutral-400 py-6 text-center" }, "No departments available") : departments.map((dept) => /* @__PURE__ */ import_react77.default.createElement(
4520
+ const [isCreateMode, setIsCreateMode] = (0, import_react77.useState)(false);
4521
+ const [deptName, setDeptName] = (0, import_react77.useState)("");
4522
+ const [isCreating, setIsCreating] = (0, import_react77.useState)(false);
4523
+ const handleCreateSubmit = async (e) => {
4524
+ e.preventDefault();
4525
+ if (deptName.length < 2 || isCreating || !onCreateDepartment) return;
4526
+ setIsCreating(true);
4527
+ try {
4528
+ await onCreateDepartment(deptName);
4529
+ setDeptName("");
4530
+ setIsCreateMode(false);
4531
+ } catch (error) {
4532
+ import_react_hot_toast13.default.error(error.message || "Failed to create department.");
4533
+ } finally {
4534
+ setIsCreating(false);
4535
+ }
4536
+ };
4537
+ return /* @__PURE__ */ import_react77.default.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ import_react77.default.createElement("div", { className: "flex flex-col gap-8 p-6 rounded-2xl bg-white w-full" }, /* @__PURE__ */ import_react77.default.createElement("div", { className: "flex flex-col gap-1" }, /* @__PURE__ */ import_react77.default.createElement("div", { className: "flex flex-row items-center justify-between gap-4" }, /* @__PURE__ */ import_react77.default.createElement("h2", { className: "text-black text-xl tracking-tight" }, isCreateMode ? "Create Department" : headerTitle), !isCreateMode && onCreateDepartment && /* @__PURE__ */ import_react77.default.createElement(
4538
+ "button",
4539
+ {
4540
+ onClick: () => setIsCreateMode(true),
4541
+ className: "shrink-0 px-4 py-1.5 border border-neutral-200 text-black text-[12px] tracking-wide rounded-full hover:bg-neutral-50 transition-colors outline-none"
4542
+ },
4543
+ "Create new"
4544
+ )), !isCreateMode && headerDescription && /* @__PURE__ */ import_react77.default.createElement("p", { className: "text-[12px] text-neutral-500" }, headerDescription)), /* @__PURE__ */ import_react77.default.createElement("div", { className: "w-full overflow-hidden" }, isCreateMode ? /* @__PURE__ */ import_react77.default.createElement("form", { onSubmit: handleCreateSubmit, className: "flex flex-col gap-8 animate-in fade-in duration-300 mt-2" }, /* @__PURE__ */ import_react77.default.createElement("div", { className: "space-y-1.5" }, /* @__PURE__ */ import_react77.default.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block" }, "Department Name"), /* @__PURE__ */ import_react77.default.createElement(
4545
+ "input",
4546
+ {
4547
+ type: "text",
4548
+ value: deptName,
4549
+ onChange: (e) => setDeptName(e.target.value),
4550
+ required: true,
4551
+ autoFocus: true,
4552
+ maxLength: 50,
4553
+ className: "w-full px-2 py-3 bg-transparent text-sm border-b border-neutral-200 text-black outline-none focus:border-black transition-all duration-300",
4554
+ placeholder: "e.g. Engineering, Marketing..."
4555
+ }
4556
+ )), /* @__PURE__ */ import_react77.default.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ import_react77.default.createElement(
4557
+ ThreeDActionButton,
4558
+ {
4559
+ type: "submit",
4560
+ disabled: deptName.length < 2 || isCreating,
4561
+ isLoading: isCreating,
4562
+ className: "w-full"
4563
+ },
4564
+ "Create Department"
4565
+ ), /* @__PURE__ */ import_react77.default.createElement(
4566
+ "button",
4567
+ {
4568
+ type: "button",
4569
+ onClick: () => {
4570
+ setIsCreateMode(false);
4571
+ setDeptName("");
4572
+ },
4573
+ disabled: isCreating,
4574
+ className: "w-full flex items-center justify-center py-2.5 rounded-full border border-neutral-200 text-black hover:bg-neutral-50 transition-colors outline-none text-xs tracking-wide"
4575
+ },
4576
+ "Cancel"
4577
+ ))) : isLoading ? /* @__PURE__ */ import_react77.default.createElement(PageSpinner6, null) : /* @__PURE__ */ import_react77.default.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ import_react77.default.createElement("div", null, departments.length === 0 ? /* @__PURE__ */ import_react77.default.createElement("p", { className: "text-[12px] text-neutral-400 py-6 text-center" }, "No departments available") : departments.map((dept) => /* @__PURE__ */ import_react77.default.createElement(
4518
4578
  "div",
4519
4579
  {
4520
4580
  key: dept.id,
4521
4581
  onClick: () => onDepartmentClick(dept.id),
4522
4582
  className: "flex flex-col py-4 hover:bg-neutral-50 transition-colors cursor-pointer group min-w-0 px-3 -mx-3 rounded-xl gap-2"
4523
4583
  },
4524
- /* @__PURE__ */ import_react77.default.createElement("p", { className: "text-[14px] text-black tracking-tight truncate" }, dept.name),
4584
+ /* @__PURE__ */ import_react77.default.createElement("p", { className: "text-[12px] text-black tracking-tight truncate" }, dept.name),
4525
4585
  /* @__PURE__ */ import_react77.default.createElement("div", { className: "flex items-center gap-3 min-w-0" }, dept.avatars && dept.avatars.length > 0 && /* @__PURE__ */ import_react77.default.createElement("div", { className: "flex items-center -space-x-2 shrink-0" }, dept.avatars.slice(0, 4).map((src, idx) => /* @__PURE__ */ import_react77.default.createElement("div", { key: idx, className: "w-7 h-7 rounded-lg border-2 border-white bg-neutral-100 overflow-hidden shrink-0" }, /* @__PURE__ */ import_react77.default.createElement(
4526
4586
  "img",
4527
4587
  {
@@ -4530,7 +4590,7 @@ var UniversalDepartmentsPage = ({
4530
4590
  className: "w-full h-full object-cover"
4531
4591
  }
4532
4592
  )))), dept.totalMembers > 0 ? /* @__PURE__ */ import_react77.default.createElement("span", { className: "text-[11px] text-neutral-500 truncate block" }, formatMembersCount(dept.totalMembers), " ", dept.totalMembers > 4 ? "+" : "") : /* @__PURE__ */ import_react77.default.createElement("span", { className: "text-[11px] text-neutral-400 truncate block" }, "Empty"))
4533
- ))), /* @__PURE__ */ import_react77.default.createElement("div", { className: "flex items-center justify-between pt-6 mt-2" }, /* @__PURE__ */ import_react77.default.createElement("span", { className: "text-[11px] text-neutral-400 tracking-[0.2em]" }, "Page ", currentPage, " of ", totalPages === 0 ? 1 : totalPages), /* @__PURE__ */ import_react77.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react77.default.createElement(
4593
+ ))), /* @__PURE__ */ import_react77.default.createElement("div", { className: "flex items-center justify-between pt-6 mt-2 " }, /* @__PURE__ */ import_react77.default.createElement("span", { className: "text-[11px] text-neutral-400 tracking-[0.2em]" }, "Page ", currentPage, " of ", totalPages === 0 ? 1 : totalPages), /* @__PURE__ */ import_react77.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react77.default.createElement(
4534
4594
  "button",
4535
4595
  {
4536
4596
  onClick: () => onPageChange(currentPage - 1),
@@ -4552,7 +4612,7 @@ var UniversalDepartmentsPage = ({
4552
4612
  // src/components/UniversalMembersPage.tsx
4553
4613
  var import_react79 = __toESM(require("react"));
4554
4614
  var import_react80 = require("@hugeicons/react");
4555
- var import_react_hot_toast13 = __toESM(require("react-hot-toast"));
4615
+ var import_react_hot_toast14 = __toESM(require("react-hot-toast"));
4556
4616
  var import_core_free_icons28 = require("@hugeicons/core-free-icons");
4557
4617
  var MemberAvatar = ({ src, status }) => {
4558
4618
  const [loaded, setLoaded] = (0, import_react79.useState)(false);
@@ -4647,11 +4707,11 @@ var UniversalMembersPage = ({
4647
4707
  setIsRemoving(true);
4648
4708
  try {
4649
4709
  await onRemoveMember(memberToRemove.id);
4650
- import_react_hot_toast13.default.success("Member removed successfully.");
4710
+ import_react_hot_toast14.default.success("Member removed successfully.");
4651
4711
  setExpandedId(null);
4652
4712
  setMemberToRemove(null);
4653
4713
  } catch (error) {
4654
- import_react_hot_toast13.default.error("Failed to remove member.");
4714
+ import_react_hot_toast14.default.error("Failed to remove member.");
4655
4715
  } finally {
4656
4716
  setIsRemoving(false);
4657
4717
  }
@@ -4665,7 +4725,7 @@ var UniversalMembersPage = ({
4665
4725
  setInviteEmail("");
4666
4726
  setIsInviteMode(false);
4667
4727
  } catch (error) {
4668
- import_react_hot_toast13.default.error(error.message || "Failed to send invitation.");
4728
+ import_react_hot_toast14.default.error(error.message || "Failed to send invitation.");
4669
4729
  } finally {
4670
4730
  setIsInviting(false);
4671
4731
  }
@@ -4812,11 +4872,14 @@ var UniversalMembersPage = ({
4812
4872
  var import_react81 = __toESM(require("react"));
4813
4873
  var import_navigation6 = require("next/navigation");
4814
4874
  var import_react82 = require("@hugeicons/react");
4815
- var import_react_hot_toast14 = __toESM(require("react-hot-toast"));
4875
+ var import_react_hot_toast15 = __toESM(require("react-hot-toast"));
4816
4876
  var import_core_free_icons29 = require("@hugeicons/core-free-icons");
4817
4877
  var UniversalHome2 = ({
4818
4878
  avatarSrc,
4819
4879
  userStatus = "ACTIVE",
4880
+ organizations = [],
4881
+ activeOrgId,
4882
+ onOrganizationSelect,
4820
4883
  barIcons = [],
4821
4884
  createHuddleAction,
4822
4885
  joinHuddleAction,
@@ -4833,6 +4896,7 @@ var UniversalHome2 = ({
4833
4896
  }) => {
4834
4897
  const [isAvatarLoaded, setIsAvatarLoaded] = (0, import_react81.useState)(false);
4835
4898
  const [showNotifDialog, setShowNotifDialog] = (0, import_react81.useState)(false);
4899
+ const [showOrgSwitcher, setShowOrgSwitcher] = (0, import_react81.useState)(false);
4836
4900
  const [selectedNotif, setSelectedNotif] = (0, import_react81.useState)(null);
4837
4901
  const [isResolving, setIsResolving] = (0, import_react81.useState)(false);
4838
4902
  const router = (0, import_navigation6.useRouter)();
@@ -4861,12 +4925,12 @@ var UniversalHome2 = ({
4861
4925
  setShowNotifDialog(false);
4862
4926
  setSelectedNotif(null);
4863
4927
  } catch (error) {
4864
- import_react_hot_toast14.default.error("Failed to process invitation");
4928
+ import_react_hot_toast15.default.error("Failed to process invitation");
4865
4929
  } finally {
4866
4930
  setIsResolving(false);
4867
4931
  }
4868
4932
  };
4869
- return /* @__PURE__ */ import_react81.default.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300 relative" }, /* @__PURE__ */ import_react81.default.createElement("div", { className: "flex items-center justify-between w-full pb-4" }, /* @__PURE__ */ import_react81.default.createElement("div", { className: "w-10 h-10 shrink-0 cursor-pointer", onClick: () => router.push("/app/profile") }, /* @__PURE__ */ import_react81.default.createElement("div", { className: "relative w-full h-full rounded-lg overflow-hidden bg-white flex items-center justify-center" }, !isAvatarLoaded && /* @__PURE__ */ import_react81.default.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-10 bg-white" }, /* @__PURE__ */ import_react81.default.createElement(import_react82.HugeiconsIcon, { icon: import_core_free_icons29.Loading03Icon, size: 16, className: "animate-spin text-black" })), /* @__PURE__ */ import_react81.default.createElement(
4933
+ return /* @__PURE__ */ import_react81.default.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300 relative" }, /* @__PURE__ */ import_react81.default.createElement("div", { className: "flex items-center justify-between w-full pb-4" }, /* @__PURE__ */ import_react81.default.createElement("div", { className: "w-10 h-10 shrink-0 cursor-pointer", onClick: () => setShowOrgSwitcher(true) }, /* @__PURE__ */ import_react81.default.createElement("div", { className: "relative w-full h-full rounded-lg overflow-hidden bg-white flex items-center justify-center" }, !isAvatarLoaded && /* @__PURE__ */ import_react81.default.createElement("div", { className: "absolute inset-0 flex items-center justify-center z-10 bg-white" }, /* @__PURE__ */ import_react81.default.createElement(import_react82.HugeiconsIcon, { icon: import_core_free_icons29.Loading03Icon, size: 16, className: "animate-spin text-black" })), /* @__PURE__ */ import_react81.default.createElement(
4870
4934
  "img",
4871
4935
  {
4872
4936
  src: finalAvatarSrc,
@@ -4874,13 +4938,13 @@ var UniversalHome2 = ({
4874
4938
  onLoad: () => setIsAvatarLoaded(true),
4875
4939
  className: `w-full h-full object-cover transition-opacity duration-300 ${isAvatarLoaded ? "opacity-100" : "opacity-0"}`
4876
4940
  }
4877
- ))), /* @__PURE__ */ import_react81.default.createElement("div", { className: "flex-1 h-10 bg-black rounded-full mx-3 flex items-center justify-between px-4" }, /* @__PURE__ */ import_react81.default.createElement("div", { className: "flex items-center gap-3" }, barIcons.map((item, idx) => /* @__PURE__ */ import_react81.default.createElement("button", { key: idx, onClick: item.onClick, className: "outline-none hover:opacity-70 transition-opacity flex items-center justify-center" }, /* @__PURE__ */ import_react81.default.createElement(import_react82.HugeiconsIcon, { icon: item.icon, size: 16, color: item.color || "white" })))), /* @__PURE__ */ import_react81.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react81.default.createElement("span", { className: "text-white text-[11px] tracking-widest" }, getDisplayStatus()), /* @__PURE__ */ import_react81.default.createElement("div", { className: `w-2 h-2 rounded-full ${getStatusColor()}` }))), /* @__PURE__ */ import_react81.default.createElement("div", { className: "flex items-center gap-2 shrink-0" }, /* @__PURE__ */ import_react81.default.createElement(
4941
+ ))), /* @__PURE__ */ import_react81.default.createElement("div", { className: "flex items-center gap-2 shrink-0" }, /* @__PURE__ */ import_react81.default.createElement(
4878
4942
  "button",
4879
4943
  {
4880
4944
  onClick: () => router.push("/app/settings"),
4881
4945
  className: "relative w-10 h-10 flex items-center justify-center rounded-full bg-white outline-none hover:bg-neutral-50 transition-colors"
4882
4946
  },
4883
- /* @__PURE__ */ import_react81.default.createElement(import_react82.HugeiconsIcon, { icon: import_core_free_icons29.Settings01Icon, size: 20, className: "text-black" })
4947
+ /* @__PURE__ */ import_react81.default.createElement(import_react82.HugeiconsIcon, { icon: import_core_free_icons29.Settings03Icon, size: 20, className: "text-black" })
4884
4948
  ), /* @__PURE__ */ import_react81.default.createElement(
4885
4949
  "button",
4886
4950
  {
@@ -4927,7 +4991,19 @@ var UniversalHome2 = ({
4927
4991
  {
4928
4992
  ...departmentsProps
4929
4993
  }
4930
- )), showNotifDialog && /* @__PURE__ */ import_react81.default.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react81.default.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: () => setShowNotifDialog(false) }), /* @__PURE__ */ import_react81.default.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 h-[80vh]" }, /* @__PURE__ */ import_react81.default.createElement("div", { className: "flex items-center justify-between p-5 shrink-0" }, selectedNotif ? /* @__PURE__ */ import_react81.default.createElement("button", { onClick: () => setSelectedNotif(null), disabled: isResolving, className: "text-neutral-400 hover:text-black transition-colors outline-none flex items-center gap-2 text-[11px] tracking-widest disabled:opacity-50" }, /* @__PURE__ */ import_react81.default.createElement(import_react82.HugeiconsIcon, { icon: import_core_free_icons29.ArrowLeft01Icon, size: 14 }), " Back") : /* @__PURE__ */ import_react81.default.createElement("h3", { className: "text-[15px] text-black tracking-tight flex items-center gap-2" }, "Notifications", isNotifsLoading && /* @__PURE__ */ import_react81.default.createElement(import_react82.HugeiconsIcon, { icon: import_core_free_icons29.Loading03Icon, size: 14, className: "animate-spin text-neutral-400" })), /* @__PURE__ */ import_react81.default.createElement("button", { onClick: () => setShowNotifDialog(false), disabled: isResolving, className: "text-neutral-400 hover:text-black transition-colors outline-none disabled:opacity-50" }, /* @__PURE__ */ import_react81.default.createElement(import_react82.HugeiconsIcon, { icon: import_core_free_icons29.CancelCircleIcon, size: 18 }))), /* @__PURE__ */ import_react81.default.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-2" }, selectedNotif ? /* @__PURE__ */ import_react81.default.createElement("div", { className: "p-4 text-left" }, /* @__PURE__ */ import_react81.default.createElement("h4", { className: "text-[14px] text-black mb-1" }, selectedNotif.title), /* @__PURE__ */ import_react81.default.createElement("span", { className: "text-[10px] text-neutral-400 tracking-widest mb-4 block" }, formatNotifDate(selectedNotif.createdAt)), /* @__PURE__ */ import_react81.default.createElement("p", { className: "text-[12px] text-neutral-600 leading-relaxed whitespace-pre-wrap" }, selectedNotif.message), selectedNotif.type === "HUDDLE_INVITE" && selectedNotif.meta_json?.action === "RESOLVE_INVITE" && /* @__PURE__ */ import_react81.default.createElement("div", { className: "mt-8 flex gap-3 pt-6 border-t border-neutral-100" }, /* @__PURE__ */ import_react81.default.createElement(
4994
+ )), showOrgSwitcher && /* @__PURE__ */ import_react81.default.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react81.default.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: () => setShowOrgSwitcher(false) }), /* @__PURE__ */ import_react81.default.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 h-auto max-h-[80vh]" }, /* @__PURE__ */ import_react81.default.createElement("div", { className: "flex items-center justify-between p-5 shrink-0 border-b border-neutral-100" }, /* @__PURE__ */ import_react81.default.createElement("h3", { className: "text-[15px] text-black tracking-tight" }, "Switch Workspace"), /* @__PURE__ */ import_react81.default.createElement("button", { onClick: () => setShowOrgSwitcher(false), className: "text-neutral-400 hover:text-black transition-colors outline-none" }, /* @__PURE__ */ import_react81.default.createElement(import_react82.HugeiconsIcon, { icon: import_core_free_icons29.CancelCircleIcon, size: 18 }))), /* @__PURE__ */ import_react81.default.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-2" }, /* @__PURE__ */ import_react81.default.createElement("div", { className: "flex flex-col" }, organizations?.length === 0 ? /* @__PURE__ */ import_react81.default.createElement("div", { className: "p-8 text-center text-xs text-neutral-400" }, "No organizations found.") : organizations?.map((org) => /* @__PURE__ */ import_react81.default.createElement(
4995
+ "button",
4996
+ {
4997
+ key: org.id,
4998
+ onClick: () => {
4999
+ onOrganizationSelect?.(org.id);
5000
+ setShowOrgSwitcher(false);
5001
+ },
5002
+ className: `p-4 flex items-center justify-between gap-3 cursor-pointer outline-none transition-colors last:border-0 ${activeOrgId === org.id ? "bg-neutral-50" : "hover:bg-neutral-50/50"}`
5003
+ },
5004
+ /* @__PURE__ */ import_react81.default.createElement("span", { className: `text-[13px] tracking-tight ${activeOrgId === org.id ? "text-black " : "text-neutral-600"}` }, org.name),
5005
+ activeOrgId === org.id && /* @__PURE__ */ import_react81.default.createElement("div", { className: "w-2 h-2 rounded-full bg-emerald-500" })
5006
+ )))))), showNotifDialog && /* @__PURE__ */ import_react81.default.createElement("div", { className: "fixed inset-0 z-120 flex items-center justify-center p-4 pointer-events-auto" }, /* @__PURE__ */ import_react81.default.createElement("div", { className: "absolute inset-0 bg-black/30", onClick: () => setShowNotifDialog(false) }), /* @__PURE__ */ import_react81.default.createElement("div", { className: "relative w-full max-w-sm bg-white rounded-2xl flex flex-col overflow-hidden shadow-2xl animate-in zoom-in-95 duration-200 h-[80vh]" }, /* @__PURE__ */ import_react81.default.createElement("div", { className: "flex items-center justify-between p-5 shrink-0" }, selectedNotif ? /* @__PURE__ */ import_react81.default.createElement("button", { onClick: () => setSelectedNotif(null), disabled: isResolving, className: "text-neutral-400 hover:text-black transition-colors outline-none flex items-center gap-2 text-[11px] tracking-widest disabled:opacity-50" }, /* @__PURE__ */ import_react81.default.createElement(import_react82.HugeiconsIcon, { icon: import_core_free_icons29.ArrowLeft01Icon, size: 14 }), " Back") : /* @__PURE__ */ import_react81.default.createElement("h3", { className: "text-[15px] text-black tracking-tight flex items-center gap-2" }, "Notifications", isNotifsLoading && /* @__PURE__ */ import_react81.default.createElement(import_react82.HugeiconsIcon, { icon: import_core_free_icons29.Loading03Icon, size: 14, className: "animate-spin text-neutral-400" })), /* @__PURE__ */ import_react81.default.createElement("button", { onClick: () => setShowNotifDialog(false), disabled: isResolving, className: "text-neutral-400 hover:text-black transition-colors outline-none disabled:opacity-50" }, /* @__PURE__ */ import_react81.default.createElement(import_react82.HugeiconsIcon, { icon: import_core_free_icons29.CancelCircleIcon, size: 18 }))), /* @__PURE__ */ import_react81.default.createElement("div", { className: "flex-1 overflow-y-auto custom-scrollbar p-2" }, selectedNotif ? /* @__PURE__ */ import_react81.default.createElement("div", { className: "p-4 text-left" }, /* @__PURE__ */ import_react81.default.createElement("h4", { className: "text-[14px] text-black mb-1" }, selectedNotif.title), /* @__PURE__ */ import_react81.default.createElement("span", { className: "text-[10px] text-neutral-400 tracking-widest mb-4 block" }, formatNotifDate(selectedNotif.createdAt)), /* @__PURE__ */ import_react81.default.createElement("p", { className: "text-[12px] text-neutral-600 leading-relaxed whitespace-pre-wrap" }, selectedNotif.message), selectedNotif.type === "HUDDLE_INVITE" && selectedNotif.meta_json?.action === "RESOLVE_INVITE" && /* @__PURE__ */ import_react81.default.createElement("div", { className: "mt-8 flex gap-3 pt-6 border-t border-neutral-100" }, /* @__PURE__ */ import_react81.default.createElement(
4931
5007
  "button",
4932
5008
  {
4933
5009
  onClick: () => handleResolve("ACCEPTED"),
@@ -4973,6 +5049,429 @@ var UniversalHome2 = ({
4973
5049
  /* @__PURE__ */ import_react81.default.createElement(import_react82.HugeiconsIcon, { icon: import_core_free_icons29.ArrowRight01Icon, size: 12 })
4974
5050
  ))))));
4975
5051
  };
5052
+
5053
+ // src/components/UniversalSettings.tsx
5054
+ var import_react83 = __toESM(require("react"));
5055
+ var import_react_hot_toast16 = __toESM(require("react-hot-toast"));
5056
+ var import_react84 = require("@hugeicons/react");
5057
+ var import_core_free_icons30 = require("@hugeicons/core-free-icons");
5058
+ var MemberAvatar2 = ({ src, status, sizeClass = "w-10 h-10" }) => {
5059
+ const [loaded, setLoaded] = (0, import_react83.useState)(false);
5060
+ const [error, setError] = (0, import_react83.useState)(false);
5061
+ const defaultAvatar = "https://storage.googleapis.com/retina-cloud-v2/assets/images/avatar.avif";
5062
+ const finalSrc = error || !src ? defaultAvatar : src;
5063
+ const getStatusColor = () => {
5064
+ switch (status?.toUpperCase()) {
5065
+ case "ACTIVE":
5066
+ return "bg-emerald-500";
5067
+ case "BUSY":
5068
+ return "bg-amber-500";
5069
+ case "OFFLINE":
5070
+ return "bg-rose-500";
5071
+ case "AWAY":
5072
+ return "bg-neutral-400";
5073
+ default:
5074
+ return "bg-neutral-200";
5075
+ }
5076
+ };
5077
+ return /* @__PURE__ */ import_react83.default.createElement("div", { className: `relative shrink-0 ${sizeClass}` }, /* @__PURE__ */ import_react83.default.createElement("div", { className: "w-full h-full rounded-lg bg-neutral-100 flex items-center justify-center overflow-hidden" }, !loaded && !error && /* @__PURE__ */ import_react83.default.createElement(import_react84.HugeiconsIcon, { icon: import_core_free_icons30.Loading03Icon, className: "animate-spin text-neutral-400 absolute", size: 14 }), /* @__PURE__ */ import_react83.default.createElement(
5078
+ "img",
5079
+ {
5080
+ src: finalSrc,
5081
+ alt: "Member Avatar",
5082
+ className: `w-full h-full object-cover transition-opacity duration-300 ${loaded || error ? "opacity-100" : "opacity-0"}`,
5083
+ onLoad: () => setLoaded(true),
5084
+ onError: () => setError(true)
5085
+ }
5086
+ )), /* @__PURE__ */ import_react83.default.createElement("div", { className: `absolute -bottom-1 -right-1 w-3.5 h-3.5 rounded-full border-2 border-white z-10 ${getStatusColor()}` }));
5087
+ };
5088
+ var PageSpinner8 = () => /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex justify-center items-center py-12" }, /* @__PURE__ */ import_react83.default.createElement(import_react84.HugeiconsIcon, { icon: import_core_free_icons30.Loading03Icon, size: 32, className: "animate-spin mb-4 text-black" }));
5089
+ var InputSpinner3 = () => /* @__PURE__ */ import_react83.default.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__ */ import_react83.default.createElement("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }), /* @__PURE__ */ import_react83.default.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" }));
5090
+ var UniversalSettings = ({
5091
+ accountType,
5092
+ userRole,
5093
+ members = [],
5094
+ isMembersLoading = false,
5095
+ membersCurrentPage = 1,
5096
+ membersTotalPages = 1,
5097
+ onMembersPageChange = () => {
5098
+ },
5099
+ membersSearchQuery = "",
5100
+ onMembersSearchChange = () => {
5101
+ },
5102
+ activeStatusFilter = "ALL",
5103
+ onStatusFilterChange = () => {
5104
+ },
5105
+ activeRoleFilter = "ALL",
5106
+ onRoleFilterChange = () => {
5107
+ },
5108
+ onRemoveMember,
5109
+ onInviteMember,
5110
+ initialDisplayName,
5111
+ initialSlug,
5112
+ slugPrefixUrl = "https://truhuddle.com/company/",
5113
+ onSaveAccount,
5114
+ onCheckSlugAvailability,
5115
+ aiCredits,
5116
+ isBillingLoading = false,
5117
+ onTopUp,
5118
+ onBack
5119
+ }) => {
5120
+ const onBackHandler = onBack ?? (() => {
5121
+ if (typeof window !== "undefined") window.history.back();
5122
+ });
5123
+ const [activeTab, setActiveTab] = (0, import_react83.useState)(accountType === "ORGANIZATION" ? "MEMBERS" : "ACCOUNT");
5124
+ (0, import_react83.useEffect)(() => {
5125
+ if (accountType === "INDIVIDUAL" && activeTab === "MEMBERS") {
5126
+ setActiveTab("ACCOUNT");
5127
+ }
5128
+ }, [accountType, activeTab]);
5129
+ const [expandedId, setExpandedId] = (0, import_react83.useState)(null);
5130
+ const [memberToRemove, setMemberToRemove] = (0, import_react83.useState)(null);
5131
+ const [isRemoving, setIsRemoving] = (0, import_react83.useState)(false);
5132
+ const [isInviteMode, setIsInviteMode] = (0, import_react83.useState)(false);
5133
+ const [inviteEmail, setInviteEmail] = (0, import_react83.useState)("");
5134
+ const [isInviting, setIsInviting] = (0, import_react83.useState)(false);
5135
+ const [localSearchQuery, setLocalSearchQuery] = (0, import_react83.useState)(membersSearchQuery);
5136
+ const [isTyping, setIsTyping] = (0, import_react83.useState)(false);
5137
+ const [isStatusModalOpen, setIsStatusModalOpen] = (0, import_react83.useState)(false);
5138
+ const [isRoleModalOpen, setIsRoleModalOpen] = (0, import_react83.useState)(false);
5139
+ const statusDropdownRef = (0, import_react83.useRef)(null);
5140
+ const roleDropdownRef = (0, import_react83.useRef)(null);
5141
+ const [displayName, setDisplayName] = (0, import_react83.useState)(initialDisplayName);
5142
+ const [slug, setSlug] = (0, import_react83.useState)(initialSlug);
5143
+ const [isCheckingSlug, setIsCheckingSlug] = (0, import_react83.useState)(false);
5144
+ const [slugAvailable, setSlugAvailable] = (0, import_react83.useState)(null);
5145
+ const [isSavingAccount, setIsSavingAccount] = (0, import_react83.useState)(false);
5146
+ const isAccountReadOnly = accountType === "ORGANIZATION" && userRole !== "ADMIN" && userRole !== "MANAGER";
5147
+ const cleanEmailId = (val) => val.toLowerCase().replace(/[^a-z0-9@._-]/g, "");
5148
+ (0, import_react83.useEffect)(() => {
5149
+ function handleClickOutside(event) {
5150
+ if (statusDropdownRef.current && !statusDropdownRef.current.contains(event.target)) setIsStatusModalOpen(false);
5151
+ if (roleDropdownRef.current && !roleDropdownRef.current.contains(event.target)) setIsRoleModalOpen(false);
5152
+ }
5153
+ document.addEventListener("mousedown", handleClickOutside);
5154
+ return () => document.removeEventListener("mousedown", handleClickOutside);
5155
+ }, []);
5156
+ (0, import_react83.useEffect)(() => {
5157
+ if (activeTab !== "MEMBERS") return;
5158
+ setIsTyping(true);
5159
+ const handler = setTimeout(() => {
5160
+ onMembersSearchChange(localSearchQuery);
5161
+ setIsTyping(false);
5162
+ }, 600);
5163
+ return () => clearTimeout(handler);
5164
+ }, [localSearchQuery, onMembersSearchChange, activeTab]);
5165
+ const handleConfirmRemove = async () => {
5166
+ if (!memberToRemove || !onRemoveMember) return;
5167
+ setIsRemoving(true);
5168
+ try {
5169
+ await onRemoveMember(memberToRemove.id);
5170
+ import_react_hot_toast16.default.success("Member removed successfully.");
5171
+ setExpandedId(null);
5172
+ setMemberToRemove(null);
5173
+ } catch (error) {
5174
+ import_react_hot_toast16.default.error("Failed to remove member.");
5175
+ } finally {
5176
+ setIsRemoving(false);
5177
+ }
5178
+ };
5179
+ const handleInviteSubmit = async (e) => {
5180
+ e.preventDefault();
5181
+ if (inviteEmail.length < 5 || isInviting || !onInviteMember) return;
5182
+ setIsInviting(true);
5183
+ try {
5184
+ await onInviteMember(inviteEmail);
5185
+ setInviteEmail("");
5186
+ setIsInviteMode(false);
5187
+ } catch (error) {
5188
+ import_react_hot_toast16.default.error(error.message || "Failed to send invitation.");
5189
+ } finally {
5190
+ setIsInviting(false);
5191
+ }
5192
+ };
5193
+ const activeExpandedMember = expandedId ? members.find((m) => m.id === expandedId) : null;
5194
+ (0, import_react83.useEffect)(() => {
5195
+ setDisplayName(initialDisplayName || "");
5196
+ setSlug(initialSlug || "");
5197
+ }, [initialDisplayName, initialSlug]);
5198
+ const handleDisplayNameChange = (val) => setDisplayName(val.replace(/[^a-zA-Z0-9\s-]/g, "").substring(0, 50));
5199
+ const handleSlugChange = (val) => setSlug(val.toLowerCase().replace(/[^a-z0-9-]/g, "").replace(/-+/g, "-").substring(0, 50));
5200
+ (0, import_react83.useEffect)(() => {
5201
+ if (!slug || slug === initialSlug) {
5202
+ setSlugAvailable(null);
5203
+ setIsCheckingSlug(false);
5204
+ return;
5205
+ }
5206
+ if (slug.length < 3) {
5207
+ setSlugAvailable(false);
5208
+ setIsCheckingSlug(false);
5209
+ return;
5210
+ }
5211
+ setIsCheckingSlug(true);
5212
+ setSlugAvailable(null);
5213
+ const checkTimer = setTimeout(async () => {
5214
+ try {
5215
+ if (onCheckSlugAvailability) {
5216
+ const res = await onCheckSlugAvailability(slug);
5217
+ setSlugAvailable(res.available);
5218
+ }
5219
+ } catch (error) {
5220
+ setSlugAvailable(null);
5221
+ } finally {
5222
+ setIsCheckingSlug(false);
5223
+ }
5224
+ }, 1500);
5225
+ return () => clearTimeout(checkTimer);
5226
+ }, [slug, initialSlug, onCheckSlugAvailability]);
5227
+ const handleSaveAccount = async (e) => {
5228
+ e.preventDefault();
5229
+ if (isSavingAccount || isCheckingSlug || isAccountReadOnly || !onSaveAccount) return;
5230
+ if (slug !== initialSlug && slugAvailable === false) {
5231
+ import_react_hot_toast16.default.error("Please select an available address handle.");
5232
+ return;
5233
+ }
5234
+ setIsSavingAccount(true);
5235
+ try {
5236
+ const payload = {
5237
+ displayName: displayName !== initialDisplayName ? displayName : void 0,
5238
+ slug: slug !== initialSlug ? slug : void 0
5239
+ };
5240
+ const res = await onSaveAccount(payload);
5241
+ if (res.success) {
5242
+ import_react_hot_toast16.default.success("Profile updated successfully.");
5243
+ } else {
5244
+ import_react_hot_toast16.default.error(res.error || "Failed to update profile.");
5245
+ }
5246
+ } catch (error) {
5247
+ import_react_hot_toast16.default.error("Service unavailable. Try again later.");
5248
+ } finally {
5249
+ setIsSavingAccount(false);
5250
+ }
5251
+ };
5252
+ const hasAccountChanges = displayName !== initialDisplayName || slug !== initialSlug;
5253
+ const isAccountSaveDisabled = isSavingAccount || isAccountReadOnly || isCheckingSlug || !hasAccountChanges || displayName.length < 3 || slug.length < 3 || slug !== initialSlug && slugAvailable === false;
5254
+ return /* @__PURE__ */ import_react83.default.createElement("div", { className: "w-full max-w-3xl mx-auto flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ import_react83.default.createElement(ManagedToaster, null), /* @__PURE__ */ import_react83.default.createElement("div", { className: "mb-6 flex w-full items-center px-1" }, /* @__PURE__ */ import_react83.default.createElement("button", { onClick: onBackHandler, className: "flex items-center gap-2 text-neutral-500 hover:text-black transition-colors text-[13px] outline-none" }, /* @__PURE__ */ import_react83.default.createElement(import_react84.HugeiconsIcon, { icon: import_core_free_icons30.ArrowLeft01Icon, size: 16 }), " Back")), /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex flex-col gap-1 mb-8 px-1" }, /* @__PURE__ */ import_react83.default.createElement("h1", { className: "text-black text-xl tracking-tight" }, "System Settings"), /* @__PURE__ */ import_react83.default.createElement("p", { className: "text-xs text-neutral-500" }, "Manage your workspace identity, team configurations, and AI billing parameters.")), /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex items-center gap-6 border-b border-neutral-200 mb-6 overflow-x-auto custom-scrollbar px-1" }, accountType === "ORGANIZATION" && /* @__PURE__ */ import_react83.default.createElement(
5255
+ "button",
5256
+ {
5257
+ onClick: () => {
5258
+ setActiveTab("MEMBERS");
5259
+ setExpandedId(null);
5260
+ setIsInviteMode(false);
5261
+ },
5262
+ className: `pb-3 text-[13px] tracking-wide outline-none transition-colors border-b-2 whitespace-nowrap ${activeTab === "MEMBERS" ? "border-black text-black" : "border-transparent text-neutral-500 hover:text-black"}`
5263
+ },
5264
+ "Members"
5265
+ ), /* @__PURE__ */ import_react83.default.createElement(
5266
+ "button",
5267
+ {
5268
+ onClick: () => setActiveTab("ACCOUNT"),
5269
+ className: `pb-3 text-[13px] tracking-wide outline-none transition-colors border-b-2 whitespace-nowrap ${activeTab === "ACCOUNT" ? "border-black text-black" : "border-transparent text-neutral-500 hover:text-black"}`
5270
+ },
5271
+ "Account Profile"
5272
+ ), /* @__PURE__ */ import_react83.default.createElement(
5273
+ "button",
5274
+ {
5275
+ onClick: () => setActiveTab("BILLING"),
5276
+ className: `pb-3 text-[13px] tracking-wide outline-none transition-colors border-b-2 whitespace-nowrap ${activeTab === "BILLING" ? "border-black text-black" : "border-transparent text-neutral-500 hover:text-black"}`
5277
+ },
5278
+ "Billing"
5279
+ )), activeTab === "MEMBERS" && accountType === "ORGANIZATION" && /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ import_react83.default.createElement(
5280
+ ConfirmationDialog,
5281
+ {
5282
+ isOpen: !!memberToRemove,
5283
+ title: "Remove Member",
5284
+ message: `Are you sure you want to remove ${memberToRemove?.name}? This action cannot be undone.`,
5285
+ confirmText: "Remove",
5286
+ cancelText: "Cancel",
5287
+ isProcessing: isRemoving,
5288
+ isDestructive: true,
5289
+ onClose: () => setMemberToRemove(null),
5290
+ onConfirm: handleConfirmRemove
5291
+ }
5292
+ ), !isInviteMode && !activeExpandedMember && /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex flex-row flex-nowrap mb-4 items-center justify-between gap-4 w-full px-1" }, /* @__PURE__ */ import_react83.default.createElement("div", { className: "relative flex-1 min-w-0 max-w-full" }, /* @__PURE__ */ import_react83.default.createElement("div", { className: "absolute inset-y-0 left-0 pl-4 flex items-center pointer-events-none" }, /* @__PURE__ */ import_react83.default.createElement(import_react84.HugeiconsIcon, { icon: import_core_free_icons30.Search01Icon, size: 16, className: "text-neutral-400" })), /* @__PURE__ */ import_react83.default.createElement(
5293
+ "input",
5294
+ {
5295
+ type: "text",
5296
+ placeholder: "Search members...",
5297
+ value: localSearchQuery,
5298
+ onChange: (e) => setLocalSearchQuery(e.target.value),
5299
+ className: "w-full pl-10 pr-4 py-2 bg-white rounded-full text-[13px] text-black placeholder-neutral-400 outline-none transition-colors focus:border-black"
5300
+ }
5301
+ )), /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex items-center gap-3 w-auto pb-0 shrink-0" }, /* @__PURE__ */ import_react83.default.createElement(
5302
+ "button",
5303
+ {
5304
+ onClick: () => setIsStatusModalOpen(true),
5305
+ className: "flex items-center justify-center bg-white w-9 h-9 rounded-full text-neutral-500 hover:text-black transition-colors outline-none"
5306
+ },
5307
+ /* @__PURE__ */ import_react83.default.createElement(import_react84.HugeiconsIcon, { icon: import_core_free_icons30.SearchList02Icon, size: 16 })
5308
+ ), /* @__PURE__ */ import_react83.default.createElement(
5309
+ "button",
5310
+ {
5311
+ onClick: () => setIsRoleModalOpen(true),
5312
+ className: "flex items-center justify-center bg-white w-9 h-9 rounded-full text-neutral-500 hover:text-black transition-colors outline-none"
5313
+ },
5314
+ /* @__PURE__ */ import_react83.default.createElement(import_react84.HugeiconsIcon, { icon: import_core_free_icons30.ListSettingIcon, size: 16 })
5315
+ ))), /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex flex-col gap-8 p-6 rounded-2xl bg-white w-full" }, activeExpandedMember ? /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex flex-col animate-in fade-in zoom-in-95 duration-300 w-full" }, /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex flex-col gap-1 mb-8" }, /* @__PURE__ */ import_react83.default.createElement("h2", { className: "text-black text-xl tracking-tight" }, "Member Profile"), /* @__PURE__ */ import_react83.default.createElement("p", { className: "text-[12px] text-neutral-500" }, "View and manage this member's access privileges.")), /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex items-center gap-4 mb-8" }, /* @__PURE__ */ import_react83.default.createElement(MemberAvatar2, { src: activeExpandedMember.avatarUrl, status: activeExpandedMember.status, sizeClass: "w-14 h-14" }), /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex flex-col min-w-0" }, /* @__PURE__ */ import_react83.default.createElement("span", { className: "text-sm text-black tracking-tight truncate" }, activeExpandedMember.name), /* @__PURE__ */ import_react83.default.createElement("span", { className: "text-[12px] text-neutral-500 capitalize" }, activeExpandedMember.role.toLowerCase()))), activeExpandedMember.departmentName && /* @__PURE__ */ import_react83.default.createElement("div", { className: "mb-8" }, /* @__PURE__ */ import_react83.default.createElement("span", { className: "text-[11px] tracking-[0.2em] text-neutral-400 block mb-1" }, "Assigned Department"), /* @__PURE__ */ import_react83.default.createElement("span", { className: "text-[12px] text-black truncate block" }, activeExpandedMember.departmentName)), /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex flex-col sm:flex-row gap-3 pt-6 border-t border-neutral-100" }, !isAccountReadOnly && /* @__PURE__ */ import_react83.default.createElement(
5316
+ "button",
5317
+ {
5318
+ onClick: () => setMemberToRemove(activeExpandedMember),
5319
+ className: "w-full sm:flex-1 py-2.5 bg-white border border-rose-200 text-rose-600 hover:bg-rose-50 rounded-full text-[12px] tracking-wide transition-colors outline-none"
5320
+ },
5321
+ "Remove Access"
5322
+ ), /* @__PURE__ */ import_react83.default.createElement(
5323
+ "button",
5324
+ {
5325
+ onClick: () => setExpandedId(null),
5326
+ className: "w-full sm:flex-1 py-2.5 bg-white border border-neutral-200 text-black hover:bg-neutral-100 rounded-full text-[12px] tracking-wide transition-colors outline-none"
5327
+ },
5328
+ "Close Profile"
5329
+ ))) : (
5330
+ // Standard List & Invite Header
5331
+ /* @__PURE__ */ import_react83.default.createElement(import_react83.default.Fragment, null, /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex flex-col gap-1" }, /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex flex-row items-center justify-between gap-4" }, /* @__PURE__ */ import_react83.default.createElement("h2", { className: "text-black text-xl tracking-tight" }, isInviteMode ? "Add Member" : "Team Directory"), !isInviteMode && !isAccountReadOnly && /* @__PURE__ */ import_react83.default.createElement(
5332
+ "button",
5333
+ {
5334
+ onClick: () => setIsInviteMode(true),
5335
+ className: "shrink-0 px-4 py-1.5 border border-neutral-200 text-black text-[12px] tracking-wide rounded-full hover:bg-neutral-50 transition-colors outline-none"
5336
+ },
5337
+ "Invite Team"
5338
+ )), !isInviteMode && /* @__PURE__ */ import_react83.default.createElement("p", { className: "text-[12px] text-neutral-500" }, "Manage members and access controls across your organization.")), /* @__PURE__ */ import_react83.default.createElement("div", { className: "w-full overflow-hidden" }, isInviteMode ? /* @__PURE__ */ import_react83.default.createElement("form", { onSubmit: handleInviteSubmit, className: "flex flex-col gap-8 animate-in fade-in duration-300" }, /* @__PURE__ */ import_react83.default.createElement("div", { className: "space-y-1.5 mt-2" }, /* @__PURE__ */ import_react83.default.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block" }, "Email Address"), /* @__PURE__ */ import_react83.default.createElement(
5339
+ "input",
5340
+ {
5341
+ type: "email",
5342
+ value: inviteEmail,
5343
+ onChange: (e) => setInviteEmail(cleanEmailId(e.target.value)),
5344
+ required: true,
5345
+ autoFocus: true,
5346
+ className: "w-full px-2 py-3 bg-transparent text-sm border-b border-neutral-200 text-black outline-none focus:border-black transition-all duration-300",
5347
+ placeholder: "name@company.com"
5348
+ }
5349
+ )), /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex flex-col gap-3" }, /* @__PURE__ */ import_react83.default.createElement(
5350
+ ThreeDActionButton,
5351
+ {
5352
+ type: "submit",
5353
+ disabled: inviteEmail.length < 5 || isInviting,
5354
+ isLoading: isInviting,
5355
+ className: "w-full"
5356
+ },
5357
+ "Send Invitation"
5358
+ ), /* @__PURE__ */ import_react83.default.createElement(
5359
+ "button",
5360
+ {
5361
+ type: "button",
5362
+ onClick: () => {
5363
+ setIsInviteMode(false);
5364
+ setInviteEmail("");
5365
+ },
5366
+ disabled: isInviting,
5367
+ className: "w-full flex items-center justify-center py-2.5 rounded-full border border-neutral-200 text-black hover:bg-neutral-50 transition-colors outline-none text-xs tracking-wide"
5368
+ },
5369
+ "Cancel"
5370
+ ))) : isMembersLoading || isTyping ? /* @__PURE__ */ import_react83.default.createElement(PageSpinner8, null) : /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex flex-col min-w-0 animate-in fade-in duration-300" }, /* @__PURE__ */ import_react83.default.createElement("div", null, members.length === 0 ? /* @__PURE__ */ import_react83.default.createElement("p", { className: "text-[12px] text-neutral-400 py-6 text-center" }, "No members found") : members.map((member) => /* @__PURE__ */ import_react83.default.createElement(
5371
+ "div",
5372
+ {
5373
+ key: member.id,
5374
+ onClick: () => setExpandedId(member.id),
5375
+ className: "flex items-center justify-between py-3 hover:bg-neutral-50 transition-colors cursor-pointer group min-w-0 px-3 -mx-3 rounded-xl"
5376
+ },
5377
+ /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex items-center gap-4 min-w-0 flex-1" }, /* @__PURE__ */ import_react83.default.createElement(MemberAvatar2, { src: member.avatarUrl, status: member.status }), /* @__PURE__ */ import_react83.default.createElement("div", { className: "min-w-0 flex-1 flex flex-col gap-0.5" }, /* @__PURE__ */ import_react83.default.createElement("p", { className: "text-[13px] text-black truncate" }, member.name), /* @__PURE__ */ import_react83.default.createElement("p", { className: "text-[11px] text-neutral-500 capitalize truncate" }, member.role.toLowerCase())))
5378
+ ))), /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex items-center justify-between pt-6 mt-2 " }, /* @__PURE__ */ import_react83.default.createElement("span", { className: "text-[11px] text-neutral-400 tracking-[0.2em]" }, "Page ", membersCurrentPage, " of ", membersTotalPages === 0 ? 1 : membersTotalPages), /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react83.default.createElement(
5379
+ "button",
5380
+ {
5381
+ onClick: () => onMembersPageChange(membersCurrentPage - 1),
5382
+ disabled: membersCurrentPage <= 1 || isMembersLoading,
5383
+ className: "p-2 bg-white border border-neutral-200 rounded-full text-black hover:bg-neutral-50 disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none"
5384
+ },
5385
+ /* @__PURE__ */ import_react83.default.createElement(import_react84.HugeiconsIcon, { icon: import_core_free_icons30.ArrowLeft01Icon, size: 14 })
5386
+ ), /* @__PURE__ */ import_react83.default.createElement(
5387
+ "button",
5388
+ {
5389
+ onClick: () => onMembersPageChange(membersCurrentPage + 1),
5390
+ disabled: membersCurrentPage >= membersTotalPages || isMembersLoading || membersTotalPages === 0,
5391
+ className: "p-2 bg-white border border-neutral-200 rounded-full text-black hover:bg-neutral-50 disabled:opacity-30 disabled:cursor-not-allowed transition-all outline-none"
5392
+ },
5393
+ /* @__PURE__ */ import_react83.default.createElement(import_react84.HugeiconsIcon, { icon: import_core_free_icons30.ArrowRight01Icon, size: 14 })
5394
+ ))))))
5395
+ )), isStatusModalOpen && /* @__PURE__ */ import_react83.default.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ import_react83.default.createElement("div", { className: "absolute inset-0 bg-black/40", onClick: () => setIsStatusModalOpen(false) }), /* @__PURE__ */ import_react83.default.createElement("div", { ref: statusDropdownRef, 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__ */ import_react83.default.createElement("div", { className: "p-6 text-center w-full mb-2" }, /* @__PURE__ */ import_react83.default.createElement("h3", { className: "text-[14px] text-black tracking-tight" }, "Status Filter")), /* @__PURE__ */ import_react83.default.createElement("div", { className: "w-full flex flex-col pl-2 pr-2 gap-1" }, ["ALL", "ACTIVE", "BUSY", "OFFLINE", "AWAY"].map((option) => /* @__PURE__ */ import_react83.default.createElement(
5396
+ "button",
5397
+ {
5398
+ key: option,
5399
+ onClick: () => {
5400
+ onStatusFilterChange(option);
5401
+ setIsStatusModalOpen(false);
5402
+ },
5403
+ className: `text-left px-4 py-3 text-[11px] tracking-wide transition-colors rounded-full flex items-center justify-between outline-none ${activeStatusFilter === option ? "bg-neutral-100 text-black" : "text-neutral-500 hover:bg-neutral-50 hover:text-black"}`
5404
+ },
5405
+ /* @__PURE__ */ import_react83.default.createElement("span", { className: "truncate pr-2 capitalize" }, option.toLowerCase())
5406
+ ))), /* @__PURE__ */ import_react83.default.createElement("div", { className: "w-full flex mt-2" }, /* @__PURE__ */ import_react83.default.createElement("button", { onClick: () => setIsStatusModalOpen(false), className: "w-full py-4 text-[13px] text-neutral-500 hover:text-black transition-colors outline-none" }, "Cancel")))), isRoleModalOpen && /* @__PURE__ */ import_react83.default.createElement("div", { className: "fixed inset-0 z-110 flex items-center justify-center p-4" }, /* @__PURE__ */ import_react83.default.createElement("div", { className: "absolute inset-0 bg-black/40", onClick: () => setIsRoleModalOpen(false) }), /* @__PURE__ */ import_react83.default.createElement("div", { ref: roleDropdownRef, 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__ */ import_react83.default.createElement("div", { className: "p-6 text-center w-full mb-2" }, /* @__PURE__ */ import_react83.default.createElement("h3", { className: "text-[14px] text-black tracking-tight" }, "Role Filter")), /* @__PURE__ */ import_react83.default.createElement("div", { className: "w-full flex flex-col pl-2 pr-2 gap-1" }, ["ALL", "ADMIN", "MANAGER", "MEMBER", "GUEST"].map((option) => /* @__PURE__ */ import_react83.default.createElement(
5407
+ "button",
5408
+ {
5409
+ key: option,
5410
+ onClick: () => {
5411
+ onRoleFilterChange(option);
5412
+ setIsRoleModalOpen(false);
5413
+ },
5414
+ className: `text-left px-4 py-3 text-[11px] tracking-wide transition-colors rounded-full flex items-center justify-between outline-none ${activeRoleFilter === option ? "bg-neutral-100 text-black" : "text-neutral-500 hover:bg-neutral-50 hover:text-black"}`
5415
+ },
5416
+ /* @__PURE__ */ import_react83.default.createElement("span", { className: "truncate pr-2 capitalize" }, option.toLowerCase())
5417
+ ))), /* @__PURE__ */ import_react83.default.createElement("div", { className: "w-full flex mt-2" }, /* @__PURE__ */ import_react83.default.createElement("button", { onClick: () => setIsRoleModalOpen(false), className: "w-full py-4 text-[13px] text-neutral-500 hover:text-black transition-colors outline-none" }, "Cancel"))))), activeTab === "ACCOUNT" && /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex flex-col gap-8 animate-in rounded-2xl p-6 bg-white fade-in duration-300" }, /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex items-start justify-between gap-4" }, /* @__PURE__ */ import_react83.default.createElement("div", null, /* @__PURE__ */ import_react83.default.createElement("h2", { className: "text-black text-xl mb-1 tracking-tight" }, "Public Profile"), /* @__PURE__ */ import_react83.default.createElement("p", { className: "text-xs text-neutral-500" }, "Manage your workspace identifiers and structural configuration details.")), isAccountReadOnly && /* @__PURE__ */ import_react83.default.createElement("span", { className: "p-2 w-9 h-9 bg-neutral-100 text-neutral-400 rounded-full shrink-0" }, /* @__PURE__ */ import_react83.default.createElement(import_react84.HugeiconsIcon, { icon: import_core_free_icons30.CircleLock02Icon, size: 18, className: "text-current" }))), /* @__PURE__ */ import_react83.default.createElement("div", { className: "w-full max-w-5xl" }, /* @__PURE__ */ import_react83.default.createElement("form", { className: "flex flex-col gap-8", onSubmit: handleSaveAccount, autoComplete: "off" }, /* @__PURE__ */ import_react83.default.createElement(
5418
+ TextInput,
5419
+ {
5420
+ label: "Display Name",
5421
+ value: displayName,
5422
+ onChange: handleDisplayNameChange,
5423
+ disabled: isAccountReadOnly || isSavingAccount,
5424
+ placeholder: "Sovereign User",
5425
+ maxLength: 50
5426
+ }
5427
+ ), /* @__PURE__ */ import_react83.default.createElement("div", { className: "space-y-1.5 relative w-full" }, /* @__PURE__ */ import_react83.default.createElement("label", { className: "text-[11px] text-neutral-400 tracking-[0.2em] block" }, "Workspace Handle"), /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex items-center relative w-full border-b border-neutral-200 focus-within:border-black transition-all duration-300 overflow-hidden" }, /* @__PURE__ */ import_react83.default.createElement(
5428
+ "input",
5429
+ {
5430
+ type: "text",
5431
+ value: slug,
5432
+ disabled: isAccountReadOnly || isSavingAccount,
5433
+ onChange: (e) => handleSlugChange(e.target.value),
5434
+ spellCheck: "false",
5435
+ autoComplete: "off",
5436
+ className: "w-full pr-10 pl-0 py-3 text-sm bg-transparent text-black outline-none disabled:opacity-50 disabled:cursor-not-allowed",
5437
+ placeholder: "workspace-handle"
5438
+ }
5439
+ ), /* @__PURE__ */ import_react83.default.createElement("div", { className: "absolute right-2 top-1/2 -translate-y-1/2" }, isCheckingSlug && /* @__PURE__ */ import_react83.default.createElement(InputSpinner3, null), !isCheckingSlug && !isAccountReadOnly && slug !== initialSlug && slug.length >= 3 && slugAvailable === false && /* @__PURE__ */ import_react83.default.createElement("span", { className: "inline-flex items-center justify-center w-4 h-4 rounded-full bg-red-100" }, /* @__PURE__ */ import_react83.default.createElement("svg", { className: "w-2 h-2 text-red-600", viewBox: "0 0 20 20", fill: "currentColor" }, /* @__PURE__ */ import_react83.default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" }))), !isCheckingSlug && !isAccountReadOnly && slug !== initialSlug && slug.length >= 3 && slugAvailable === true && /* @__PURE__ */ import_react83.default.createElement("span", { className: "inline-flex items-center justify-center w-4 h-4 rounded-full bg-green-100" }, /* @__PURE__ */ import_react83.default.createElement("svg", { className: "w-2 h-2 text-green-600", viewBox: "0 0 20 20", fill: "currentColor" }, /* @__PURE__ */ import_react83.default.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M16.707 5.293a1 1 0 00-1.414 0L8 12.586 4.707 9.293a1 1 0 10-1.414 1.414l4 4a1 1 0 001.414 0l8-8a1 1 0 000-1.414z" })))))), /* @__PURE__ */ import_react83.default.createElement("div", { className: "pt-8 mt-2 flex items-center gap-4" }, /* @__PURE__ */ import_react83.default.createElement(
5440
+ ThreeDActionButton,
5441
+ {
5442
+ type: "submit",
5443
+ disabled: isAccountSaveDisabled,
5444
+ isLoading: isSavingAccount,
5445
+ className: "min-w-32"
5446
+ },
5447
+ "Save Changes"
5448
+ ), hasAccountChanges && !isSavingAccount && !isAccountReadOnly && /* @__PURE__ */ import_react83.default.createElement(
5449
+ "button",
5450
+ {
5451
+ type: "button",
5452
+ onClick: () => {
5453
+ setDisplayName(initialDisplayName);
5454
+ setSlug(initialSlug);
5455
+ },
5456
+ className: "text-[11px] tracking-widest text-neutral-400 hover:text-black transition-colors outline-none"
5457
+ },
5458
+ "Cancel"
5459
+ ))))), activeTab === "BILLING" && /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex flex-col animate-in fade-in duration-300" }, /* @__PURE__ */ import_react83.default.createElement("div", { className: "bg-[#143731] rounded-3xl p-6 relative overflow-hidden flex flex-col w-full mt-2" }, /* @__PURE__ */ import_react83.default.createElement("div", { className: "relative z-10 flex flex-col items-start w-full" }, /* @__PURE__ */ import_react83.default.createElement("p", { className: "text-[11px] text-white leading-tight mb-1" }, /* @__PURE__ */ import_react83.default.createElement("span", { className: "text-white/60" }, "AI Credits Balance")), isBillingLoading ? /* @__PURE__ */ import_react83.default.createElement("div", { className: "h-8 w-32 bg-white/10 animate-pulse rounded mt-2" }) : /* @__PURE__ */ import_react83.default.createElement("div", { className: "flex items-center gap-2 mt-1" }, /* @__PURE__ */ import_react83.default.createElement(import_react84.HugeiconsIcon, { icon: import_core_free_icons30.Coins01Icon, size: 24, className: "text-white" }), /* @__PURE__ */ import_react83.default.createElement("span", { className: "text-2xl text-white tracking-tight" }, aiCredits)), /* @__PURE__ */ import_react83.default.createElement("div", { className: "mt-8 w-full " }, /* @__PURE__ */ import_react83.default.createElement(
5460
+ "button",
5461
+ {
5462
+ onClick: onTopUp,
5463
+ className: "px-6 py-2.5 rounded-full border border-white/50 bg-transparent text-white/50 text-[12px] tracking-wide transition-colors outline-none hover:bg-white/10 hover:text-white hover:border-white"
5464
+ },
5465
+ "Top Up Credits"
5466
+ ))), /* @__PURE__ */ import_react83.default.createElement(
5467
+ "img",
5468
+ {
5469
+ src: "https://storage.googleapis.com/retina-cloud-v2/assets/images/save_box.avif",
5470
+ alt: "Credits",
5471
+ className: "absolute bottom-2 right-2 translate-x-1/4 translate-y-1/2 w-32 h-auto object-contain z-0 pointer-events-none drop-shadow-md opacity-50"
5472
+ }
5473
+ )), /* @__PURE__ */ import_react83.default.createElement("div", { className: "mt-4 px-1" }, /* @__PURE__ */ import_react83.default.createElement("p", { className: "text-[11px] text-neutral-500 leading-relaxed max-w-lg" }, "AI credits are consumed when generating intelligent summaries, transcriptions, and automated huddle insights. Additional credits are billed dynamically to your primary payment method."))));
5474
+ };
4976
5475
  // Annotate the CommonJS export names for ESM import in node:
4977
5476
  0 && (module.exports = {
4978
5477
  AppBento2,
@@ -5019,6 +5518,7 @@ var UniversalHome2 = ({
5019
5518
  UniversalReferralPage,
5020
5519
  UniversalRewardPage,
5021
5520
  UniversalSecurityPage,
5521
+ UniversalSettings,
5022
5522
  UniversalSidebar,
5023
5523
  UniversalTransactionPage,
5024
5524
  UniversalVerificationPage,