@streamoid/settings 0.6.6 → 0.7.1

package/dist/index.js

@@ -32,7 +32,7 @@ __export(index_exports, {
   MemberListFrame: () => MemberListFrame,
   MemberListToolbar: () => MemberListToolbar,
   OrganizationContent: () => OrganizationContent,
-  OrganizationInviteModal: () => OrganizationInviteModal,
+  OrganizationMemberModal: () => OrganizationMemberModal,
   OrganizationModal: () => OrganizationModal,
   ProfileAvatar: () => ProfileAvatar,
   ProfileTab: () => ProfileTab,
@@ -51,9 +51,11 @@ __export(index_exports, {
   TokensContent: () => TokensContent,
   URL_TO_TAB: () => URL_TO_TAB,
   USER_LANGUAGES: () => USER_LANGUAGES,
+  WORKSPACE_LIST_PAGE_SIZE: () => WORKSPACE_LIST_PAGE_SIZE,
   WorkspaceGeneralTab: () => WorkspaceGeneralTab,
   WorkspaceListTab: () => WorkspaceListTab,
   WorkspaceModal: () => WorkspaceModal,
+  WorkspacePicker: () => WorkspacePicker,
   WorkspaceTab: () => WorkspaceTab,
   countLabel: () => countLabel,
   loadWorkspaceOrganization: () => loadWorkspaceOrganization,
@@ -431,8 +433,9 @@ function WorkspaceModal({
     let cancelled = false;
     organizationAdapter.list().then((orgs) => {
       if (cancelled) return;
-      setAvailableOrgs(orgs);
-      setSelectedOrgId((prev) => prev || orgs[0]?._id || "");
+      const joinable = orgs.filter((org) => org.role !== "guest");
+      setAvailableOrgs(joinable);
+      setSelectedOrgId((prev) => prev || joinable[0]?._id || "");
     }).catch(() => {
       if (!cancelled) setAvailableOrgs([]);
     });
@@ -547,7 +550,7 @@ function WorkspaceModal({
   async function handleLeaveOrganization() {
     if (orgActionSubmitting || !workspaceAdapter.leaveOrganization) return;
     const confirmed = window.confirm(
-      "Leave this organization? Members of the organization will lose any implicit access to this workspace."
+      "Take this workspace out of the organization? It will no longer be listed in the workspace picker, and org admins will lose access unless they are members."
     );
     if (!confirmed) return;
     setOrgActionSubmitting(true);
@@ -892,7 +895,7 @@ function WorkspaceModal({
                                             color: active ? "#ffffff" : T.muted,
                                             textAlign: "center"
                                           },
-                                          children: opt === "private" ? "Private" : "Visible to organization"
+                                          children: opt === "private" ? "Private" : "Listed in picker"
                                         }
                                       ) })
                                     },
@@ -1643,7 +1646,7 @@ var TAB_TO_URL = {
   workspaceList: "workspace/all",
   organization: "organization/people",
   organizationWorkspaces: "organization/workspaces",
-  organizationDomains: "organization/domains",
+  organizationDomains: "organization/workspaces",
   referral: "referral",
   billing: "billing",
   apikey: "api-keys"
@@ -1655,7 +1658,8 @@ var URL_TO_TAB = {
   "workspace/all": "workspaceList",
   "organization/people": "organization",
   "organization/workspaces": "organizationWorkspaces",
-  "organization/domains": "organizationDomains",
+  /* The Domains tab is gone; its join requests live under Workspaces. */
+  "organization/domains": "organizationWorkspaces",
   /* Unscoped destinations. */
   account: "profile",
   referral: "referral",
@@ -1674,7 +1678,7 @@ var TAB_LABELS = {
   workspaceList: "My workspaces",
   organization: "People",
   organizationWorkspaces: "Workspaces",
-  organizationDomains: "Domains & requests",
+  organizationDomains: "Workspaces",
   referral: "Referral",
   /* "Billing & usage", not "Billing". The tab has held usage history as well
      as the plan and invoices since the credits work, and hosts had started
@@ -1688,9 +1692,9 @@ var TAB_DESCRIPTIONS = {
   workspace: "Rename or re-brand this workspace, or leave and delete it",
   workspaceMembers: "Invite people to this workspace and control which apps they can use",
   workspaceList: "Switch between your workspaces, or start a new one",
-  organization: "Everyone in the organization, and the invites still waiting to be accepted",
-  organizationWorkspaces: "Every workspace that sits under this organization",
-  organizationDomains: "Auto-join by email domain, and workspaces asking to join the organization",
+  organization: "Everyone in the organization and their role",
+  organizationWorkspaces: "Every workspace in this organization, and workspaces asking to join it",
+  organizationDomains: "Every workspace in this organization, and workspaces asking to join it",
   referral: "Invite friends to Streamoid and track the rewards you have earned",
   billing: "Workspace plan, credits, invoices and usage history",
   apikey: "Create and revoke keys for calling the Streamoid APIs"
@@ -2309,7 +2313,7 @@ function OrganizationAffiliationCard({
       style: { gap: T5.spMd, opacity: submitting ? 0.6 : 1 },
       children: [
         workspaceAdapter.setOrgVisibility && /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)("div", { className: "flex flex-col items-start w-full", style: { gap: T5.spXs }, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(FieldLabel, { children: "Who in the organization can see this workspace" }),
+          /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(FieldLabel, { children: "List this workspace in the organization's workspace picker" }),
           /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
             "div",
             {
@@ -2340,11 +2344,11 @@ function OrganizationAffiliationCard({
                       if (active || !workspaceAdapter.setOrgVisibility) return;
                       void run(
                         () => workspaceAdapter.setOrgVisibility(opt),
-                        opt === "private" ? "Workspace is now private" : "Workspace is now visible to the organization",
+                        opt === "private" ? "Workspace is now private" : "Workspace is now listed in the workspace picker",
                         "Failed to change visibility"
                       );
                     },
-                    children: opt === "private" ? "Only workspace members" : "Everyone in the organization"
+                    children: opt === "private" ? "Private (invite only)" : "Listed in the workspace picker"
                   },
                   opt
                 );
@@ -2370,7 +2374,7 @@ function OrganizationAffiliationCard({
             },
             onClick: () => {
               const confirmed = window.confirm(
-                "Leave this organization? Members of the organization will lose any implicit access to this workspace."
+                "Take this workspace out of the organization? It will no longer be listed in the workspace picker, and org admins will lose access unless they are members."
               );
               if (!confirmed || !workspaceAdapter.leaveOrganization) return;
               void run(
@@ -2763,12 +2767,13 @@ function InviteUpdateModal({
   organizationName,
   allowGuestStanding = true,
   initialOrganizationStanding = "guest",
+  organizationDomain,
   onInvite
 }) {
   useOverlayOpen(open, onClose);
   const [emailValue, setEmailValue] = (0, import_react8.useState)("");
   const [hasChanges, setHasChanges] = (0, import_react8.useState)(false);
-  const [role, setRole] = (0, import_react8.useState)("admin");
+  const [role, setRole] = (0, import_react8.useState)("member");
   const [orgStanding, setOrgStanding] = (0, import_react8.useState)(
     initialOrganizationStanding
   );
@@ -2807,7 +2812,7 @@ function InviteUpdateModal({
     if (!open) {
       setEmailValue("");
       setHasChanges(false);
-      setRole("admin");
+      setRole("member");
       setOrgStanding(initialOrganizationStanding);
       setCanUseCredits(true);
       setCanInviteUser(true);
@@ -2819,6 +2824,14 @@ function InviteUpdateModal({
       setSelectedStores(/* @__PURE__ */ new Set());
     }
   }, [open, initialPermissions, hiddenKey, initialOrganizationStanding]);
+  const orgDomain = (organizationDomain || "").trim().toLowerCase();
+  const inviteeDomains = emailValue.split(/[\s,;]+/).map((email) => email.trim().toLowerCase().split("@")[1] || "").filter(Boolean);
+  const inviteeIsGuest = mode === "invite" && inviteeDomains.some(
+    (domain) => !(orgDomain && domain === orgDomain) && (showOrganizationStanding ? orgStanding === "guest" : !!orgDomain)
+  );
+  (0, import_react8.useEffect)(() => {
+    if (inviteeIsGuest && role === "admin") setRole("member");
+  }, [inviteeIsGuest, role]);
   if (!open) return null;
   const isInvite = mode === "invite";
   const hasEmail = /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(emailValue.trim());
@@ -3009,12 +3022,15 @@ function InviteUpdateModal({
                                           /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
                                             "div",
                                             {
-                                              className: "flex-1 min-w-0 cursor-pointer",
+                                              className: `flex-1 min-w-0 ${inviteeIsGuest ? "cursor-not-allowed" : "cursor-pointer"}`,
+                                              "aria-disabled": inviteeIsGuest,
                                               style: {
                                                 background: role === "admin" ? T6.neutral300 : "transparent",
-                                                borderRadius: T6.rMd
+                                                borderRadius: T6.rMd,
+                                                opacity: inviteeIsGuest ? 0.4 : 1
                                               },
                                               onClick: () => {
+                                                if (inviteeIsGuest) return;
                                                 setRole("admin");
                                                 setCanUseCredits(true);
                                                 setCanInviteUser(true);
@@ -3088,6 +3104,19 @@ function InviteUpdateModal({
                                     ) })
                                   ]
                                 }
+                              ),
+                              inviteeIsGuest && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+                                "span",
+                                {
+                                  style: {
+                                    fontFamily: T6.font,
+                                    fontSize: T6.fsXs,
+                                    fontWeight: 400,
+                                    lineHeight: T6.lhXs,
+                                    color: T6.tertiary
+                                  },
+                                  children: "Guests can only be Members."
+                                }
                               )
                             ]
                           }
@@ -3277,7 +3306,7 @@ function InviteUpdateModal({
                               lineHeight: T6.lhXs,
                               color: T6.tertiary
                             },
-                            children: orgStanding === "colleague" ? `Joins ${organizationName || "the organization"} as a member \u2014 they'll also see its shared workspaces.` : `This workspace only. They see nothing else in ${organizationName || "the organization"}.`
+                            children: orgStanding === "colleague" ? `Joins ${organizationName || "the organization"} as a member \u2014 they can also join its shared workspaces.` : `This workspace only, as a member. They see nothing else in ${organizationName || "the organization"}.`
                           }
                         )
                       ]
@@ -3972,7 +4001,19 @@ function MemberListToolbar({
       className: "flex flex-wrap items-center justify-between shrink-0 w-full",
       style: { gap: "var(--spacing-md)" },
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+        pendingCount === void 0 ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+          "span",
+          {
+            style: {
+              fontFamily: T7.font,
+              fontSize: T7.fsSm,
+              fontWeight: 500,
+              lineHeight: T7.lhSm,
+              color: T7.primary
+            },
+            children: withCount(activeLabel, activeCount)
+          }
+        ) : /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
           import_ui4.ScTabSwitcher,
           {
             tabCount: "2",
@@ -4938,9 +4979,9 @@ function TeamsContent({
           lineHeight: "var(--line-height-line-height-xs)"
         },
         children: [
-          "This workspace is visible to everyone in ",
+          "Anyone in ",
           organizationName,
-          ", and its admins keep access whether or not they are listed here. Change that under Workspace \u203A General."
+          " can join this workspace as a member from the workspace picker, and its org admins keep access whether or not they are listed here. Change that under Workspace \u203A General."
         ]
       }
     ),
@@ -5022,6 +5063,7 @@ function TeamsContent({
         ),
         showOrganizationStanding: mayGrantOrgMembership,
         organizationName: organizationName ?? orgCurrent?.name,
+        organizationDomain: workspaceOrgId && orgCurrent?.id === workspaceOrgId ? orgCurrent?.domain : void 0,
         onInvite: handleInvite
       }
     )
@@ -5092,7 +5134,7 @@ var import_react12 = require("react");
 var import_ui8 = require("@streamoid/ui");
 var import_icons8 = require("@streamoid/icons");
 
-// src/organization-invite-modal.tsx
+// src/organization-member-modal.tsx
 var import_react10 = require("react");
 var import_ui7 = require("@streamoid/ui");
 var import_icons7 = require("@streamoid/icons");
@@ -5123,33 +5165,6 @@ var T9 = {
   r4xl: "var(--radius-4xl)",
   neutral300: "var(--primitives-neutral-300)"
 };
-function CheckboxSvg2({ checked }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "relative shrink-0", style: { width: 24, height: 24 }, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("svg", { width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", children: checked ? /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_jsx_runtime15.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
-      "rect",
-      {
-        x: "0.75",
-        y: "0.75",
-        width: "22.5",
-        height: "22.5",
-        rx: "5.65",
-        fill: T9.primary,
-        stroke: T9.primary,
-        strokeWidth: "1.5"
-      }
-    ),
-    /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
-      "path",
-      {
-        d: "M7 12.5L10.5 16L17 8",
-        stroke: T9.inverse,
-        strokeWidth: "1.5",
-        strokeLinecap: "round",
-        strokeLinejoin: "round"
-      }
-    )
-  ] }) : /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("path", { d: svg_rodctpja6f_default.p4792500, fill: T9.muted }) }) });
-}
 function FieldLabel3({ text }) {
   return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "flex items-center shrink-0 w-full", style: { height: 24 }, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
     "div",
@@ -5225,69 +5240,29 @@ function SegmentedToggle({
     }
   );
 }
-function OrganizationInviteModal({
+function OrganizationMemberModal({
   open,
-  mode,
   userEmail = "email@domain.in",
   initialRole,
   lockRole,
-  canClaimDomain = true,
-  claimableDomain,
   lockedRoleLabel,
-  initialInviteAccess,
-  allowSubmitWithoutChanges = false,
   canRemove = true,
   onClose,
-  onInviteEmail,
-  onInviteDomain,
   onUpdate,
   onRemove
 }) {
   useOverlayOpen(open, onClose);
-  const [inviteMode, setInviteMode] = (0, import_react10.useState)("email");
-  const [emailValue, setEmailValue] = (0, import_react10.useState)("");
-  const [domainValue, setDomainValue] = (0, import_react10.useState)(claimableDomain ?? "");
   const [hasChanges, setHasChanges] = (0, import_react10.useState)(false);
-  const [role, setRole] = (0, import_react10.useState)("admin");
-  const [inviteAccess, setInviteAccess] = (0, import_react10.useState)(false);
+  const [role, setRole] = (0, import_react10.useState)("member");
   (0, import_react10.useEffect)(() => {
-    if (open && mode === "update") {
+    if (open) {
       setRole(initialRole ?? "member");
-      setInviteAccess(initialInviteAccess ?? false);
-    }
-    if (!open) {
-      setInviteMode("email");
-      setEmailValue("");
-      setDomainValue(claimableDomain ?? "");
+    } else {
       setHasChanges(false);
-      setRole("admin");
-      setInviteAccess(true);
     }
-  }, [open, mode, initialRole, initialInviteAccess, claimableDomain]);
+  }, [open, initialRole]);
   if (!open) return null;
-  const isInvite = mode === "invite";
-  const isEmailInvite = isInvite && inviteMode === "email";
-  const isDomainInvite = isInvite && inviteMode === "domain";
-  const hasEmail = /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(emailValue.trim());
-  const hasDomain = /^[^\s@]+\.[^\s@]+$/.test(domainValue.trim());
-  const isSubmitDisabled = isEmailInvite ? !hasEmail : isDomainInvite ? !hasDomain : (
-    // A locked role has nothing this modal can legitimately submit.
-    lockRole || !(allowSubmitWithoutChanges || hasChanges)
-  );
-  function markChanged() {
-    setHasChanges(true);
-  }
-  function handleSubmit() {
-    if (isEmailInvite) {
-      onInviteEmail?.({ email: emailValue.trim(), role, inviteAccess });
-      return;
-    }
-    if (isDomainInvite) {
-      onInviteDomain?.({ domain: domainValue.trim(), autoJoinRole: role });
-      return;
-    }
-    onUpdate?.({ role, inviteAccess });
-  }
+  const isSubmitDisabled = lockRole || !hasChanges;
   return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
     "div",
     {
@@ -5305,6 +5280,7 @@ function OrganizationInviteModal({
             borderRadius: T9.r4xl,
             border: `1px solid ${T9.borderSubtle}`,
             width: 480,
+            maxWidth: "calc(100vw - 32px)",
             maxHeight: "85vh"
           },
           children: [
@@ -5334,7 +5310,7 @@ function OrganizationInviteModal({
                           fontWeight: 600,
                           lineHeight: T9.lhLg
                         },
-                        children: isInvite ? "Invite to organization" : "Update member"
+                        children: "Update member"
                       }
                     ),
                     /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "shrink-0 cursor-pointer", onClick: onClose, children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_icons7.SiconClose, { className: "w-6 h-6", color: T9.primary }) })
@@ -5348,116 +5324,41 @@ function OrganizationInviteModal({
                 className: "flex flex-col items-start w-full",
                 style: { padding: `${T9.sp3xl} ${T9.sp6xl}`, gap: T9.sp3xl },
                 children: [
-                  isInvite && canClaimDomain && /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
-                    "div",
-                    {
-                      className: "flex flex-col items-start justify-center shrink-0 w-full",
-                      style: { gap: T9.spXs },
-                      children: [
-                        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(FieldLabel3, { text: "Invite by" }),
-                        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
-                          SegmentedToggle,
-                          {
-                            options: [
-                              { value: "email", label: "Email" },
-                              { value: "domain", label: "Domain" }
-                            ],
-                            value: inviteMode,
-                            onChange: setInviteMode
-                          }
-                        )
-                      ]
-                    }
-                  ),
                   /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
                     "div",
                     {
                       className: "flex flex-col items-start justify-center shrink-0 w-full",
                       style: { gap: T9.spXs },
                       children: [
-                        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
-                          FieldLabel3,
-                          {
-                            text: isDomainInvite ? "Domain" : isEmailInvite ? "Email ID" : "Email ID"
-                          }
-                        ),
+                        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(FieldLabel3, { text: "Email ID" }),
                         /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
                           "div",
                           {
                             className: "shrink-0 w-full",
                             style: { background: T9.fillPlus, height: 48, borderRadius: T9.r3xl },
-                            children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "flex flex-row items-center size-full", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+                            children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "flex flex-row items-center size-full", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
                               "div",
                               {
                                 className: "flex items-center relative size-full",
                                 style: { padding: `${T9.spXl} ${T9.sp3xl}` },
-                                children: [
-                                  isEmailInvite && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
-                                    "input",
-                                    {
-                                      className: "flex-1 min-w-0 bg-transparent border-none outline-none",
-                                      style: {
-                                        fontFamily: T9.font,
-                                        fontSize: T9.fsSm,
-                                        fontWeight: 400,
-                                        lineHeight: T9.lhSm,
-                                        color: T9.primary
-                                      },
-                                      placeholder: "email@domain.in",
-                                      value: emailValue,
-                                      onChange: (e) => setEmailValue(e.target.value)
-                                    }
-                                  ),
-                                  isDomainInvite && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
-                                    "span",
-                                    {
-                                      className: "flex-1 min-w-0 truncate",
-                                      style: {
-                                        fontFamily: T9.font,
-                                        fontSize: T9.fsSm,
-                                        fontWeight: 400,
-                                        lineHeight: T9.lhSm,
-                                        color: T9.primary
-                                      },
-                                      children: domainValue
-                                    }
-                                  ),
-                                  !isInvite && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
-                                    "div",
-                                    {
-                                      className: "flex-1 flex flex-col justify-center",
-                                      style: {
-                                        fontFamily: T9.font,
-                                        fontSize: T9.fsSm,
-                                        fontWeight: 400,
-                                        lineHeight: T9.lhSm,
-                                        color: T9.muted,
-                                        opacity: 0.6
-                                      },
-                                      children: userEmail
-                                    }
-                                  )
-                                ]
+                                children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+                                  "div",
+                                  {
+                                    className: "flex-1 flex flex-col justify-center truncate",
+                                    style: {
+                                      fontFamily: T9.font,
+                                      fontSize: T9.fsSm,
+                                      fontWeight: 400,
+                                      lineHeight: T9.lhSm,
+                                      color: T9.muted,
+                                      opacity: 0.6
+                                    },
+                                    children: userEmail
+                                  }
+                                )
                               }
                             ) })
                           }
-                        ),
-                        isDomainInvite && /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
-                          "span",
-                          {
-                            style: {
-                              fontFamily: T9.font,
-                              fontSize: T9.fsSm,
-                              fontWeight: 400,
-                              color: T9.muted
-                            },
-                            children: [
-                              "Anyone who signs up or logs in with an @",
-                              domainValue.trim(),
-                              " ",
-                              "address will automatically join this organization from now on."
-                            ]
-                          }
                         )
                       ]
                     }
@@ -5468,7 +5369,7 @@ function OrganizationInviteModal({
                       className: "flex flex-col items-start justify-center shrink-0 w-full",
                       style: { gap: T9.spXs },
                       children: [
-                        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(FieldLabel3, { text: isDomainInvite ? "Auto-join role" : "Role" }),
+                        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(FieldLabel3, { text: "Role" }),
                         lockRole ? /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
                           "span",
                           {
@@ -5480,49 +5381,33 @@ function OrganizationInviteModal({
                             },
                             children: [
                               lockedRoleLabel || "Guest",
-                              " \u2014 invited to specific workspaces only, with no access to the rest of the organization. Remove them to end that access."
+                              " \u2014 invited to specific workspaces only, with no access to the rest of the organization. Guests can't be made members or admins. Remove them to end that access."
                             ]
                           }
                         ) : /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
                           SegmentedToggle,
                           {
                             options: [
-                              { value: "admin", label: "Admin" },
+                              { value: "admin", label: "Org admin" },
                               { value: "member", label: "Member" }
                             ],
                             value: role,
                             onChange: (v) => {
                               setRole(v);
-                              if (v === "admin") setInviteAccess(true);
-                              markChanged();
+                              setHasChanges(v !== (initialRole ?? "member"));
                             }
                           }
-                        )
-                      ]
-                    }
-                  ),
-                  !isDomainInvite && !lockRole && role === "member" && /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
-                    "div",
-                    {
-                      className: "flex items-center shrink-0 w-full cursor-pointer",
-                      style: { gap: T9.spMd },
-                      onClick: () => {
-                        setInviteAccess(!inviteAccess);
-                        markChanged();
-                      },
-                      children: [
-                        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(CheckboxSvg2, { checked: inviteAccess }),
-                        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+                        ),
+                        !lockRole && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
                           "span",
                           {
                             style: {
                               fontFamily: T9.font,
                               fontSize: T9.fsSm,
-                              fontWeight: 400,
                               lineHeight: T9.lhSm,
-                              color: T9.primary
+                              color: T9.muted
                             },
-                            children: "Can invite members"
+                            children: "Org admins can see and manage every workspace in the organization."
                           }
                         )
                       ]
@@ -5543,10 +5428,10 @@ function OrganizationInviteModal({
               /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "flex flex-row items-center size-full", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
                 "div",
                 {
-                  className: `flex items-center w-full ${isInvite ? "justify-end" : "justify-between"}`,
+                  className: "flex items-center w-full justify-between",
                   style: { padding: `${T9.sp3xl} ${T9.sp6xl}` },
                   children: [
-                    !isInvite && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+                    /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
                       import_ui7.ScButton,
                       {
                         text: "Remove member",
@@ -5559,11 +5444,11 @@ function OrganizationInviteModal({
                     /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
                       import_ui7.ScButton,
                       {
-                        text: isEmailInvite ? "Send invite" : isDomainInvite ? "Add domain" : allowSubmitWithoutChanges ? "Resend invite" : "Save changes",
+                        text: "Save changes",
                         variant: "primary",
                         size: "md",
                         state: isSubmitDisabled ? "disabled" : "default",
-                        onClick: !isSubmitDisabled ? handleSubmit : void 0
+                        onClick: !isSubmitDisabled ? () => onUpdate?.({ role }) : void 0
                       }
                     )
                   ]
@@ -6057,20 +5942,6 @@ function formatDate(iso) {
     return iso;
   }
 }
-function toDisplayText2(value, fallback = "\u2013") {
-  if (typeof value === "string") {
-    const trimmed = value.trim();
-    return trimmed.length > 0 ? trimmed : fallback;
-  }
-  if (value && typeof value === "object") {
-    const record = value;
-    const name = typeof record.name === "string" ? record.name.trim() : "";
-    if (name) return name;
-    const email = typeof record.email === "string" ? record.email.trim() : "";
-    if (email) return email;
-  }
-  return fallback;
-}
 function VisibilityBadge({ visibility }) {
   const isShared = visibility === "shared";
   return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
@@ -6091,10 +5962,46 @@ function VisibilityBadge({ visibility }) {
     }
   );
 }
+function RowIconButton({
+  label,
+  onClick,
+  children,
+  visible = true
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+    "button",
+    {
+      type: "button",
+      "aria-label": label,
+      title: label,
+      className: "flex items-center justify-center shrink-0 cursor-pointer border-none",
+      style: {
+        width: 32,
+        height: 32,
+        borderRadius: T11.rLg,
+        background: "transparent",
+        opacity: visible ? 1 : 0,
+        transition: "opacity 120ms ease"
+      },
+      onMouseEnter: (e) => {
+        e.currentTarget.style.background = T11.fillPlus;
+      },
+      onMouseLeave: (e) => {
+        e.currentTarget.style.background = "transparent";
+      },
+      onClick,
+      children
+    }
+  );
+}
 function MemberRow({
   member,
-  onClick
+  onEdit,
+  onCopyEmail
 }) {
+  const [copied, setCopied] = (0, import_react12.useState)(false);
+  const [active, setActive] = (0, import_react12.useState)(false);
+  const noHover = typeof window !== "undefined" && window.matchMedia?.("(hover: none)").matches === true;
   const name = member.user.name?.trim();
   const email = member.user.email || "";
   const displayIdent = name || email.split("@")[0] || "user";
@@ -6106,18 +6013,20 @@ function MemberRow({
   return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
     "div",
     {
-      className: `flex items-center self-stretch shrink-0 ${onClick ? "cursor-pointer" : "cursor-default"}`,
+      className: "flex items-center self-stretch shrink-0 cursor-default",
       style: {
         borderBottom: `1px solid ${T11.borderSubtle}`,
         padding: `${T11.sp5xl} ${T11.sp3xl}`,
-        gap: T11.sp6xl
-      },
-      onClick,
-      onMouseEnter: (e) => {
-        if (onClick) e.currentTarget.style.background = T11.fillPlus;
+        gap: T11.sp6xl,
+        background: active && onEdit ? T11.fillPlus : "transparent"
       },
-      onMouseLeave: (e) => {
-        e.currentTarget.style.background = "transparent";
+      onMouseEnter: () => setActive(true),
+      onMouseLeave: () => setActive(false),
+      onFocus: () => setActive(true),
+      onBlur: (e) => {
+        if (!e.currentTarget.contains(e.relatedTarget)) {
+          setActive(false);
+        }
       },
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
@@ -6196,112 +6105,29 @@ function MemberRow({
             },
             children: formatDate(member.createdAt || member.user.createdAt)
           }
-        )
-      ]
-    }
-  );
-}
-function InviteRow({
-  invite,
-  onCancel,
-  onResend
-}) {
-  const isDomain = invite.kind === "domain";
-  const invitedByText = (() => {
-    if (!invite.invitedBy) return "\u2013";
-    if (typeof invite.invitedBy === "string") return invite.invitedBy;
-    return invite.invitedBy.name || invite.invitedBy.email || "\u2013";
-  })();
-  const role = isDomain ? invite.autoJoinRole : invite.role;
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
-    "div",
-    {
-      className: "flex items-center self-stretch shrink-0",
-      style: {
-        borderBottom: `1px solid ${T11.borderSubtle}`,
-        padding: `${T11.sp5xl} ${T11.sp3xl}`,
-        gap: T11.sp6xl
-      },
-      children: [
-        /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex items-center min-w-0", style: { flex: 1, gap: T11.spMd }, children: [
-          isDomain ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-            "div",
-            {
-              className: "shrink-0 flex items-center justify-center",
-              style: {
-                width: 32,
-                height: 32,
-                borderRadius: T11.rXl,
-                background: T11.fillNeutral
-              },
-              children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_icons8.SiconGlobe, { className: "w-4 h-4", color: T11.primary })
-            }
-          ) : /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(ProfileAvatar, { name: invite.email || "invite", size: 32 }),
-          /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex flex-col min-w-0", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-              "span",
-              {
-                className: "truncate",
-                style: {
-                  fontFamily: T11.font,
-                  fontSize: T11.fsSm,
-                  fontWeight: 500,
-                  lineHeight: T11.lhSm,
-                  color: T11.primary
-                },
-                children: isDomain ? `Domain: ${invite.domain}` : toDisplayText2(invite.email, "")
-              }
-            ),
-            /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-              "span",
-              {
-                className: "truncate",
-                style: {
-                  fontFamily: T11.font,
-                  fontSize: T11.fsXs,
-                  fontWeight: 400,
-                  lineHeight: T11.lhXs,
-                  color: T11.muted
-                },
-                children: isDomain ? "Auto-join by verified domain" : "Email invite"
-              }
-            )
-          ] })
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-          RoleLabel,
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "flex items-center justify-end shrink-0", style: { width: 32 }, children: onEdit ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+          RowIconButton,
           {
-            role: role === "admin" ? "admin" : "member",
-            label: orgRoleLabel(role)
+            label: `Manage ${email || "member"}`,
+            onClick: onEdit,
+            visible: active || noHover,
+            children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_icons8.SiconSettings, { className: "w-4 h-4", color: T11.primary })
           }
-        ),
-        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-          "div",
+        ) : email && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+          RowIconButton,
           {
-            className: "truncate shrink-0",
-            style: {
-              width: "7.5rem",
-              fontFamily: T11.font,
-              fontSize: T11.fsSm,
-              fontWeight: 400,
-              lineHeight: T11.lhSm,
-              color: T11.primary
+            label: copied ? "Copied" : `Copy ${email}`,
+            onClick: () => {
+              void onCopyEmail().then((ok) => {
+                if (!ok) return;
+                setCopied(true);
+                setTimeout(() => setCopied(false), 2e3);
+              });
             },
-            children: invitedByText
+            children: copied ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_icons8.SiconCheck, { className: "w-4 h-4", color: T11.primary }) : /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_icons8.SiconCopy, { className: "w-4 h-4", color: T11.primary })
           }
-        ),
-        /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex items-center shrink-0", style: { gap: T11.spMd }, children: [
-          !isDomain && onResend && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_ui8.ScButton, { text: "Resend", variant: "tertiary", size: "sm", onClick: onResend }),
-          /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-            import_ui8.ScButton,
-            {
-              text: isDomain ? "Revoke" : "Cancel",
-              variant: "error",
-              size: "sm",
-              onClick: onCancel
-            }
-          )
-        ] })
+        ) })
       ]
     }
   );
@@ -6408,7 +6234,7 @@ function JoinRequestRow({
             )
           ] })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex items-center shrink-0", style: { gap: T11.spMd }, children: [
+        onApprove && onReject && /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex items-center shrink-0", style: { gap: T11.spMd }, children: [
           /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_ui8.ScButton, { text: "Reject", variant: "error", size: "sm", onClick: onReject }),
           /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_ui8.ScButton, { text: "Approve", variant: "primary", size: "sm", onClick: onApprove })
         ] })
@@ -6464,42 +6290,29 @@ function Section({
 }
 function OrganizationContent({
   embedded = false,
-  view = "people",
-  onInviteOpen,
-  onInviteOpenChange
+  view = "people"
 } = {}) {
   const { organization, toast } = useSettingsAdapters();
   const current = organization.current;
-  const [activeTab, setActiveTab] = (0, import_react12.useState)("active");
   const [members, setMembers] = (0, import_react12.useState)([]);
-  const [invites, setInvites] = (0, import_react12.useState)([]);
   const [workspaces, setWorkspaces] = (0, import_react12.useState)([]);
   const [joinRequests, setJoinRequests] = (0, import_react12.useState)([]);
   const [highestRole, setHighestRole] = (0, import_react12.useState)("guest");
-  const [emailDomain, setEmailDomain] = (0, import_react12.useState)(null);
-  const [canClaimEmailDomain, setCanClaimEmailDomain] = (0, import_react12.useState)(true);
   const [searchQuery, setSearchQuery] = (0, import_react12.useState)("");
   const [loadingData, setLoadingData] = (0, import_react12.useState)(false);
-  const [modal, setModal] = (0, import_react12.useState)({ open: false, mode: "invite" });
+  const [modal, setModal] = (0, import_react12.useState)({ open: false });
   const fetchData = (0, import_react12.useCallback)(async () => {
+    if (!organization.current) return;
     setLoadingData(true);
     try {
-      const [membersRes, invitesRes, workspacesRes, joinRequestsRes, highestRoleRes] = await Promise.all([
+      const [membersRes, workspacesRes, joinRequestsRes, highestRoleRes] = await Promise.all([
         organization.fetchMembers().catch(() => null),
-        organization.fetchInvites().catch(() => null),
         organization.fetchWorkspaces().catch(() => null),
         organization.fetchJoinRequests().catch(() => null),
         organization.getHighestRole?.().catch(() => null) ?? Promise.resolve(null)
       ]);
       if (highestRoleRes?.role) setHighestRole(highestRoleRes.role);
-      if (highestRoleRes?.emailDomain !== void 0) {
-        setEmailDomain(highestRoleRes.emailDomain ?? null);
-      }
-      if (highestRoleRes?.canClaimEmailDomain !== void 0) {
-        setCanClaimEmailDomain(highestRoleRes.canClaimEmailDomain);
-      }
       if (membersRes) setMembers(membersRes.filter((m) => m?.user));
-      if (invitesRes) setInvites(invitesRes);
       if (workspacesRes) setWorkspaces(workspacesRes);
       if (joinRequestsRes) setJoinRequests(joinRequestsRes);
     } catch {
@@ -6510,51 +6323,6 @@ function OrganizationContent({
   (0, import_react12.useEffect)(() => {
     fetchData();
   }, [fetchData]);
-  const [domainMatch, setDomainMatch] = (0, import_react12.useState)(null);
-  const [checkingDomainMatch, setCheckingDomainMatch] = (0, import_react12.useState)(false);
-  const [joiningByDomain, setJoiningByDomain] = (0, import_react12.useState)(false);
-  const [createModalOpen, setCreateModalOpen] = (0, import_react12.useState)(false);
-  (0, import_react12.useEffect)(() => {
-    if (current) return;
-    let cancelled = false;
-    setCheckingDomainMatch(true);
-    organization.checkDomainMatch().then((match) => {
-      if (!cancelled) setDomainMatch(match);
-    }).catch(() => {
-      if (!cancelled) setDomainMatch(null);
-    }).finally(() => {
-      if (!cancelled) setCheckingDomainMatch(false);
-    });
-    return () => {
-      cancelled = true;
-    };
-  }, [current, organization]);
-  const handleJoinByDomain = async () => {
-    if (!domainMatch) return;
-    setJoiningByDomain(true);
-    try {
-      await organization.joinByDomain();
-      await organization.switch(domainMatch.organizationId);
-      toast.success(`Joined ${domainMatch.organizationName}`);
-    } catch (err) {
-      toast.error(err instanceof Error ? err.message : "Failed to join organization");
-    } finally {
-      setJoiningByDomain(false);
-    }
-  };
-  const handleCreateOrganization = async (name, imageFile) => {
-    try {
-      const result = await organization.create({ name, imageFile });
-      if (result && "id" in result && result.id) {
-        await organization.switch(result.id);
-      }
-      toast.success("Organization created");
-      return true;
-    } catch (err) {
-      toast.error(err instanceof Error ? err.message : "Failed to create organization");
-      return false;
-    }
-  };
   const [manageModalOpen, setManageModalOpen] = (0, import_react12.useState)(false);
   const handleUpdateOrganization = async (name, imageFile) => {
     if (!current) return false;
@@ -6578,45 +6346,9 @@ function OrganizationContent({
       return false;
     }
   };
-  const openInviteModal = () => setModal({ open: true, mode: "invite" });
-  (0, import_react12.useEffect)(() => {
-    if (onInviteOpen) {
-      openInviteModal();
-      onInviteOpenChange?.(false);
-    }
-  }, [onInviteOpen]);
-  const openUpdateModal = (member) => setModal({ open: true, mode: "update", target: member });
-  const closeModal = () => setModal({ open: false, mode: "invite" });
-  const handleInviteEmail = async (input) => {
-    if (highestRole !== "admin") {
-      toast.error("You do not have permission to invite members");
-      closeModal();
-      return;
-    }
-    try {
-      await organization.inviteMemberByEmail(input);
-      toast.success(`Invitation sent to ${input.email}`);
-      await fetchData();
-      closeModal();
-    } catch (err) {
-      toast.error(err instanceof Error ? err.message : "Failed to send invite");
-    }
-  };
-  const handleInviteDomain = async (input) => {
-    if (highestRole !== "admin") {
-      toast.error("You do not have permission to invite members");
-      closeModal();
-      return;
-    }
-    try {
-      await organization.inviteDomain(input);
-      toast.success(`Domain ${input.domain} added`);
-      await fetchData();
-      closeModal();
-    } catch (err) {
-      toast.error(err instanceof Error ? err.message : "Failed to add domain");
-    }
-  };
+  const openUpdateModal = (member) => setModal({ open: true, target: member });
+  const closeModal = () => setModal({ open: false });
+  const adminCount = members.filter((m) => m.role === "admin").length;
   const handleUpdateMember = async (input) => {
     const target = modal.target;
     if (!target) {
@@ -6628,20 +6360,16 @@ function OrganizationContent({
       closeModal();
       return;
     }
-    if (target.role === "admin" && input.role === "member") {
-      const adminCount = members.filter((m) => m.role === "admin").length;
-      if (adminCount <= 1) {
-        toast.error(
-          "You're the only admin. Promote another member to admin before changing your role."
-        );
-        return;
-      }
+    if (target.role === "admin" && input.role === "member" && adminCount <= 1) {
+      toast.error(
+        "This is the only org admin. Make someone else an org admin first."
+      );
+      return;
     }
     try {
       await organization.updateMemberRole({
         userId: target.user._id,
-        role: input.role,
-        inviteAccess: input.inviteAccess
+        role: input.role
       });
       toast.success("Member updated");
       await fetchData();
@@ -6661,8 +6389,14 @@ function OrganizationContent({
       closeModal();
       return;
     }
+    if (target.role === "admin" && adminCount <= 1) {
+      toast.error(
+        "This is the only org admin. Make someone else an org admin first."
+      );
+      return;
+    }
     const confirmed = window.confirm(
-      `Remove ${target.user.email} from this organization?`
+      `Remove ${target.user.email} from this organization? They'll also be removed from every workspace in it.`
     );
     if (!confirmed) return;
     try {
@@ -6674,44 +6408,6 @@ function OrganizationContent({
     }
     closeModal();
   };
-  const handleCancelInvite = async (invite) => {
-    if (highestRole !== "admin") {
-      toast.error("You do not have permission to manage invites");
-      return;
-    }
-    const label = invite.kind === "domain" ? invite.domain : invite.email;
-    const confirmed = window.confirm(
-      invite.kind === "domain" ? `Revoke domain invite for ${label}? Members who already joined will keep their access.` : `Cancel invitation for ${label}?`
-    );
-    if (!confirmed) return;
-    try {
-      if (invite.kind === "domain") {
-        await organization.revokeDomainInvite(invite._id);
-      } else if (invite.token) {
-        await organization.cancelInvite(invite.token);
-      } else {
-        await organization.removeMember({ invitationIds: [invite._id] });
-      }
-      toast.success(invite.kind === "domain" ? "Domain invite revoked" : "Invitation removed");
-      await fetchData();
-    } catch (err) {
-      toast.error(err instanceof Error ? err.message : "Failed to update invite");
-    }
-  };
-  const handleResendInvite = async (invite) => {
-    if (invite.kind !== "email") return;
-    if (highestRole !== "admin") {
-      toast.error("You do not have permission to invite members");
-      return;
-    }
-    try {
-      await organization.resendInvite(invite._id);
-      toast.success("Invitation resent");
-      await fetchData();
-    } catch (err) {
-      toast.error(err instanceof Error ? err.message : "Failed to resend invitation");
-    }
-  };
   const handleApproveJoinRequest = async (request) => {
     try {
       await organization.approveJoinRequest(request._id);
@@ -6733,101 +6429,29 @@ function OrganizationContent({
     }
   };
   if (!current) {
-    return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_jsx_runtime17.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
-        "div",
-        {
-          className: "flex flex-col flex-1 min-w-0 min-h-0 w-full items-center justify-center",
-          style: { gap: T11.spXl, padding: T11.sp6xl },
-          children: [
-            /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_icons8.SiconGlobe, { className: "w-10 h-10", color: T11.muted }),
-            domainMatch ? /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_jsx_runtime17.Fragment, { children: [
-              /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
-                "p",
-                {
-                  className: "text-center",
-                  style: { color: T11.primary, fontFamily: T11.font, fontSize: T11.fsMd, fontWeight: 600 },
-                  children: [
-                    "An organization already exists for ",
-                    domainMatch.domain
-                  ]
-                }
-              ),
-              /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
-                "p",
-                {
-                  className: "text-center",
-                  style: { color: T11.muted, fontFamily: T11.font, fontSize: T11.fsSm },
-                  children: [
-                    domainMatch.organizationName,
-                    " \u2014 join it instead of creating a new one and fragmenting your company across multiple orgs."
-                  ]
-                }
-              ),
-              /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-                import_ui8.ScButton,
-                {
-                  text: joiningByDomain ? "Joining\u2026" : `Join ${domainMatch.organizationName}`,
-                  variant: "primary",
-                  size: "md",
-                  state: joiningByDomain ? "disabled" : "default",
-                  onClick: handleJoinByDomain
-                }
-              )
-            ] }) : /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_jsx_runtime17.Fragment, { children: [
-              /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-                "p",
-                {
-                  className: "text-center",
-                  style: { color: T11.primary, fontFamily: T11.font, fontSize: T11.fsMd, fontWeight: 600 },
-                  children: "You're not part of an organization yet"
-                }
-              ),
-              /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-                "p",
-                {
-                  className: "text-center",
-                  style: { color: T11.muted, fontFamily: T11.font, fontSize: T11.fsSm },
-                  children: "Create one to invite your team and manage workspaces together."
-                }
-              ),
-              /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-                import_ui8.ScButton,
-                {
-                  text: "Create organization",
-                  variant: "primary",
-                  size: "md",
-                  styleVariant: "icon-left",
-                  icon: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_icons8.SiconUserAdd, { className: "w-5 h-5", color: T11.inverse }),
-                  state: checkingDomainMatch ? "disabled" : "default",
-                  onClick: () => setCreateModalOpen(true)
-                }
-              )
-            ] })
-          ]
-        }
-      ),
-      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-        OrganizationModal,
-        {
-          open: createModalOpen,
-          mode: "create",
-          onClose: () => setCreateModalOpen(false),
-          onCreate: handleCreateOrganization
-        }
-      )
-    ] });
+    return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(
+      "div",
+      {
+        className: "flex flex-col flex-1 min-w-0 min-h-0 w-full items-center justify-center",
+        style: { gap: T11.spXl, padding: T11.sp6xl },
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_icons8.SiconGlobe, { className: "w-10 h-10", color: T11.muted }),
+          /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+            "p",
+            {
+              className: "text-center",
+              style: { color: T11.primary, fontFamily: T11.font, fontSize: T11.fsMd, fontWeight: 600 },
+              children: "Your workspace isn't part of an organization"
+            }
+          )
+        ]
+      }
+    );
   }
   const q = searchQuery.toLowerCase();
   const filteredMembers = members.filter(
     (m) => (m.user.email || "").toLowerCase().includes(q) || (m.user.name || "").toLowerCase().includes(q) || m.role.toLowerCase().includes(q)
   );
-  const filteredInvites = invites.filter((inv) => {
-    const label = inv.kind === "domain" ? inv.domain ?? "" : inv.email ?? "";
-    return label.toLowerCase().includes(q);
-  });
-  const emailInvites = filteredInvites.filter((inv) => inv.kind !== "domain");
-  const domainInvites = invites.filter((inv) => inv.kind === "domain");
   const scopeHeader = /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
     ScopeHeader,
     {
@@ -6876,15 +6500,26 @@ function OrganizationContent({
       )
     }
   );
+  const isOrgAdmin = highestRole === "admin";
+  const copyEmail = async (email) => {
+    try {
+      await navigator.clipboard.writeText(email);
+      toast.success("Email copied");
+      return true;
+    } catch {
+      toast.error("Couldn't copy the email");
+      return false;
+    }
+  };
   const peopleView = /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_jsx_runtime17.Fragment, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
       MemberListToolbar,
       {
-        activeTab,
-        onTabChange: setActiveTab,
+        activeTab: "active",
+        onTabChange: () => {
+        },
         activeLabel: "Members",
         activeCount: filteredMembers.length,
-        pendingCount: emailInvites.length,
         searchQuery,
         onSearchChange: setSearchQuery
       }
@@ -6892,47 +6527,31 @@ function OrganizationContent({
     /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
       MemberListFrame,
       {
-        isEmpty: activeTab === "active" ? filteredMembers.length === 0 : emailInvites.length === 0,
-        emptyText: activeTab === "active" ? "No members yet" : "No pending invites",
+        isEmpty: filteredMembers.length === 0,
+        emptyText: "No members yet",
         grow: "fill",
-        children: activeTab === "active" ? filteredMembers.map((m) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(MemberRow, { member: m, onClick: () => openUpdateModal(m) }, m._id)) : emailInvites.map((inv) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-          InviteRow,
+        children: filteredMembers.map((m) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+          MemberRow,
           {
-            invite: inv,
-            onCancel: () => void handleCancelInvite(inv),
-            onResend: () => void handleResendInvite(inv)
+            member: m,
+            onEdit: isOrgAdmin ? () => openUpdateModal(m) : void 0,
+            onCopyEmail: () => copyEmail(m.user.email)
           },
-          inv._id
+          m._id
         ))
       }
     )
   ] });
-  const workspacesView = /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-    Section,
-    {
-      title: "Workspaces in this organization",
-      empty: workspaces.length === 0,
-      children: workspaces.map((ws) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(WorkspaceRow, { workspace: ws }, ws._id))
-    }
-  );
-  const domainsView = /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_jsx_runtime17.Fragment, { children: [
+  const workspacesView = /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)(import_jsx_runtime17.Fragment, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
       Section,
       {
-        title: "Auto-join by email domain",
-        empty: domainInvites.length === 0,
-        emptyText: canClaimEmailDomain ? void 0 : `Auto-join needs a company email domain.${emailDomain ? ` ${emailDomain} is a public email provider, so it` : " A public email provider"} can't be claimed \u2014 invite people by email instead.`,
-        children: domainInvites.map((inv) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-          InviteRow,
-          {
-            invite: inv,
-            onCancel: () => void handleCancelInvite(inv)
-          },
-          inv._id
-        ))
+        title: "Workspaces in this organization",
+        empty: workspaces.length === 0,
+        children: workspaces.map((ws) => /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(WorkspaceRow, { workspace: ws }, ws._id))
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+    (isOrgAdmin || joinRequests.length > 0) && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
       Section,
       {
         title: "Workspaces asking to join",
@@ -6941,8 +6560,8 @@ function OrganizationContent({
           JoinRequestRow,
           {
             request: req,
-            onApprove: () => void handleApproveJoinRequest(req),
-            onReject: () => void handleRejectJoinRequest(req)
+            onApprove: isOrgAdmin ? () => void handleApproveJoinRequest(req) : void 0,
+            onReject: isOrgAdmin ? () => void handleRejectJoinRequest(req) : void 0
           },
           req._id
         ))
@@ -6953,25 +6572,17 @@ function OrganizationContent({
     scopeHeader,
     loadingData && loadingBlock,
     !loadingData && view === "people" && peopleView,
-    !loadingData && view === "workspaces" && workspacesView,
-    !loadingData && view === "domains" && domainsView,
+    !loadingData && view !== "people" && workspacesView,
     /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-      OrganizationInviteModal,
+      OrganizationMemberModal,
       {
         open: modal.open,
-        mode: modal.mode,
         userEmail: modal.target?.user.email,
         initialRole: modal.target?.role === "admin" || modal.target?.role === "member" ? modal.target.role : void 0,
-        initialInviteAccess: modal.target?.inviteAccess,
-        allowSubmitWithoutChanges: false,
         lockRole: modal.target?.role === "guest",
         lockedRoleLabel: orgRoleLabel(modal.target?.role),
         canRemove: highestRole === "admin",
-        canClaimDomain: canClaimEmailDomain,
-        claimableDomain: emailDomain,
         onClose: closeModal,
-        onInviteEmail: handleInviteEmail,
-        onInviteDomain: handleInviteDomain,
         onUpdate: handleUpdateMember,
         onRemove: handleRemoveMember
       }
@@ -7016,34 +6627,20 @@ function OrganizationContent({
         backgroundSize: "24px 24px"
       },
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex items-center justify-between shrink-0 w-full", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-            "p",
-            {
-              className: "flex-1 min-w-0 truncate",
-              style: {
-                color: T11.primary,
-                fontFamily: T11.font,
-                fontSize: "var(--font-size-font-size-xxl)",
-                fontWeight: 600,
-                lineHeight: "var(--line-height-line-height-xxl)"
-              },
-              children: current?.name ? `${current.name} \u2014 Organization` : "Organization"
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-            import_ui8.ScButton,
-            {
-              text: "Invite",
-              variant: "primary",
-              size: "md",
-              styleVariant: "icon-left",
-              state: highestRole !== "admin" ? "disabled" : "default",
-              icon: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(import_icons8.SiconUserAdd, { className: "w-5 h-5", color: "var(--alias-text---icons-inverse)" }),
-              onClick: openInviteModal
-            }
-          )
-        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "flex items-center justify-between shrink-0 w-full", children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+          "p",
+          {
+            className: "flex-1 min-w-0 truncate",
+            style: {
+              color: T11.primary,
+              fontFamily: T11.font,
+              fontSize: "var(--font-size-font-size-xxl)",
+              fontWeight: 600,
+              lineHeight: "var(--line-height-line-height-xxl)"
+            },
+            children: current?.name ? `${current.name} \u2014 Organization` : "Organization"
+          }
+        ) }),
         innerContent
       ]
     }
@@ -10615,8 +10212,7 @@ function SettingsNav({
         /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "flex flex-col w-full", style: { gap: "var(--spacing-md)" }, children: hasOrganization ? /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_jsx_runtime22.Fragment, { children: [
           /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { style: { padding: "4px 12px", fontSize: 11, fontWeight: 500, color: MUTED_COLOR2, textTransform: "uppercase", letterSpacing: "0.08em" }, children: "Organization" }),
           item("organization", (color) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_icons13.SiconTeam, { className: "w-5 h-5", color })),
-          item("organizationWorkspaces", (color) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_icons13.SiconWorkspace, { className: "w-5 h-5", color })),
-          item("organizationDomains", (color) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_icons13.SiconLock, { className: "w-5 h-5", color }))
+          item("organizationWorkspaces", (color) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_icons13.SiconWorkspace, { className: "w-5 h-5", color }))
         ] }) : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
           SettingsNavItem,
           {
@@ -11301,16 +10897,49 @@ function ProfileTab() {
     }
   );
 }
+var WORKSPACE_LIST_PAGE_SIZE = 10;
 function WorkspaceListTab({
   workspaces,
   loading,
   onCreateClick: _onCreateClick,
   onEditClick,
   onSwitchClick,
-  onLeaveClick
+  onLeaveClick,
+  fetchPlans,
+  pageSize = WORKSPACE_LIST_PAGE_SIZE
 }) {
   const currentWorkspace = workspaces.find((ws) => ws.isCurrent);
   const otherWorkspaces = workspaces.filter((ws) => !ws.isCurrent);
+  const pageCount = Math.max(1, Math.ceil(otherWorkspaces.length / pageSize));
+  const [page, setPage] = (0, import_react17.useState)(0);
+  const safePage = Math.min(page, pageCount - 1);
+  const pageStart = safePage * pageSize;
+  const pageWorkspaces = otherWorkspaces.slice(pageStart, pageStart + pageSize);
+  const [plans, setPlans] = (0, import_react17.useState)({});
+  const requestedPlans = (0, import_react17.useRef)(/* @__PURE__ */ new Set());
+  const visibleIds = [
+    ...currentWorkspace ? [currentWorkspace._id] : [],
+    ...pageWorkspaces.map((ws) => ws._id)
+  ];
+  const visibleKey = visibleIds.join(",");
+  const mounted = (0, import_react17.useRef)(true);
+  (0, import_react17.useEffect)(() => {
+    mounted.current = true;
+    return () => {
+      mounted.current = false;
+    };
+  }, []);
+  (0, import_react17.useEffect)(() => {
+    if (!fetchPlans || loading) return;
+    const missing = visibleKey.split(",").filter((id) => id && !requestedPlans.current.has(id));
+    if (!missing.length) return;
+    missing.forEach((id) => requestedPlans.current.add(id));
+    fetchPlans(missing).then((found) => {
+      if (mounted.current) setPlans((prev) => ({ ...prev, ...found }));
+    }).catch(() => {
+    });
+  }, [fetchPlans, loading, visibleKey]);
+  const planOf = (ws) => fetchPlans ? plans[ws._id] ?? "" : ws.plan ?? "";
   return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
     "div",
     {
@@ -11368,7 +10997,7 @@ function WorkspaceListTab({
                   initials: currentWorkspace.initials,
                   imageUrl: currentWorkspace.imageUrl,
                   role: currentWorkspace.role,
-                  plan: currentWorkspace.plan,
+                  plan: planOf(currentWorkspace),
                   ownerId: currentWorkspace.ownerEmail,
                   type: "currentWS",
                   onSettings: () => onEditClick(currentWorkspace),
@@ -11413,14 +11042,14 @@ function WorkspaceListTab({
                 {
                   className: "flex flex-col items-start w-full",
                   style: { gap: 16 },
-                  children: otherWorkspaces.map((ws) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+                  children: pageWorkspaces.map((ws) => /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
                     import_ui14.ScWorkspaceSwitchCard,
                     {
                       wsName: ws.name,
                       initials: ws.initials,
                       imageUrl: ws.imageUrl,
                       role: ws.role,
-                      plan: ws.plan,
+                      plan: planOf(ws),
                       ownerId: ws.ownerEmail,
                       type: "otherWS",
                       onSwitch: () => onSwitchClick(ws),
@@ -11430,6 +11059,56 @@ function WorkspaceListTab({
                     ws._id
                   ))
                 }
+              ),
+              pageCount > 1 && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+                "div",
+                {
+                  className: "flex items-center justify-between shrink-0 w-full",
+                  style: { gap: "var(--spacing-md)" },
+                  children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+                      "span",
+                      {
+                        style: {
+                          color: "var(--alias-text---icons-muted)",
+                          fontFamily: "var(--font-family-font-family-body)",
+                          fontSize: "var(--font-size-font-size-sm)",
+                          lineHeight: "var(--line-height-line-height-sm)"
+                        },
+                        children: [
+                          pageStart + 1,
+                          "\u2013",
+                          pageStart + pageWorkspaces.length,
+                          " of",
+                          " ",
+                          otherWorkspaces.length
+                        ]
+                      }
+                    ),
+                    /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex items-center", style: { gap: "var(--spacing-md)" }, children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+                        import_ui13.ScButton,
+                        {
+                          text: "Previous",
+                          variant: "tertiary",
+                          size: "sm",
+                          state: safePage === 0 ? "disabled" : "default",
+                          onClick: safePage === 0 ? void 0 : () => setPage(safePage - 1)
+                        }
+                      ),
+                      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+                        import_ui13.ScButton,
+                        {
+                          text: "Next",
+                          variant: "tertiary",
+                          size: "sm",
+                          state: safePage >= pageCount - 1 ? "disabled" : "default",
+                          onClick: safePage >= pageCount - 1 ? void 0 : () => setPage(safePage + 1)
+                        }
+                      )
+                    ] })
+                  ]
+                }
               )
             ]
           }
@@ -11588,7 +11267,6 @@ function SettingsContentInner({
   const [creatingWorkspace, setCreatingWorkspace] = (0, import_react17.useState)(false);
   const [updatingWorkspace, setUpdatingWorkspace] = (0, import_react17.useState)(false);
   const [teamInviteOpen, setTeamInviteOpen] = (0, import_react17.useState)(false);
-  const [organizationInviteOpen, setOrganizationInviteOpen] = (0, import_react17.useState)(false);
   const [tokenShowRevoked, setTokenShowRevoked] = (0, import_react17.useState)(false);
   const [tokenCreateOpen, setTokenCreateOpen] = (0, import_react17.useState)(false);
   const [billingShowPlans, setBillingShowPlans] = (0, import_react17.useState)(false);
@@ -12095,31 +11773,6 @@ function SettingsContentInner({
                         )
                       }
                     ),
-                    activeTab === "organization" && hasOrganization && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-                      SettingsTooltip,
-                      {
-                        content: "Invite someone into your organization",
-                        placement: "bottom",
-                        inline: true,
-                        children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-                          import_ui13.ScButton,
-                          {
-                            text: "Invite",
-                            variant: "secondary",
-                            size: "md",
-                            styleVariant: "icon-left",
-                            icon: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-                              import_icons13.SiconUserAdd,
-                              {
-                                className: "w-5 h-5",
-                                color: "var(--alias-text---icons-inverse)"
-                              }
-                            ),
-                            onClick: () => setOrganizationInviteOpen(true)
-                          }
-                        )
-                      }
-                    ),
                     activeTab === "apikey" && isWorkspaceAdmin && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)("div", { className: "flex items-center shrink-0", style: { gap: "var(--spacing-md)" }, children: [
                       /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
                         SettingsTooltip,
@@ -12249,6 +11902,7 @@ function SettingsContentInner({
                       {
                         workspaces: displayWorkspaces,
                         loading: workspaceListLoading && workspaceList.length === 0,
+                        fetchPlans: workspace.fetchPlans,
                         onCreateClick: handleCreateClick,
                         onEditClick: handleEditClick,
                         onSwitchClick: async (ws) => {
@@ -12278,9 +11932,7 @@ function SettingsContentInner({
                       OrganizationContent,
                       {
                         embedded: true,
-                        view: activeTab === "organizationWorkspaces" ? "workspaces" : activeTab === "organizationDomains" ? "domains" : "people",
-                        onInviteOpen: organizationInviteOpen,
-                        onInviteOpenChange: setOrganizationInviteOpen
+                        view: activeTab === "organizationWorkspaces" || activeTab === "organizationDomains" ? "workspaces" : "people"
                       }
                     ) }),
                     activeTab === "billing" && isWorkspaceAdmin && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "flex flex-col flex-1 min-w-0 min-h-0 h-full", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
@@ -12418,3 +12070,246 @@ function SettingsContentInner({
     }
   );
 }
+
+// src/workspace-picker.tsx
+var import_react18 = require("react");
+var import_ui15 = require("@streamoid/ui");
+var import_jsx_runtime23 = require("react/jsx-runtime");
+var T13 = {
+  primary: "var(--alias-text---icons-primary)",
+  muted: "var(--alias-text---icons-muted)",
+  tertiary: "var(--alias-text---icons-tertiary)",
+  surface: "var(--alias-surface-base)",
+  fillPlus: "var(--alias-fill-neutral-neutralplus)",
+  borderSubtle: "var(--alias-border-subtle)",
+  font: "var(--font-family-font-family-body)",
+  fsXs: "var(--font-size-font-size-xs)",
+  fsSm: "var(--font-size-font-size-sm)",
+  fsXl: "var(--font-size-font-size-xl)",
+  lhXs: "var(--line-height-line-height-xs)",
+  lhSm: "var(--line-height-line-height-sm)",
+  lhXl: "var(--line-height-line-height-xl)",
+  spXs: "var(--spacing-xs)",
+  spMd: "var(--spacing-md)",
+  spXl: "var(--spacing-xl)",
+  sp3xl: "var(--spacing-3xl)",
+  sp5xl: "var(--spacing-5xl)",
+  sp6xl: "var(--spacing-6xl)",
+  rLg: "var(--radius-lg)",
+  r3xl: "var(--radius-3xl)"
+};
+function WorkspacePicker({
+  organizationName,
+  workspaces,
+  loading = false,
+  onJoin,
+  onCreate
+}) {
+  const [selected, setSelected] = (0, import_react18.useState)(/* @__PURE__ */ new Set());
+  const [creating, setCreating] = (0, import_react18.useState)(false);
+  const [name, setName] = (0, import_react18.useState)("");
+  const [busy, setBusy] = (0, import_react18.useState)(false);
+  const hasWorkspaces = workspaces.length > 0;
+  const showCreate = creating || !loading && !hasWorkspaces;
+  const orgLabel = organizationName || "your organization";
+  const toggle = (id) => setSelected((prev) => {
+    const next = new Set(prev);
+    if (next.has(id)) next.delete(id);
+    else next.add(id);
+    return next;
+  });
+  const run = async (action) => {
+    setBusy(true);
+    try {
+      await action();
+    } catch {
+    } finally {
+      setBusy(false);
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+    "div",
+    {
+      className: "flex flex-col w-full",
+      style: { maxWidth: 520, gap: T13.sp5xl, fontFamily: T13.font },
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex flex-col", style: { gap: T13.spMd }, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+            "p",
+            {
+              style: {
+                color: T13.primary,
+                fontSize: T13.fsXl,
+                fontWeight: 600,
+                lineHeight: T13.lhXl,
+                margin: 0
+              },
+              children: "Choose your workspaces"
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("p", { style: { color: T13.muted, fontSize: T13.fsSm, lineHeight: T13.lhSm, margin: 0 }, children: hasWorkspaces || loading ? `Join one or more workspaces in ${orgLabel} as a member, or create your own.` : `There are no workspaces to join in ${orgLabel} yet. Create one to get started.` })
+        ] }),
+        (loading || hasWorkspaces) && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+          "div",
+          {
+            className: "flex flex-col w-full overflow-y-auto",
+            style: {
+              maxHeight: 360,
+              background: T13.surface,
+              border: `1px solid ${T13.borderSubtle}`,
+              borderRadius: T13.r3xl
+            },
+            children: loading ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+              "div",
+              {
+                className: "flex items-center justify-center",
+                style: { padding: T13.sp6xl, color: T13.muted, fontSize: T13.fsSm },
+                children: "Loading workspaces\u2026"
+              }
+            ) : workspaces.map((workspace, index) => {
+              const checked = selected.has(workspace._id);
+              return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+                "div",
+                {
+                  role: "checkbox",
+                  "aria-checked": checked,
+                  tabIndex: 0,
+                  className: "flex items-center cursor-pointer",
+                  style: {
+                    gap: T13.spXl,
+                    padding: `${T13.spXl} ${T13.sp3xl}`,
+                    borderTop: index ? `1px solid ${T13.borderSubtle}` : "none"
+                  },
+                  onClick: () => toggle(workspace._id),
+                  onKeyDown: (e) => {
+                    if (e.key === " " || e.key === "Enter") {
+                      e.preventDefault();
+                      toggle(workspace._id);
+                    }
+                  },
+                  children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_ui15.ScCheckbox, { checked }),
+                    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+                      ProfileAvatar,
+                      {
+                        name: workspace.name,
+                        profileImage: workspace.imageUrl,
+                        size: 32,
+                        borderRadius: T13.rLg
+                      }
+                    ),
+                    /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex flex-col min-w-0", children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+                        "span",
+                        {
+                          className: "truncate",
+                          style: {
+                            color: T13.primary,
+                            fontSize: T13.fsSm,
+                            fontWeight: 500,
+                            lineHeight: T13.lhSm
+                          },
+                          children: workspace.name
+                        }
+                      ),
+                      workspace.ownerName && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+                        "span",
+                        {
+                          className: "truncate",
+                          style: { color: T13.muted, fontSize: T13.fsXs, lineHeight: T13.lhXs },
+                          children: [
+                            "Created by ",
+                            workspace.ownerName
+                          ]
+                        }
+                      )
+                    ] })
+                  ]
+                },
+                workspace._id
+              );
+            })
+          }
+        ),
+        showCreate ? /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex flex-col w-full", style: { gap: T13.spMd }, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+            "label",
+            {
+              htmlFor: "workspace-picker-name",
+              style: { color: T13.tertiary, fontSize: T13.fsSm, lineHeight: T13.lhSm },
+              children: "New workspace name"
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+            "input",
+            {
+              id: "workspace-picker-name",
+              autoFocus: true,
+              value: name,
+              onChange: (e) => setName(e.target.value),
+              onKeyDown: (e) => {
+                if (e.key === "Enter" && name.trim() && !busy) {
+                  void run(() => onCreate(name.trim()));
+                }
+              },
+              placeholder: "e.g. Marketing",
+              style: {
+                height: 48,
+                padding: `0 ${T13.sp3xl}`,
+                background: T13.fillPlus,
+                border: "none",
+                outline: "none",
+                borderRadius: T13.r3xl,
+                color: T13.primary,
+                fontFamily: T13.font,
+                fontSize: T13.fsSm
+              }
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex items-center justify-end w-full", style: { gap: T13.spMd }, children: [
+            hasWorkspaces && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+              import_ui15.ScButton,
+              {
+                text: "Back",
+                variant: "tertiary",
+                size: "md",
+                onClick: () => setCreating(false)
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+              import_ui15.ScButton,
+              {
+                text: busy ? "Creating\u2026" : "Create workspace",
+                variant: "primary",
+                size: "md",
+                state: !name.trim() || busy ? "disabled" : "default",
+                onClick: name.trim() && !busy ? () => void run(() => onCreate(name.trim())) : void 0
+              }
+            )
+          ] })
+        ] }) : /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "flex flex-wrap items-center justify-between w-full", style: { gap: T13.spMd }, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+            import_ui15.ScButton,
+            {
+              text: "Create a workspace",
+              variant: "tertiary",
+              size: "md",
+              state: loading || busy ? "disabled" : "default",
+              onClick: loading || busy ? void 0 : () => setCreating(true)
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+            import_ui15.ScButton,
+            {
+              text: busy ? "Joining\u2026" : selected.size > 1 ? `Join ${selected.size} workspaces` : "Join workspace",
+              variant: "primary",
+              size: "md",
+              state: !selected.size || busy ? "disabled" : "default",
+              onClick: selected.size && !busy ? () => void run(() => onJoin([...selected])) : void 0
+            }
+          )
+        ] })
+      ]
+    }
+  );
+}