@arbidocs/blocks 0.4.146 → 0.4.150

package/dist/chunk-SDOEHEJP.js

@@ -0,0 +1,208 @@
+"use client";
+import { CellHoverIcon } from './chunk-M4S75AEJ.js';
+import { memo, useState, useRef, useEffect, useMemo } from 'react';
+import { Check, Minus, PencilLine } from 'lucide-react';
+import { Popover, PopoverTrigger, PopoverContent, Command, CommandInput, CommandList, CommandEmpty, CommandGroup, CommandItem } from '@arbidocs/react/ui';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+
+var CHIP_ROW_H = 24;
+var CHIP_GAP = 4;
+function labelChipClampHeight(rowHeight) {
+  const rows = Math.max(1, Math.floor((rowHeight + CHIP_GAP) / (CHIP_ROW_H + CHIP_GAP)));
+  return CHIP_ROW_H * rows + CHIP_GAP * (rows - 1);
+}
+var DEFAULT_LABEL_MULTI_SELECT_LABELS = {
+  searchPlaceholder: "Search or create...",
+  noLabels: "No labels yet",
+  create: (name) => `Create \u201C${name}\u201D`,
+  editLabel: "Edit field"
+};
+var CHECK_BOX = "flex shrink-0 items-center justify-center rounded border-2";
+function LabelPickerList({
+  options,
+  appliedIds,
+  mixedIds,
+  onToggle,
+  onCreate,
+  moreCreates,
+  onEditLabels,
+  labels
+}) {
+  const l = useMemo(() => ({ ...DEFAULT_LABEL_MULTI_SELECT_LABELS, ...labels }), [labels]);
+  const [search, setSearch] = useState("");
+  const trimmed = search.trim();
+  const matchesExisting = options.some((o) => o.name.toLowerCase() === trimmed.toLowerCase());
+  const create = () => {
+    onCreate?.(trimmed);
+    setSearch("");
+  };
+  return /* @__PURE__ */ jsxs(Command, { shouldFilter: true, children: [
+    /* @__PURE__ */ jsx(
+      CommandInput,
+      {
+        placeholder: l.searchPlaceholder,
+        value: search,
+        onValueChange: setSearch,
+        onKeyDown: (e) => {
+          if (e.key === "Enter" && onCreate && trimmed && !matchesExisting) {
+            e.preventDefault();
+            create();
+          }
+        }
+      }
+    ),
+    /* @__PURE__ */ jsxs(CommandList, { children: [
+      !(trimmed && onCreate) && /* @__PURE__ */ jsx(CommandEmpty, { children: /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: l.noLabels }) }),
+      /* @__PURE__ */ jsx(CommandGroup, { children: options.map((o) => {
+        const isApplied = appliedIds.has(o.id);
+        const isMixed = mixedIds?.has(o.id);
+        return /* @__PURE__ */ jsxs(
+          CommandItem,
+          {
+            value: o.name,
+            onSelect: () => onToggle(o.id),
+            onPointerDown: (e) => e.preventDefault(),
+            className: "group/label cursor-pointer",
+            "data-testid": `label-select-${o.id}`,
+            children: [
+              /* @__PURE__ */ jsxs(
+                "span",
+                {
+                  className: `mr-2 size-4 ${CHECK_BOX} ${isApplied ? "" : "bg-background"}`,
+                  style: {
+                    borderColor: o.color,
+                    backgroundColor: isApplied ? o.color : void 0
+                  },
+                  children: [
+                    isApplied && /* @__PURE__ */ jsx(Check, { className: "size-3 text-white", strokeWidth: 3 }),
+                    isMixed && /* @__PURE__ */ jsx(Minus, { className: "size-3", style: { color: o.color } })
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsx("span", { className: "flex-1 text-sm", children: o.name }),
+              onEditLabels && /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  onClick: (e) => {
+                    e.stopPropagation();
+                    onEditLabels();
+                  },
+                  onPointerDown: (e) => e.preventDefault(),
+                  className: "shrink-0 rounded p-0.5 opacity-0 hover:bg-muted focus-visible:opacity-100 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring group-hover/label:opacity-100 group-data-[selected=true]/label:opacity-100 pointer-coarse:flex pointer-coarse:size-11 pointer-coarse:items-center pointer-coarse:justify-center pointer-coarse:opacity-100",
+                  title: l.editLabel,
+                  "aria-label": l.editLabel,
+                  children: /* @__PURE__ */ jsx(PencilLine, { className: "size-3 text-muted-foreground" })
+                }
+              )
+            ]
+          },
+          o.id
+        );
+      }) })
+    ] }),
+    trimmed && onCreate && !matchesExisting && /* @__PURE__ */ jsx("div", { className: "border-t border-border p-1", "data-slot": "label-picker-create", children: [{ label: l.create, onCreate }, ...moreCreates ?? []].map((c, i) => /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        onClick: () => {
+          c.onCreate(trimmed);
+          setSearch("");
+        },
+        onPointerDown: (e) => e.preventDefault(),
+        className: "w-full cursor-pointer rounded px-2 py-1.5 text-left text-sm text-primary hover:bg-accent pointer-coarse:min-h-11",
+        children: c.label(trimmed)
+      },
+      i
+    )) })
+  ] });
+}
+var LabelMultiSelectView = memo(function LabelMultiSelectView2({
+  options,
+  appliedIds,
+  onToggle,
+  onCreate,
+  onEditLabels,
+  rowHeight = 52,
+  labels
+}) {
+  const [open, setOpen] = useState(false);
+  const applied = options.filter((o) => appliedIds.has(o.id));
+  const maxHeight = labelChipClampHeight(rowHeight);
+  const chipsRef = useRef(null);
+  const [hasOverflow, setHasOverflow] = useState(false);
+  useEffect(() => {
+    const el = chipsRef.current;
+    if (!el) return;
+    const measure = () => setHasOverflow(el.scrollHeight > el.clientHeight + 1);
+    measure();
+    const ro = new ResizeObserver(measure);
+    ro.observe(el);
+    return () => ro.disconnect();
+  }, [appliedIds, maxHeight, options]);
+  return /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
+    /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        "data-slot": "label-multi-select",
+        className: "group relative flex h-full w-full min-w-0 cursor-pointer items-center gap-1 pr-4 text-left hover:bg-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring",
+        children: applied.length === 0 ? /* @__PURE__ */ jsx("span", { className: "flex-1", children: /* @__PURE__ */ jsx(CellHoverIcon, {}) }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(
+            "div",
+            {
+              ref: chipsRef,
+              className: "flex min-w-0 flex-1 flex-wrap content-start gap-1 overflow-hidden",
+              style: { maxHeight },
+              "data-testid": "label-multi-select-chips",
+              children: applied.map((o) => /* @__PURE__ */ jsxs(
+                "span",
+                {
+                  className: "inline-flex shrink-0 items-center gap-1 rounded border px-1.5 py-0.5 text-xs font-medium",
+                  title: o.name,
+                  style: { borderColor: o.color },
+                  children: [
+                    /* @__PURE__ */ jsx(
+                      "span",
+                      {
+                        className: "flex size-3.5 shrink-0 items-center justify-center rounded",
+                        style: { backgroundColor: o.color },
+                        children: /* @__PURE__ */ jsx(Check, { className: "size-2.5 text-white", strokeWidth: 3 })
+                      }
+                    ),
+                    /* @__PURE__ */ jsx("span", { className: "max-w-[80px] truncate", children: o.name })
+                  ]
+                },
+                o.id
+              ))
+            }
+          ),
+          hasOverflow && /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: "pointer-events-none absolute bottom-0.5 right-0.5 text-xs font-semibold leading-none text-muted-foreground",
+              "aria-hidden": true,
+              "data-testid": "label-multi-select-overflow",
+              children: "\u2026"
+            }
+          )
+        ] })
+      }
+    ) }),
+    open && /* @__PURE__ */ jsx(PopoverContent, { className: "w-[360px] p-0", align: "start", side: "bottom", sideOffset: 4, children: /* @__PURE__ */ jsx(
+      LabelPickerList,
+      {
+        options,
+        appliedIds,
+        onToggle,
+        onCreate,
+        onEditLabels,
+        labels
+      }
+    ) })
+  ] });
+});
+
+export { DEFAULT_LABEL_MULTI_SELECT_LABELS, LabelMultiSelectView, LabelPickerList, labelChipClampHeight };
+//# sourceMappingURL=chunk-SDOEHEJP.js.map
+//# sourceMappingURL=chunk-SDOEHEJP.js.map

package/dist/chunk-SDOEHEJP.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/files/cells/LabelMultiSelect.tsx"],"names":["LabelMultiSelectView"],"mappings":"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","file":"chunk-SDOEHEJP.js","sourcesContent":["import { memo, useEffect, useMemo, useRef, useState } from 'react'\nimport { Check, Minus, PencilLine } from 'lucide-react'\nimport {\n  Command,\n  CommandEmpty,\n  CommandGroup,\n  CommandInput,\n  CommandItem,\n  CommandList,\n  Popover,\n  PopoverContent,\n  PopoverTrigger,\n} from '@arbidocs/react/ui'\nimport { CellHoverIcon } from './HoverIconCell'\n\n/** Chip row metrics (px): a chip is 24px tall with a 4px gap, as in the Facts labels cell. */\nconst CHIP_ROW_H = 24\nconst CHIP_GAP = 4\n\n/** Max height of the chip container: whole chip rows that fit `rowHeight`, never half a row. */\nexport function labelChipClampHeight(rowHeight: number): number {\n  const rows = Math.max(1, Math.floor((rowHeight + CHIP_GAP) / (CHIP_ROW_H + CHIP_GAP)))\n  return CHIP_ROW_H * rows + CHIP_GAP * (rows - 1)\n}\n\n/** One label a document can carry. `color` is any CSS colour (the host derives it from the id). */\nexport interface LabelOption {\n  id: string\n  name: string\n  color: string\n}\n\n/** Every fixed string of the label picker. */\nexport interface LabelMultiSelectLabels {\n  searchPlaceholder: string\n  noLabels: string\n  create: (name: string) => string\n  editLabel: string\n}\n\nexport const DEFAULT_LABEL_MULTI_SELECT_LABELS: LabelMultiSelectLabels = {\n  searchPlaceholder: 'Search or create...',\n  noLabels: 'No labels yet',\n  create: (name) => `Create “${name}”`,\n  editLabel: 'Edit field',\n}\n\nexport interface LabelMultiSelectViewProps {\n  options: LabelOption[]\n  /** Ids of the labels applied to the row. */\n  appliedIds: ReadonlySet<string>\n  onToggle: (id: string) => void\n  /** Create a label named `name` and apply it (the host decides what a non-member may do). */\n  onCreate: (name: string) => void\n  /** Opens the label editor; omit to hide the per-option edit button. */\n  onEditLabels?: () => void\n  /** The grid row height: clamps the chips to the rows that fully fit, with an ellipsis. */\n  rowHeight?: number\n  labels?: Partial<LabelMultiSelectLabels>\n}\n\nconst CHECK_BOX = 'flex shrink-0 items-center justify-center rounded border-2'\n\nexport interface LabelPickerListProps {\n  options: LabelOption[]\n  appliedIds: ReadonlySet<string>\n  mixedIds?: ReadonlySet<string>\n  onToggle: (id: string) => void\n  /** Create a label named `name`; omit to hide \"Create ...\" (the picker only toggles). */\n  onCreate?: (name: string) => void\n  /**\n   * Further ways to create from the typed name, each its own row under \"Create ...\" (e.g. one per\n   * kind of tag). Enter still runs `onCreate`.\n   */\n  moreCreates?: { label: (name: string) => string; onCreate: (name: string) => void }[]\n  /** Opens the label editor; omit to hide the per-option edit button. */\n  onEditLabels?: () => void\n  labels?: Partial<LabelMultiSelectLabels>\n}\n\n/**\n * Searchable list of labels with check boxes: type to filter, Enter (or the \"Create ...\" row, shown\n * whenever the typed name is not a label yet, below any labels that partly match it) creates it. Used by the grid cell and the document form field.\n */\nexport function LabelPickerList({\n  options,\n  appliedIds,\n  mixedIds,\n  onToggle,\n  onCreate,\n  moreCreates,\n  onEditLabels,\n  labels,\n}: LabelPickerListProps) {\n  const l = useMemo(() => ({ ...DEFAULT_LABEL_MULTI_SELECT_LABELS, ...labels }), [labels])\n  const [search, setSearch] = useState('')\n  const trimmed = search.trim()\n  const matchesExisting = options.some((o) => o.name.toLowerCase() === trimmed.toLowerCase())\n\n  const create = () => {\n    onCreate?.(trimmed)\n    setSearch('')\n  }\n\n  return (\n    <Command shouldFilter>\n      <CommandInput\n        placeholder={l.searchPlaceholder}\n        value={search}\n        onValueChange={setSearch}\n        onKeyDown={(e) => {\n          if (e.key === 'Enter' && onCreate && trimmed && !matchesExisting) {\n            e.preventDefault()\n            create()\n          }\n        }}\n      />\n      <CommandList>\n        {/* Nothing matches and nothing to create: say so. A new name is offered below instead. */}\n        {!(trimmed && onCreate) && (\n          <CommandEmpty>\n            <span className=\"text-muted-foreground\">{l.noLabels}</span>\n          </CommandEmpty>\n        )}\n        <CommandGroup>\n          {options.map((o) => {\n            const isApplied = appliedIds.has(o.id)\n            const isMixed = mixedIds?.has(o.id)\n            return (\n              <CommandItem\n                key={o.id}\n                value={o.name}\n                onSelect={() => onToggle(o.id)}\n                onPointerDown={(e) => e.preventDefault()}\n                className=\"group/label cursor-pointer\"\n                data-testid={`label-select-${o.id}`}\n              >\n                <span\n                  className={`mr-2 size-4 ${CHECK_BOX} ${isApplied ? '' : 'bg-background'}`}\n                  style={{\n                    borderColor: o.color,\n                    backgroundColor: isApplied ? o.color : undefined,\n                  }}\n                >\n                  {isApplied && <Check className=\"size-3 text-white\" strokeWidth={3} />}\n                  {isMixed && <Minus className=\"size-3\" style={{ color: o.color }} />}\n                </span>\n                <span className=\"flex-1 text-sm\">{o.name}</span>\n                {onEditLabels && (\n                  <button\n                    type=\"button\"\n                    onClick={(e) => {\n                      e.stopPropagation()\n                      onEditLabels()\n                    }}\n                    onPointerDown={(e) => e.preventDefault()}\n                    className=\"shrink-0 rounded p-0.5 opacity-0 hover:bg-muted focus-visible:opacity-100 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring group-hover/label:opacity-100 group-data-[selected=true]/label:opacity-100 pointer-coarse:flex pointer-coarse:size-11 pointer-coarse:items-center pointer-coarse:justify-center pointer-coarse:opacity-100\"\n                    title={l.editLabel}\n                    aria-label={l.editLabel}\n                  >\n                    <PencilLine className=\"size-3 text-muted-foreground\" />\n                  </button>\n                )}\n              </CommandItem>\n            )\n          })}\n        </CommandGroup>\n      </CommandList>\n      {trimmed && onCreate && !matchesExisting && (\n        <div className=\"border-t border-border p-1\" data-slot=\"label-picker-create\">\n          {[{ label: l.create, onCreate }, ...(moreCreates ?? [])].map((c, i) => (\n            <button\n              key={i}\n              type=\"button\"\n              onClick={() => {\n                c.onCreate(trimmed)\n                setSearch('')\n              }}\n              onPointerDown={(e) => e.preventDefault()}\n              className=\"w-full cursor-pointer rounded px-2 py-1.5 text-left text-sm text-primary hover:bg-accent pointer-coarse:min-h-11\"\n            >\n              {c.label(trimmed)}\n            </button>\n          ))}\n        </div>\n      )}\n    </Command>\n  )\n}\n\n/**\n * Labels column cell: applied labels as bordered chips; click (or Enter) opens a popover to\n * toggle labels or type a new name and press Enter to create it. Empty cells show a pencil on\n * hover, keyboard focus and touch.\n */\nexport const LabelMultiSelectView = memo(function LabelMultiSelectView({\n  options,\n  appliedIds,\n  onToggle,\n  onCreate,\n  onEditLabels,\n  rowHeight = 52,\n  labels,\n}: LabelMultiSelectViewProps) {\n  const [open, setOpen] = useState(false)\n\n  const applied = options.filter((o) => appliedIds.has(o.id))\n  const maxHeight = labelChipClampHeight(rowHeight)\n  const chipsRef = useRef<HTMLDivElement>(null)\n  const [hasOverflow, setHasOverflow] = useState(false)\n  useEffect(() => {\n    const el = chipsRef.current\n    if (!el) return\n    const measure = () => setHasOverflow(el.scrollHeight > el.clientHeight + 1)\n    measure()\n    const ro = new ResizeObserver(measure)\n    ro.observe(el)\n    return () => ro.disconnect()\n  }, [appliedIds, maxHeight, options])\n\n  return (\n    <Popover open={open} onOpenChange={setOpen}>\n      <PopoverTrigger asChild>\n        <button\n          type=\"button\"\n          data-slot=\"label-multi-select\"\n          // No vertical clip/padding: at the minimum row height an `overflow-hidden` button would\n          // crop the pills. The chip container is clamped to whole chip rows instead.\n          className=\"group relative flex h-full w-full min-w-0 cursor-pointer items-center gap-1 pr-4 text-left hover:bg-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring\"\n        >\n          {applied.length === 0 ? (\n            <span className=\"flex-1\">\n              <CellHoverIcon />\n            </span>\n          ) : (\n            <>\n              <div\n                ref={chipsRef}\n                className=\"flex min-w-0 flex-1 flex-wrap content-start gap-1 overflow-hidden\"\n                style={{ maxHeight }}\n                data-testid=\"label-multi-select-chips\"\n              >\n                {applied.map((o) => (\n                  <span\n                    key={o.id}\n                    className=\"inline-flex shrink-0 items-center gap-1 rounded border px-1.5 py-0.5 text-xs font-medium\"\n                    title={o.name}\n                    style={{ borderColor: o.color }}\n                  >\n                    <span\n                      className=\"flex size-3.5 shrink-0 items-center justify-center rounded\"\n                      style={{ backgroundColor: o.color }}\n                    >\n                      <Check className=\"size-2.5 text-white\" strokeWidth={3} />\n                    </span>\n                    <span className=\"max-w-[80px] truncate\">{o.name}</span>\n                  </span>\n                ))}\n              </div>\n              {hasOverflow && (\n                <span\n                  className=\"pointer-events-none absolute bottom-0.5 right-0.5 text-xs font-semibold leading-none text-muted-foreground\"\n                  aria-hidden\n                  data-testid=\"label-multi-select-overflow\"\n                >\n                  …\n                </span>\n              )}\n            </>\n          )}\n        </button>\n      </PopoverTrigger>\n      {open && (\n        <PopoverContent className=\"w-[360px] p-0\" align=\"start\" side=\"bottom\" sideOffset={4}>\n          <LabelPickerList\n            options={options}\n            appliedIds={appliedIds}\n            onToggle={onToggle}\n            onCreate={onCreate}\n            onEditLabels={onEditLabels}\n            labels={labels}\n          />\n        </PopoverContent>\n      )}\n    </Popover>\n  )\n})\n"]}

package/dist/{chunk-DETZZBG2.cjs → chunk-SIB6C7P7.cjs}

@@ -85,7 +85,48 @@ function UploadDropzone({
     }
   );
 }
+var ICONS = { pencil: lucideReact.Pencil, plus: lucideReact.Plus, blocked: lucideReact.Ban };
+function CellHoverIcon({
+  kind = "pencil",
+  className
+}) {
+  const Icon = ICONS[kind];
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "span",
+    {
+      "data-slot": "cell-hover-icon",
+      "data-kind": kind,
+      "aria-hidden": true,
+      className: ui.cn(
+        "inline-flex shrink-0 text-muted-foreground opacity-0 transition-opacity group-hover:opacity-70 group-focus-within:opacity-70 pointer-coarse:opacity-70",
+        className
+      ),
+      children: /* @__PURE__ */ jsxRuntime.jsx(Icon, { className: "size-3.5" })
+    }
+  );
+}
+var HoverIconCell = react.memo(function HoverIconCell2({
+  content,
+  isEditable,
+  showIcon = true,
+  icon = "pencil",
+  className
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      "data-slot": "hover-icon-cell",
+      className: ui.cn("group flex h-full w-full items-center gap-2 pr-2", className),
+      children: [
+        content,
+        showIcon && /* @__PURE__ */ jsxRuntime.jsx(CellHoverIcon, { kind: isEditable ? icon : "blocked" })
+      ]
+    }
+  );
+});
 
+exports.CellHoverIcon = CellHoverIcon;
+exports.HoverIconCell = HoverIconCell;
 exports.UploadDropzone = UploadDropzone;
-//# sourceMappingURL=chunk-DETZZBG2.cjs.map
-//# sourceMappingURL=chunk-DETZZBG2.cjs.map
+//# sourceMappingURL=chunk-SIB6C7P7.cjs.map
+//# sourceMappingURL=chunk-SIB6C7P7.cjs.map

package/dist/chunk-SIB6C7P7.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/files/UploadDropzone.tsx","../src/files/cells/HoverIconCell.tsx"],"names":["UploadCloud","useRef","useState","jsxs","cn","jsx","Loader2","Pencil","Plus","Ban","memo","HoverIconCell"],"mappings":"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","file":"chunk-SIB6C7P7.cjs","sourcesContent":["import { useRef, useState } from 'react'\nimport type { DragEvent } from 'react'\nimport type { LucideIcon } from 'lucide-react'\nimport { Loader2, UploadCloud } from 'lucide-react'\nimport { cn } from '@arbidocs/react/ui'\n\nexport interface UploadDropzoneProps {\n  /** Called with the chosen/dropped files. */\n  onFiles: (files: File[]) => void\n  /** `accept` attribute for the file picker (e.g. `.pdf,.docx`). */\n  accept?: string\n  /** Allow selecting more than one file. Defaults to true. */\n  multiple?: boolean\n  /** Disables picking/dropping (e.g. no active workspace yet). */\n  disabled?: boolean\n  /** Shows a spinner + busy copy while an upload is in flight. */\n  uploading?: boolean\n  /** Primary line, e.g. \"Drag files here\". */\n  title?: string\n  /** Secondary line under the title. */\n  description?: string\n  /** Small muted hint, e.g. \"PDF, DOCX, images — up to 50MB\". */\n  hint?: string\n  /** Copy shown next to the spinner while uploading. */\n  uploadingLabel?: string\n  /** Glyph in the tile. Defaults to an upload-cloud icon. */\n  icon?: LucideIcon\n  testId?: string\n  className?: string\n}\n\n/**\n * A themeable drag-and-drop upload target. Source-agnostic: it just surfaces\n * chosen files via `onFiles` — the host owns the actual upload. Handles its own\n * drag-over state, click-to-browse, and a busy state, styled with the kit's\n * SEMANTIC tokens only (border, muted, primary, foreground) so it renders in\n * each host's colours.\n */\nexport function UploadDropzone({\n  onFiles,\n  accept,\n  multiple = true,\n  disabled = false,\n  uploading = false,\n  title = 'Drag files here',\n  description = 'or click to browse',\n  hint,\n  uploadingLabel = 'Uploading…',\n  icon: Icon = UploadCloud,\n  testId,\n  className,\n}: UploadDropzoneProps) {\n  const inputRef = useRef<HTMLInputElement>(null)\n  const [dragOver, setDragOver] = useState(false)\n  const inert = disabled || uploading\n\n  const pick = (files: FileList | null) => {\n    if (!files?.length) return\n    onFiles(Array.from(files))\n  }\n\n  const onDrop = (e: DragEvent<HTMLButtonElement>) => {\n    e.preventDefault()\n    setDragOver(false)\n    if (inert) return\n    pick(e.dataTransfer.files)\n  }\n\n  const onDragOver = (e: DragEvent<HTMLButtonElement>) => {\n    e.preventDefault()\n    if (!inert) setDragOver(true)\n  }\n\n  return (\n    <button\n      type=\"button\"\n      onClick={() => !inert && inputRef.current?.click()}\n      onDrop={onDrop}\n      onDragOver={onDragOver}\n      onDragLeave={() => setDragOver(false)}\n      disabled={inert}\n      data-testid={testId}\n      className={cn(\n        'flex w-full flex-col items-center justify-center gap-3 rounded-lg bg-muted px-6 py-12 text-center transition-colors',\n        'hover:bg-accent/60',\n        'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',\n        dragOver && 'bg-accent ring-2 ring-primary',\n        inert && 'cursor-not-allowed opacity-60 hover:bg-muted',\n        className\n      )}\n    >\n      <input\n        ref={inputRef}\n        type=\"file\"\n        accept={accept}\n        multiple={multiple}\n        className=\"hidden\"\n        onChange={(e) => {\n          pick(e.target.files)\n          if (inputRef.current) inputRef.current.value = ''\n        }}\n        data-testid={testId ? `${testId}-input` : undefined}\n      />\n      <div className=\"flex size-12 items-center justify-center rounded-full bg-primary/10 text-primary\">\n        {uploading ? <Loader2 className=\"size-6 animate-spin\" /> : <Icon className=\"size-6\" />}\n      </div>\n      {uploading ? (\n        <p className=\"text-sm font-medium text-foreground\">{uploadingLabel}</p>\n      ) : (\n        <div className=\"space-y-1\">\n          <p className=\"text-sm font-medium text-foreground\">\n            {title} <span className=\"text-muted-foreground\">{description}</span>\n          </p>\n          {hint && <p className=\"text-xs text-muted-foreground\">{hint}</p>}\n        </div>\n      )}\n    </button>\n  )\n}\n","import { memo, type ReactNode } from 'react'\nimport { Ban, Pencil, Plus } from 'lucide-react'\nimport { cn } from '@arbidocs/react/ui'\n\nexport type CellHoverIconKind = 'pencil' | 'plus' | 'blocked'\n\nconst ICONS = { pencil: Pencil, plus: Plus, blocked: Ban } as const\n\n/**\n * Edit hint of a grid cell. It appears on pointer hover, on keyboard focus anywhere inside the\n * cell and always on touch devices (coarse pointer), where there is no hover to reveal it.\n * Place it inside an element carrying the `group` class.\n */\nexport function CellHoverIcon({\n  kind = 'pencil',\n  className,\n}: {\n  kind?: CellHoverIconKind\n  className?: string\n}) {\n  const Icon = ICONS[kind]\n  return (\n    <span\n      data-slot=\"cell-hover-icon\"\n      data-kind={kind}\n      aria-hidden\n      className={cn(\n        'inline-flex shrink-0 text-muted-foreground opacity-0 transition-opacity group-hover:opacity-70 group-focus-within:opacity-70 pointer-coarse:opacity-70',\n        className\n      )}\n    >\n      <Icon className=\"size-3.5\" />\n    </span>\n  )\n}\n\nexport interface HoverIconCellProps {\n  content: ReactNode\n  /** Non-members get a \"blocked\" hint instead of the edit hint. */\n  isEditable: boolean\n  showIcon?: boolean\n  icon?: Exclude<CellHoverIconKind, 'blocked'>\n  className?: string\n}\n\n/** A cell's content with the edit hint after it (pure CSS reveal: no re-render on mouse move). */\nexport const HoverIconCell = memo(function HoverIconCell({\n  content,\n  isEditable,\n  showIcon = true,\n  icon = 'pencil',\n  className,\n}: HoverIconCellProps) {\n  return (\n    <div\n      data-slot=\"hover-icon-cell\"\n      className={cn('group flex h-full w-full items-center gap-2 pr-2', className)}\n    >\n      {content}\n      {showIcon && <CellHoverIcon kind={isEditable ? icon : 'blocked'} />}\n    </div>\n  )\n})\n"]}

package/dist/{chunk-OPTBQSCV.cjs → chunk-SMN32BQ3.cjs}

@@ -2,7 +2,6 @@
 'use strict';
 
 var chunk7G2LJMUG_cjs = require('./chunk-7G2LJMUG.cjs');
-var chunkMHVNT4J3_cjs = require('./chunk-MHVNT4J3.cjs');
 var chunkULWRNGGE_cjs = require('./chunk-ULWRNGGE.cjs');
 var lucideReact = require('lucide-react');
 var ui = require('@arbidocs/react/ui');
@@ -750,7 +749,7 @@ function RecipientPicker({
           {
             variant: "outline",
             size: "sm",
-            disabled: candidates.length === 0,
+            disabled: hasNoKnownUsers,
             className: "w-full justify-start text-muted-foreground",
             children: [
               /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronsUpDown, { className: "mr-2 h-4 w-4" }),
@@ -762,7 +761,7 @@ function RecipientPicker({
           {
             variant: "ghost",
             size: "icon",
-            disabled: candidates.length === 0,
+            disabled: hasNoKnownUsers,
             className: "h-7 w-7 rounded-full",
             title: l.addRecipient,
             "aria-label": l.addRecipient,
@@ -802,178 +801,6 @@ function RecipientPicker({
   ] }) });
 }
 
-// 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] = react.useState(
-    () => !!f && selected.includes(f.id) || hasSelectedDescendant(node, selected) || expandAllNonce > collapseAllNonce
-  );
-  const applied = react.useRef({ expand: expandAllNonce, collapse: collapseAllNonce });
-  react.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__ */ jsxRuntime.jsxs("div", { children: [
-    /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.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": chunkMHVNT4J3_cjs.testIdOr(testIds?.toggle?.(node.key), {
-                testId: `mail-folder-toggle-${node.key}`
-              }),
-              children: expanded ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "size-3.5" }) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRight, { className: "size-3.5" })
-            }
-          ) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "size-4 shrink-0" }),
-          f ? /* @__PURE__ */ jsxRuntime.jsxs("label", { className: "flex min-w-0 flex-1 cursor-pointer items-center gap-2", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(
-              ui.Checkbox,
-              {
-                checked: isSelected,
-                disabled: ancestorSelected,
-                onCheckedChange: () => onToggle(node),
-                "data-testid": chunkMHVNT4J3_cjs.testIdOr(testIds?.checkbox?.(f.id), {
-                  testId: `mail-folder-checkbox-${f.id}`
-                })
-              }
-            ),
-            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", title: f.name, children: node.label }),
-            typeof f.count === "number" && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "shrink-0 text-xs text-muted-foreground", children: [
-              "(",
-              f.count.toLocaleString(),
-              ")"
-            ] }),
-            isInboxFolder(f) && /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsx("span", { className: "truncate font-medium text-muted-foreground", children: node.label })
-        ]
-      }
-    ),
-    expanded && node.children.map((c) => /* @__PURE__ */ jsxRuntime.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__ */ jsxRuntime.jsx("div", { className: ui.cn("space-y-0.5", className), "data-slot": "mail-folder-tree", children: nodes.map((n) => /* @__PURE__ */ jsxRuntime.jsx(
-    MailFolderRow,
-    {
-      labels: l,
-      testIds,
-      node: n,
-      depth: 0,
-      selected,
-      onToggle: (node) => onChange(toggleMailFolder(selected, node, cascade)),
-      ancestorSelected: false,
-      cascade,
-      expandAllNonce,
-      collapseAllNonce
-    },
-    n.key
-  )) });
-}
-
 exports.ActionMenu = ActionMenu;
 exports.AddContactsForm = AddContactsForm;
 exports.AddContactsResults = AddContactsResults;
@@ -985,7 +812,6 @@ exports.DEFAULT_DM_ACCESS_REQUEST_BANNER_LABELS = DEFAULT_DM_ACCESS_REQUEST_BANN
 exports.DEFAULT_DM_GRANT_ACCESS_DIALOG_LABELS = DEFAULT_DM_GRANT_ACCESS_DIALOG_LABELS;
 exports.DEFAULT_DM_INVITE_CHIP_LABELS = DEFAULT_DM_INVITE_CHIP_LABELS;
 exports.DEFAULT_DM_THREAD_FRAME_LABELS = DEFAULT_DM_THREAD_FRAME_LABELS;
-exports.DEFAULT_MAIL_FOLDER_TREE_LABELS = DEFAULT_MAIL_FOLDER_TREE_LABELS;
 exports.DEFAULT_RECIPIENT_PICKER_LABELS = DEFAULT_RECIPIENT_PICKER_LABELS;
 exports.DmAccessRequestBanner = DmAccessRequestBanner;
 exports.DmGrantAccessDialogView = DmGrantAccessDialogView;
@@ -995,7 +821,6 @@ exports.DmNewTabIcon = DmNewTabIcon;
 exports.DmThreadFrame = DmThreadFrame;
 exports.DmThreadHeader = DmThreadHeader;
 exports.MAX_INVITE_EMAILS = MAX_INVITE_EMAILS;
-exports.MailFolderTree = MailFolderTree;
 exports.MemberBulkActions = MemberBulkActions;
 exports.MemberListLoading = MemberListLoading;
 exports.MemberMutedText = MemberMutedText;
@@ -1004,15 +829,11 @@ exports.MemberRoleCell = MemberRoleCell;
 exports.RecipientPicker = RecipientPicker;
 exports.RoleSelect = RoleSelect;
 exports.WorkspaceDeleteButton = WorkspaceDeleteButton;
-exports.buildMailFolderTree = buildMailFolderTree;
 exports.contactToVCard = contactToVCard;
-exports.descendantFolderIds = descendantFolderIds;
 exports.downloadVCard = downloadVCard;
-exports.isInboxFolder = isInboxFolder;
 exports.parseEmails = parseEmails;
 exports.toAddContactsRow = toAddContactsRow;
 exports.toAddContactsRows = toAddContactsRows;
-exports.toggleMailFolder = toggleMailFolder;
 exports.vCardFilename = vCardFilename;
-//# sourceMappingURL=chunk-OPTBQSCV.cjs.map
-//# sourceMappingURL=chunk-OPTBQSCV.cjs.map
+//# sourceMappingURL=chunk-SMN32BQ3.cjs.map
+//# sourceMappingURL=chunk-SMN32BQ3.cjs.map