@arbidocs/blocks 0.3.185 → 0.4.0

package/dist/chunk-TYZUCAT7.js

@@ -0,0 +1,787 @@
+"use client";
+import { RoleBadge } from './chunk-NBV56SGU.js';
+import { ModalSection, ModalSectionTitle } from './chunk-TX2ZICS7.js';
+import { testIdOr } from './chunk-7F6CBP3Z.js';
+import { Clock, UserMinus, Trash2, Gift, AtSign, UserPlus, MoreVertical, Plus, KeyRound, Loader2, BellOff, Bell, X, ChevronsUpDown, AlertCircle, XCircle, CheckCircle, ChevronDown, ChevronRight } from 'lucide-react';
+import { cn, Tooltip, TooltipTrigger, Select, SelectTrigger, SelectContent, SelectItem, TooltipContent, SelectValue, Button, Textarea, DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuSeparator, DropdownMenuItem, ScrollArea, Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription, DialogFooter, Popover, PopoverTrigger, PopoverContent, Command, CommandInput, CommandList, CommandEmpty, CommandGroup, CommandItem, Checkbox } from '@arbidocs/react/ui';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { useMemo, useState, useRef, useEffect } from 'react';
+
+function MemberMutedText({
+  children,
+  title,
+  className
+}) {
+  return /* @__PURE__ */ jsx("span", { className: cn("text-sm text-muted-foreground", className), title, children });
+}
+function MemberNameCell({ children }) {
+  return /* @__PURE__ */ jsx("div", { className: "flex h-full items-center gap-2", children });
+}
+function MemberRoleCell({
+  role,
+  roles,
+  tooltip,
+  canChange,
+  isPending,
+  onChange,
+  temporaryHint
+}) {
+  const current = roles.find((r) => r.value === role);
+  return /* @__PURE__ */ jsxs("div", { className: "flex h-full items-center gap-1", children: [
+    /* @__PURE__ */ jsxs(Tooltip, { children: [
+      /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx("span", { children: /* @__PURE__ */ jsxs(Select, { value: role, onValueChange: onChange, disabled: !canChange || isPending, children: [
+        /* @__PURE__ */ jsx(
+          SelectTrigger,
+          {
+            className: cn(
+              "h-6 w-[130px] border-0 bg-transparent text-sm focus:ring-0 focus:ring-offset-0 disabled:opacity-100",
+              canChange ? "hover:bg-muted/50" : "cursor-not-allowed [&>svg]:opacity-30"
+            ),
+            children: /* @__PURE__ */ jsx(RoleBadge, { label: current?.label ?? role, badgeClass: current?.badgeClass ?? "" })
+          }
+        ),
+        /* @__PURE__ */ jsx(SelectContent, { children: roles.map((r) => /* @__PURE__ */ jsx(SelectItem, { value: r.value, children: /* @__PURE__ */ jsx(RoleBadge, { label: r.label, badgeClass: r.badgeClass }) }, r.value)) })
+      ] }) }) }),
+      /* @__PURE__ */ jsx(TooltipContent, { side: "right", className: "max-w-[300px]", children: /* @__PURE__ */ jsx("p", { children: tooltip }) })
+    ] }),
+    temporaryHint && /* @__PURE__ */ jsxs(Tooltip, { children: [
+      /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
+        Clock,
+        {
+          className: "size-3.5 shrink-0 cursor-default text-muted-foreground",
+          "aria-label": temporaryHint
+        }
+      ) }),
+      /* @__PURE__ */ jsx(TooltipContent, { side: "right", className: "max-w-[300px]", children: /* @__PURE__ */ jsx("p", { children: temporaryHint }) })
+    ] })
+  ] });
+}
+function MemberListLoading({ label = "Loading users..." }) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: "rounded-md bg-blue-bg p-3 text-center text-sm",
+      "data-testid": "workspace-users-loading",
+      children: [
+        /* @__PURE__ */ jsx("div", { className: "mr-2 inline-block size-4 animate-spin rounded-full border-2 border-primary/30 border-t-primary" }),
+        label
+      ]
+    }
+  );
+}
+function MemberBulkActions({
+  roles,
+  onChangeRole,
+  isRoleDisabled,
+  roleTooltip,
+  isOwner,
+  onRemove,
+  isRemoveDisabled,
+  removeTooltip,
+  changeRolePlaceholder = "Change role"
+}) {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs(Tooltip, { children: [
+      /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, onFocusCapture: (e) => e.stopPropagation(), children: /* @__PURE__ */ jsx("span", { tabIndex: !isOwner ? 0 : void 0, children: /* @__PURE__ */ jsxs(Select, { value: "", onValueChange: onChangeRole, disabled: isRoleDisabled, children: [
+        /* @__PURE__ */ jsx(
+          SelectTrigger,
+          {
+            className: cn(
+              "h-7 w-[120px] text-sm pointer-coarse:h-11",
+              isRoleDisabled ? "border-border text-muted-foreground" : "border-input"
+            ),
+            children: /* @__PURE__ */ jsx(SelectValue, { placeholder: changeRolePlaceholder })
+          }
+        ),
+        /* @__PURE__ */ jsx(SelectContent, { children: roles.map((r) => /* @__PURE__ */ jsx(SelectItem, { value: r.value, children: r.label }, r.value)) })
+      ] }) }) }),
+      /* @__PURE__ */ jsx(TooltipContent, { children: /* @__PURE__ */ jsx("p", { children: roleTooltip }) })
+    ] }),
+    /* @__PURE__ */ jsxs(Tooltip, { children: [
+      /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx("span", { tabIndex: !isOwner ? 0 : void 0, children: /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "outline",
+          size: "icon",
+          onClick: onRemove,
+          disabled: isRemoveDisabled,
+          "aria-label": removeTooltip,
+          className: cn(
+            "size-7 pointer-coarse:size-11",
+            isOwner ? "border-destructive/30 text-destructive hover:bg-destructive hover:text-destructive-foreground" : "border-border text-muted-foreground"
+          ),
+          children: /* @__PURE__ */ jsx(UserMinus, { className: "size-4" })
+        }
+      ) }) }),
+      /* @__PURE__ */ jsx(TooltipContent, { children: /* @__PURE__ */ jsx("p", { children: removeTooltip }) })
+    ] })
+  ] });
+}
+function WorkspaceDeleteButton({
+  canDelete,
+  disabledReason = "",
+  isDeleting = false,
+  onDelete,
+  labels = { delete: "Delete", deleting: "Deleting..." }
+}) {
+  const button = /* @__PURE__ */ jsxs(
+    Button,
+    {
+      variant: "ghost",
+      size: "sm",
+      onClick: canDelete ? onDelete : void 0,
+      disabled: !canDelete || isDeleting,
+      className: "h-7 px-2 text-sm text-destructive hover:bg-destructive/10 hover:text-destructive pointer-coarse:h-11",
+      "data-testid": "workspace-delete-button",
+      children: [
+        /* @__PURE__ */ jsx(Trash2, { className: "mr-1 size-3.5" }),
+        /* @__PURE__ */ jsx("span", { children: isDeleting ? labels.deleting : labels.delete })
+      ]
+    }
+  );
+  if (canDelete || !disabledReason) return button;
+  return /* @__PURE__ */ jsxs(Tooltip, { children: [
+    /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx("span", { tabIndex: 0, children: button }) }),
+    /* @__PURE__ */ jsx(TooltipContent, { children: /* @__PURE__ */ jsx("p", { children: disabledReason }) })
+  ] });
+}
+function RoleSelect({ value, roles, onChange, description }) {
+  const current = roles.find((r) => r.value === value);
+  return /* @__PURE__ */ jsxs(Tooltip, { children: [
+    /* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx("span", { children: /* @__PURE__ */ jsxs(Select, { value, onValueChange: onChange, children: [
+      /* @__PURE__ */ jsx(SelectTrigger, { className: "h-8 w-[140px] pointer-coarse:h-11", children: /* @__PURE__ */ jsx(SelectValue, { children: /* @__PURE__ */ jsx(RoleBadge, { label: current?.label ?? value, badgeClass: current?.badgeClass ?? "" }) }) }),
+      /* @__PURE__ */ jsx(SelectContent, { children: roles.map((r) => /* @__PURE__ */ jsx(SelectItem, { value: r.value, children: /* @__PURE__ */ jsx(RoleBadge, { label: r.label, badgeClass: r.badgeClass }) }, r.value)) })
+    ] }) }) }),
+    /* @__PURE__ */ jsx(TooltipContent, { side: "left", className: "max-w-[300px]", children: /* @__PURE__ */ jsx("p", { children: description }) })
+  ] });
+}
+var DEFAULT_ADD_CONTACTS_LABELS = {
+  placeholder: "name@example.com",
+  hint: "Paste one or multiple emails \u2014 separated by commas, spaces, or new lines.",
+  add: (count) => `Add${count > 0 ? ` (${count})` : ""}`,
+  addOverMax: (count, max) => `Add (${count}) - Max ${max}`,
+  adding: "Adding...",
+  cancel: "Cancel",
+  results: "Results",
+  email: "Email",
+  status: "Status",
+  done: "Done",
+  addMore: "Add More",
+  reward: (amount) => /* @__PURE__ */ jsxs(Fragment, { children: [
+    "Get ",
+    /* @__PURE__ */ jsxs("span", { className: "font-semibold text-foreground", children: [
+      amount,
+      " off your next invoice"
+    ] }),
+    " for every invited contact who goes Pro. They get ",
+    amount,
+    " off theirs."
+  ] })
+};
+function AddContactsForm({
+  value,
+  onChange,
+  emailCount,
+  maxEmails = 100,
+  isPending,
+  onSubmit,
+  onCancel,
+  rewardAmount,
+  labels
+}) {
+  const l = useMemo(() => ({ ...DEFAULT_ADD_CONTACTS_LABELS, ...labels }), [labels]);
+  const overMax = emailCount > maxEmails;
+  return /* @__PURE__ */ jsxs("div", { className: "space-y-4", "data-slot": "add-contacts-form", children: [
+    rewardAmount && /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: "flex items-start gap-2 rounded-md bg-green-bg p-3 text-sm",
+        "data-testid": "invite-reward-banner",
+        children: [
+          /* @__PURE__ */ jsx(Gift, { className: "mt-0.5 size-4 shrink-0 text-green-text" }),
+          /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: l.reward(rewardAmount) })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxs("div", { children: [
+      /* @__PURE__ */ jsx(
+        Textarea,
+        {
+          id: "invite-emails",
+          value,
+          onChange: (e) => onChange(e.target.value),
+          disabled: isPending,
+          placeholder: l.placeholder,
+          rows: 2,
+          autoFocus: true,
+          "data-testid": "invite-emails-input"
+        }
+      ),
+      /* @__PURE__ */ jsx("p", { className: "mt-1.5 text-sm text-muted-foreground", children: l.hint })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2 pt-2", children: [
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          onClick: onSubmit,
+          disabled: emailCount === 0 || overMax || isPending,
+          className: "w-full",
+          "data-testid": "invite-send-button",
+          children: isPending ? l.adding : /* @__PURE__ */ jsxs(Fragment, { children: [
+            /* @__PURE__ */ jsx(AtSign, { className: "mr-2 size-4" }),
+            overMax ? l.addOverMax(emailCount, maxEmails) : l.add(emailCount)
+          ] })
+        }
+      ),
+      /* @__PURE__ */ jsx(Button, { variant: "outline", onClick: onCancel, disabled: isPending, className: "w-full", children: l.cancel })
+    ] })
+  ] });
+}
+var STATUS_ICON = {
+  success: /* @__PURE__ */ jsx(CheckCircle, { className: "size-4 shrink-0 text-green-text" }),
+  failed: /* @__PURE__ */ jsx(XCircle, { className: "size-4 shrink-0 text-red-text" }),
+  pending: /* @__PURE__ */ jsx(AlertCircle, { className: "size-4 shrink-0 text-yellow-text" })
+};
+function AddContactsResults({ rows, onDone, onAddMore, labels }) {
+  const l = useMemo(() => ({ ...DEFAULT_ADD_CONTACTS_LABELS, ...labels }), [labels]);
+  return /* @__PURE__ */ jsxs(ModalSection, { children: [
+    /* @__PURE__ */ jsx(ModalSectionTitle, { children: l.results }),
+    /* @__PURE__ */ jsx("div", { className: "max-h-80 overflow-y-auto rounded-md border", children: /* @__PURE__ */ jsxs("table", { className: "w-full", children: [
+      /* @__PURE__ */ jsx("thead", { className: "sticky top-0 bg-muted/50", children: /* @__PURE__ */ jsxs("tr", { children: [
+        /* @__PURE__ */ jsx("th", { className: "p-2 text-left font-medium", children: l.email }),
+        /* @__PURE__ */ jsx("th", { className: "p-2 text-left font-medium", children: l.status })
+      ] }) }),
+      /* @__PURE__ */ jsx("tbody", { children: rows.map((row, index) => /* @__PURE__ */ jsxs(
+        "tr",
+        {
+          className: "border-t hover:bg-muted/30",
+          "data-testid": `email-status-row-${index}`,
+          children: [
+            /* @__PURE__ */ jsx("td", { className: "p-2", children: row.email }),
+            /* @__PURE__ */ jsx("td", { className: "p-2", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+              STATUS_ICON[row.status],
+              /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: row.message })
+            ] }) })
+          ]
+        },
+        index
+      )) })
+    ] }) }),
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2 pt-4", children: [
+      /* @__PURE__ */ jsx(Button, { onClick: onDone, className: "w-full", "data-testid": "close-results-button", children: l.done }),
+      /* @__PURE__ */ jsx(
+        Button,
+        {
+          variant: "outline",
+          onClick: onAddMore,
+          className: "w-full",
+          "data-testid": "start-over-button",
+          children: l.addMore
+        }
+      )
+    ] })
+  ] });
+}
+var DEFAULT_DM_INVITE_CHIP_LABELS = {
+  title: "Add a contact by email",
+  description: "Send an invitation to join you on ARBI"
+};
+function DmInviteChip({
+  onClick,
+  title,
+  description,
+  testId = "dm-invite-chip",
+  labels
+}) {
+  const l = useMemo(() => ({ ...DEFAULT_DM_INVITE_CHIP_LABELS, ...labels }), [labels]);
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      type: "button",
+      onClick,
+      "data-testid": testId,
+      className: "flex w-full items-center gap-3 border-b border-border px-4 py-3 text-left transition-colors hover:bg-accent/60 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring pointer-coarse:min-h-11",
+      children: [
+        /* @__PURE__ */ jsx("span", { className: "flex size-9 shrink-0 items-center justify-center rounded-full bg-ai-accent-soft", children: /* @__PURE__ */ jsx(UserPlus, { className: "size-4 text-ai-accent" }) }),
+        /* @__PURE__ */ jsxs("span", { className: "min-w-0", children: [
+          /* @__PURE__ */ jsx("span", { className: "block text-sm font-semibold text-foreground", children: title ?? l.title }),
+          /* @__PURE__ */ jsx("span", { className: "block text-xs text-muted-foreground", children: description ?? l.description })
+        ] })
+      ]
+    }
+  );
+}
+function DmThreadHeader({
+  avatar,
+  name,
+  badge,
+  presence,
+  email,
+  menu,
+  testId = "dm-active-chip"
+}) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: "flex items-center gap-1 border-b border-border pr-2",
+      "data-slot": "dm-thread-header",
+      children: [
+        /* @__PURE__ */ jsxs("div", { "data-testid": testId, className: "flex min-w-0 flex-1 items-center gap-3 px-4 py-2.5", children: [
+          avatar,
+          /* @__PURE__ */ jsxs("span", { className: "min-w-0 flex-1", children: [
+            /* @__PURE__ */ jsxs("span", { className: "flex min-w-0 items-center gap-1.5", children: [
+              /* @__PURE__ */ jsx("span", { className: "truncate text-sm font-semibold text-foreground", children: name }),
+              badge
+            ] }),
+            /* @__PURE__ */ jsxs("span", { className: "flex min-w-0 items-center gap-1.5", children: [
+              presence,
+              presence && /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: "\xB7" }),
+              /* @__PURE__ */ jsx("span", { className: "min-w-0 truncate text-xs text-muted-foreground", children: email ?? "" })
+            ] })
+          ] })
+        ] }),
+        menu
+      ]
+    }
+  );
+}
+var DEFAULT_DM_ACCESS_REQUEST_BANNER_LABELS = {
+  requestedAccess: " requested workspace access",
+  review: "Review"
+};
+var DEFAULT_DM_THREAD_FRAME_LABELS = {
+  noMessages: "No messages yet \u2014 say hi \u{1F44B}"
+};
+var DEFAULT_DM_GRANT_ACCESS_DIALOG_LABELS = {
+  title: "Grant workspace access",
+  description: (peerName) => `Give ${peerName} access to one of your workspaces. Access is permanent until you remove it.`,
+  noWorkspace: "Open the workspace you want to share, as its owner, and you can grant access to it from here.",
+  workspace: "Workspace",
+  role: "Role",
+  cancel: "Cancel",
+  grantAccess: "Grant access"
+};
+var DEFAULT_RECIPIENT_PICKER_LABELS = {
+  to: "To",
+  unmuteNotifications: "Unmute notifications",
+  muteNotifications: "Mute notifications",
+  removeRecipient: "Remove recipient",
+  selectRecipient: "Select recipient...",
+  addRecipient: "Add recipient",
+  searchUsers: "Search users...",
+  noKnownUsers: "No known users",
+  noMatchingUsers: "No matching users",
+  addContactsHint: "Add contacts or join workspaces to send private messages"
+};
+function ActionMenu({ label, testId, entries, contentClassName = "w-56" }) {
+  return /* @__PURE__ */ jsxs(DropdownMenu, { children: [
+    /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
+      Button,
+      {
+        variant: "ghost",
+        size: "icon",
+        className: "size-7 shrink-0 text-muted-foreground hover:text-foreground pointer-coarse:size-11",
+        "aria-label": label,
+        "data-testid": testId,
+        onClick: (e) => e.stopPropagation(),
+        children: /* @__PURE__ */ jsx(MoreVertical, { className: "size-4" })
+      }
+    ) }),
+    /* @__PURE__ */ jsx(DropdownMenuContent, { align: "end", className: contentClassName, children: entries.map(
+      (entry) => "separator" in entry ? /* @__PURE__ */ jsx(DropdownMenuSeparator, {}, entry.id) : /* @__PURE__ */ jsxs(
+        DropdownMenuItem,
+        {
+          onClick: entry.onSelect,
+          className: entry.destructive ? "text-destructive focus:text-destructive" : void 0,
+          "data-testid": entry.testId,
+          children: [
+            entry.icon && /* @__PURE__ */ jsx("span", { className: "mr-2 inline-flex size-4 items-center", children: entry.icon }),
+            entry.label
+          ]
+        },
+        entry.id
+      )
+    ) })
+  ] });
+}
+function DmInviteAvatar() {
+  return /* @__PURE__ */ jsx("span", { className: "flex size-9 shrink-0 items-center justify-center rounded-full bg-muted text-muted-foreground", children: /* @__PURE__ */ jsx(AtSign, { className: "size-4" }) });
+}
+function DmNewTabIcon() {
+  return /* @__PURE__ */ jsx("div", { className: "flex h-5 w-5 items-center justify-center rounded-full bg-primary/10", children: /* @__PURE__ */ jsx(Plus, { className: "h-3 w-3 text-primary" }) });
+}
+function DmAccessRequestBanner({
+  name,
+  onReview,
+  labels
+}) {
+  const l = useMemo(() => ({ ...DEFAULT_DM_ACCESS_REQUEST_BANNER_LABELS, ...labels }), [labels]);
+  return /* @__PURE__ */ jsxs("div", { className: "mx-4 mt-3 flex items-center gap-3 rounded-lg bg-muted px-3 py-2.5", children: [
+    /* @__PURE__ */ jsx(KeyRound, { className: "h-4 w-4 shrink-0 text-primary" }),
+    /* @__PURE__ */ jsxs("span", { className: "min-w-0 flex-1 text-sm text-foreground", children: [
+      /* @__PURE__ */ jsx("span", { className: "font-medium", children: name }),
+      l.requestedAccess
+    ] }),
+    /* @__PURE__ */ jsx(Button, { size: "sm", onClick: onReview, "data-testid": "dm-review-access-button", children: l.review })
+  ] });
+}
+function DmThreadFrame({
+  recipientPicker,
+  accessBanner,
+  hasRecipient,
+  isLoading,
+  history,
+  isEmpty,
+  noRecipientPrompt,
+  historyRef,
+  composer,
+  labels
+}) {
+  const l = useMemo(() => ({ ...DEFAULT_DM_THREAD_FRAME_LABELS, ...labels }), [labels]);
+  return /* @__PURE__ */ jsxs("div", { className: "flex h-full flex-col bg-background", children: [
+    recipientPicker,
+    accessBanner,
+    hasRecipient && /* @__PURE__ */ jsx("div", { className: "min-h-0 flex-1 overflow-hidden bg-background", ref: historyRef, children: /* @__PURE__ */ jsx(ScrollArea, { className: "h-full", children: /* @__PURE__ */ jsx("div", { className: "px-4 py-3", children: isLoading ? /* @__PURE__ */ jsx("div", { className: "flex h-32 items-center justify-center", children: /* @__PURE__ */ jsx(Loader2, { className: "h-6 w-6 animate-spin text-muted-foreground" }) }) : !isEmpty ? history : /* @__PURE__ */ jsx("div", { className: "flex h-32 items-center justify-center text-sm text-muted-foreground", children: l.noMessages }) }) }) }),
+    !hasRecipient && noRecipientPrompt && /* @__PURE__ */ jsx("div", { className: "flex min-h-0 flex-1 items-center justify-center bg-background p-4", children: /* @__PURE__ */ jsx("p", { className: "text-center text-sm text-muted-foreground", children: noRecipientPrompt }) }),
+    /* @__PURE__ */ jsx("div", { className: "shrink-0", children: composer })
+  ] });
+}
+function DmGrantAccessDialogView({
+  open,
+  onOpenChange,
+  peerName,
+  workspaceName,
+  role,
+  onRoleChange,
+  roles,
+  isGranting,
+  onGrant,
+  labels
+}) {
+  const l = useMemo(() => ({ ...DEFAULT_DM_GRANT_ACCESS_DIALOG_LABELS, ...labels }), [labels]);
+  return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsxs(DialogContent, { presentation: "sheet", "data-testid": "dm-grant-access-modal", children: [
+    /* @__PURE__ */ jsxs(DialogHeader, { children: [
+      /* @__PURE__ */ jsx(DialogTitle, { children: l.title }),
+      /* @__PURE__ */ jsx(DialogDescription, { children: l.description(peerName) })
+    ] }),
+    workspaceName === null ? /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", "data-testid": "dm-grant-none", children: l.noWorkspace }) : /* @__PURE__ */ jsxs("div", { className: "space-y-4", children: [
+      /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+        /* @__PURE__ */ jsx("label", { className: "text-sm font-medium", children: l.workspace }),
+        /* @__PURE__ */ jsx("p", { className: "rounded-lg bg-muted px-3 py-2 text-sm", "data-testid": "dm-grant-workspace", children: workspaceName })
+      ] }),
+      /* @__PURE__ */ jsxs("div", { className: "space-y-1.5", children: [
+        /* @__PURE__ */ jsx("label", { className: "text-sm font-medium", children: l.role }),
+        /* @__PURE__ */ jsxs(Select, { value: role, onValueChange: onRoleChange, children: [
+          /* @__PURE__ */ jsx(SelectTrigger, { "data-testid": "dm-grant-role", children: /* @__PURE__ */ jsx(SelectValue, {}) }),
+          /* @__PURE__ */ jsx(SelectContent, { children: roles.map((r) => /* @__PURE__ */ jsxs(SelectItem, { value: r.value, children: [
+            r.label,
+            " \u2014 ",
+            r.hint
+          ] }, r.value)) })
+        ] })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxs(DialogFooter, { children: [
+      /* @__PURE__ */ jsx(Button, { variant: "ghost", onClick: () => onOpenChange(false), disabled: isGranting, children: l.cancel }),
+      /* @__PURE__ */ jsxs(
+        Button,
+        {
+          onClick: onGrant,
+          disabled: isGranting || workspaceName === null,
+          "data-testid": "dm-grant-submit",
+          children: [
+            isGranting && /* @__PURE__ */ jsx(Loader2, { className: "mr-2 size-4 animate-spin" }),
+            l.grantAccess
+          ]
+        }
+      )
+    ] })
+  ] }) });
+}
+function RecipientPicker({
+  selected,
+  onRemove,
+  candidates,
+  onPick,
+  canAdd,
+  isOpen,
+  onOpenChange,
+  search,
+  onSearchChange,
+  hasNoKnownUsers,
+  labels
+}) {
+  const l = useMemo(() => ({ ...DEFAULT_RECIPIENT_PICKER_LABELS, ...labels }), [labels]);
+  return /* @__PURE__ */ jsx("div", { className: "shrink-0 border-b px-6 py-4", children: /* @__PURE__ */ jsxs("div", { className: "flex items-start gap-3", children: [
+    /* @__PURE__ */ jsx(ModalSectionTitle, { className: "mb-0 shrink-0 py-1.5", children: l.to }),
+    /* @__PURE__ */ jsxs("div", { className: "flex flex-1 flex-col gap-1.5", children: [
+      selected.map((recipient) => /* @__PURE__ */ jsxs(
+        "div",
+        {
+          className: "flex items-center justify-between gap-2 rounded-md bg-muted/50 px-3 py-1.5",
+          children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+              recipient.identity,
+              /* @__PURE__ */ jsxs(Tooltip, { children: [
+                /* @__PURE__ */ jsx(
+                  TooltipTrigger,
+                  {
+                    onClick: recipient.onToggleMute,
+                    "aria-label": recipient.isMuted ? l.unmuteNotifications : l.muteNotifications,
+                    "aria-pressed": recipient.isMuted,
+                    className: `rounded p-1 transition-colors hover:bg-muted pointer-coarse:p-3 ${recipient.isMuted ? "text-muted-foreground" : "text-muted-foreground/40 hover:text-muted-foreground"}`,
+                    disabled: recipient.isMuteBusy,
+                    children: recipient.isMuted ? /* @__PURE__ */ jsx(BellOff, { size: 14, fill: "currentColor" }) : /* @__PURE__ */ jsx(Bell, { size: 14 })
+                  }
+                ),
+                /* @__PURE__ */ jsx(TooltipContent, { className: "max-w-[250px]", children: recipient.muteTooltip })
+              ] })
+            ] }),
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                onClick: () => onRemove(recipient.id),
+                className: "p-1 text-muted-foreground hover:text-destructive pointer-coarse:p-3",
+                title: l.removeRecipient,
+                "aria-label": l.removeRecipient,
+                children: /* @__PURE__ */ jsx(X, { className: "h-4 w-4" })
+              }
+            )
+          ]
+        },
+        recipient.id
+      )),
+      canAdd && /* @__PURE__ */ jsxs(Popover, { open: isOpen, onOpenChange, children: [
+        /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: selected.length === 0 ? /* @__PURE__ */ jsxs(
+          Button,
+          {
+            variant: "outline",
+            size: "sm",
+            disabled: candidates.length === 0,
+            className: "w-full justify-start text-muted-foreground",
+            children: [
+              /* @__PURE__ */ jsx(ChevronsUpDown, { className: "mr-2 h-4 w-4" }),
+              l.selectRecipient
+            ]
+          }
+        ) : /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: "ghost",
+            size: "icon",
+            disabled: candidates.length === 0,
+            className: "h-7 w-7 rounded-full",
+            title: l.addRecipient,
+            "aria-label": l.addRecipient,
+            children: /* @__PURE__ */ jsx(Plus, { className: "h-4 w-4" })
+          }
+        ) }),
+        /* @__PURE__ */ jsx(
+          PopoverContent,
+          {
+            className: "w-72 p-0",
+            align: "start",
+            onPointerDownOutside: (e) => e.preventDefault(),
+            children: /* @__PURE__ */ jsxs(Command, { shouldFilter: false, children: [
+              /* @__PURE__ */ jsx(
+                CommandInput,
+                {
+                  placeholder: l.searchUsers,
+                  value: search,
+                  onValueChange: onSearchChange
+                }
+              ),
+              /* @__PURE__ */ jsx(CommandList, { children: candidates.length === 0 ? /* @__PURE__ */ jsx(CommandEmpty, { children: hasNoKnownUsers ? l.noKnownUsers : l.noMatchingUsers }) : /* @__PURE__ */ jsx(CommandGroup, { children: candidates.map((candidate) => /* @__PURE__ */ jsx(
+                CommandItem,
+                {
+                  onSelect: () => onPick(candidate.id),
+                  className: "cursor-pointer justify-start",
+                  children: candidate.identity
+                },
+                candidate.id
+              )) }) })
+            ] })
+          }
+        )
+      ] }),
+      hasNoKnownUsers && /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: l.addContactsHint })
+    ] })
+  ] }) });
+}
+
+// src/collaboration/mail/mailFolders.ts
+var isInboxFolder = (f) => f.id === "INBOX" || /^inbox$/i.test(f.name);
+function buildMailFolderTree(folders) {
+  const root = { key: "", label: "", folder: null, children: [] };
+  const byPath = /* @__PURE__ */ new Map([["", root]]);
+  const sorted = [...folders].sort((a, b) => a.name.split("/").length - b.name.split("/").length);
+  for (const f of sorted) {
+    const parts = f.name.split("/");
+    let path = "";
+    let parent = root;
+    parts.forEach((part, i) => {
+      path = path ? `${path}/${part}` : part;
+      let node = byPath.get(path);
+      if (!node) {
+        node = { key: path, label: part, folder: null, children: [] };
+        byPath.set(path, node);
+        parent.children.push(node);
+      }
+      if (i === parts.length - 1 && !node.folder) node.folder = f;
+      parent = node;
+    });
+  }
+  const order = (nodes) => {
+    nodes.sort((a, b) => {
+      const ai = a.folder ? isInboxFolder(a.folder) : false;
+      const bi = b.folder ? isInboxFolder(b.folder) : false;
+      if (ai !== bi) return ai ? -1 : 1;
+      return a.label.localeCompare(b.label);
+    });
+    nodes.forEach((n) => order(n.children));
+  };
+  order(root.children);
+  return root.children;
+}
+function descendantFolderIds(node) {
+  return node.children.flatMap((c) => [
+    ...c.folder ? [c.folder.id] : [],
+    ...descendantFolderIds(c)
+  ]);
+}
+function toggleMailFolder(selected, node, cascade) {
+  const id = node.folder?.id;
+  if (!id) return selected;
+  if (selected.includes(id)) return selected.filter((s) => s !== id);
+  const covered = cascade ? new Set(descendantFolderIds(node)) : /* @__PURE__ */ new Set();
+  return [...selected.filter((s) => !covered.has(s)), id];
+}
+function hasSelectedDescendant(node, selected) {
+  return node.children.some(
+    (c) => c.folder && selected.includes(c.folder.id) || hasSelectedDescendant(c, selected)
+  );
+}
+var DEFAULT_MAIL_FOLDER_TREE_LABELS = {
+  collapse: "Collapse folder",
+  expand: "Expand folder",
+  recommended: "Recommended"
+};
+function MailFolderRow({
+  labels,
+  testIds,
+  node,
+  depth,
+  selected,
+  onToggle,
+  ancestorSelected,
+  cascade,
+  expandAllNonce,
+  collapseAllNonce
+}) {
+  const f = node.folder;
+  const [expanded, setExpanded] = useState(
+    () => !!f && selected.includes(f.id) || hasSelectedDescendant(node, selected) || expandAllNonce > collapseAllNonce
+  );
+  const applied = useRef({ expand: expandAllNonce, collapse: collapseAllNonce });
+  useEffect(() => {
+    if (expandAllNonce > applied.current.expand) setExpanded(true);
+    if (collapseAllNonce > applied.current.collapse) setExpanded(false);
+    applied.current = { expand: expandAllNonce, collapse: collapseAllNonce };
+  }, [expandAllNonce, collapseAllNonce]);
+  const isSelected = ancestorSelected || !!f && selected.includes(f.id);
+  return /* @__PURE__ */ jsxs("div", { children: [
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: "flex items-center gap-1.5 rounded px-1 py-1 text-sm hover:bg-muted/50 pointer-coarse:min-h-11",
+        style: { paddingLeft: depth * 18 + 4 },
+        children: [
+          node.children.length > 0 ? /* @__PURE__ */ jsx(
+            "button",
+            {
+              type: "button",
+              className: "flex size-4 shrink-0 items-center justify-center text-muted-foreground pointer-coarse:size-8",
+              onClick: () => setExpanded((e) => !e),
+              "aria-label": expanded ? labels.collapse : labels.expand,
+              "aria-expanded": expanded,
+              "data-testid": testIdOr(testIds?.toggle?.(node.key), {
+                testId: `mail-folder-toggle-${node.key}`
+              }),
+              children: expanded ? /* @__PURE__ */ jsx(ChevronDown, { className: "size-3.5" }) : /* @__PURE__ */ jsx(ChevronRight, { className: "size-3.5" })
+            }
+          ) : /* @__PURE__ */ jsx("span", { className: "size-4 shrink-0" }),
+          f ? /* @__PURE__ */ jsxs("label", { className: "flex min-w-0 flex-1 cursor-pointer items-center gap-2", children: [
+            /* @__PURE__ */ jsx(
+              Checkbox,
+              {
+                checked: isSelected,
+                disabled: ancestorSelected,
+                onCheckedChange: () => onToggle(node),
+                "data-testid": testIdOr(testIds?.checkbox?.(f.id), {
+                  testId: `mail-folder-checkbox-${f.id}`
+                })
+              }
+            ),
+            /* @__PURE__ */ jsx("span", { className: "truncate", title: f.name, children: node.label }),
+            typeof f.count === "number" && /* @__PURE__ */ jsxs("span", { className: "shrink-0 text-xs text-muted-foreground", children: [
+              "(",
+              f.count.toLocaleString(),
+              ")"
+            ] }),
+            isInboxFolder(f) && /* @__PURE__ */ jsx("span", { className: "ml-auto shrink-0 rounded bg-muted px-1.5 py-0.5 text-xs text-muted-foreground", children: labels.recommended })
+          ] }) : /* @__PURE__ */ jsx("span", { className: "truncate font-medium text-muted-foreground", children: node.label })
+        ]
+      }
+    ),
+    expanded && node.children.map((c) => /* @__PURE__ */ jsx(
+      MailFolderRow,
+      {
+        labels,
+        testIds,
+        node: c,
+        depth: depth + 1,
+        selected,
+        onToggle,
+        ancestorSelected: cascade && isSelected,
+        cascade,
+        expandAllNonce,
+        collapseAllNonce
+      },
+      c.key
+    ))
+  ] });
+}
+function MailFolderTree({
+  nodes,
+  selected,
+  onChange,
+  cascade = true,
+  expandAllNonce = 0,
+  collapseAllNonce = 0,
+  labels,
+  testIds,
+  className
+}) {
+  const l = { ...DEFAULT_MAIL_FOLDER_TREE_LABELS, ...labels };
+  return /* @__PURE__ */ jsx("div", { className: cn("space-y-0.5", className), "data-slot": "mail-folder-tree", children: nodes.map((n) => /* @__PURE__ */ jsx(
+    MailFolderRow,
+    {
+      labels: l,
+      testIds,
+      node: n,
+      depth: 0,
+      selected,
+      onToggle: (node) => onChange(toggleMailFolder(selected, node, cascade)),
+      ancestorSelected: false,
+      cascade,
+      expandAllNonce,
+      collapseAllNonce
+    },
+    n.key
+  )) });
+}
+
+export { ActionMenu, AddContactsForm, AddContactsResults, DEFAULT_ADD_CONTACTS_LABELS, DEFAULT_DM_ACCESS_REQUEST_BANNER_LABELS, DEFAULT_DM_GRANT_ACCESS_DIALOG_LABELS, DEFAULT_DM_INVITE_CHIP_LABELS, DEFAULT_DM_THREAD_FRAME_LABELS, DEFAULT_MAIL_FOLDER_TREE_LABELS, DEFAULT_RECIPIENT_PICKER_LABELS, DmAccessRequestBanner, DmGrantAccessDialogView, DmInviteAvatar, DmInviteChip, DmNewTabIcon, DmThreadFrame, DmThreadHeader, MailFolderTree, MemberBulkActions, MemberListLoading, MemberMutedText, MemberNameCell, MemberRoleCell, RecipientPicker, RoleSelect, WorkspaceDeleteButton, buildMailFolderTree, descendantFolderIds, isInboxFolder, toggleMailFolder };
+//# sourceMappingURL=chunk-TYZUCAT7.js.map
+//# sourceMappingURL=chunk-TYZUCAT7.js.map