@arbidocs/blocks 0.5.36 → 0.5.38

package/dist/databases/index.js

@@ -1,2134 +1,9 @@
 "use client";
-import { DetailPanel, DetailSection, DetailFields, DetailField, DetailLinkList, DetailLinkItem, DetailEmpty } from '../chunk-ZCOVDK2E.js';
-import { GridView } from '../chunk-7F5Z4K5W.js';
+export { ADD_COLUMN_COL_ID, COLUMN_TYPE_ICONS, COMPUTED_COLUMN_TYPES, DATABASE_COLUMN_TYPES, DATABASE_ROLLUP_OPS, DEFAULT_COLUMN_CONFIG_LABELS, DEFAULT_DATABASE_COLUMN_DIALOG_LABELS, DEFAULT_DATABASE_COLUMN_LABELS, DEFAULT_DATABASE_COLUMN_TYPE_LABELS, DEFAULT_DATABASE_LIST_LABELS, DEFAULT_DATABASE_ROW_DETAIL_LABELS, DEFAULT_DATABASE_TABLE_LABELS, DEFAULT_DATABASE_TOOLBAR_LABELS, DEFAULT_NEW_DATABASE_DIALOG_LABELS, DEFAULT_PICK_CELL_EDITOR_LABELS, DatabaseColumnDialog, DatabaseList, DatabaseRowDetail, DatabaseTable, DatabaseToolbar, LINK_COLUMN_TYPES, LinkChip, LinkChipsCell, LookupCell, NewDatabaseDialog, OPEN_ROW_COL_ID, PersonCell, PersonChip, PickCellEditor, SelectCellEditor, SelectChip, canEditColumn, cellIds, cellList, columnWidth, compareCells, createDatabaseColumns, formatCell, formatDateValue, formatLookupValue, formatNumberValue, isComputedColumn, optionTone, rowTitle, sameCellValue, titleOf, toApiValue } from '../chunk-PTYERKEU.js';
+import '../chunk-ZCOVDK2E.js';
+import '../chunk-7F5Z4K5W.js';
 import '../chunk-SLSBJRWW.js';
-import { testIdOr } from '../chunk-7F6CBP3Z.js';
+import '../chunk-7F6CBP3Z.js';
 import '../chunk-VUNV25KB.js';
-import { Sigma, Search, ArrowUpRight, FileText, UserRound, ChevronDown, CheckSquare, CalendarDays, Hash, Type, X, Loader2, Check, Maximize2, Plus, Trash2, Rows3, ArrowLeft, FileSpreadsheet, Eye, MoreHorizontal, Upload, Download, Table2, Lock } from 'lucide-react';
-import { cn, Button, Input, DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription, Label, Select, SelectTrigger, SelectValue, SelectContent, SelectItem, DialogFooter, Textarea, Checkbox, Switch, Popover, PopoverTrigger, PopoverContent } from '@arbidocs/react/ui';
-import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
-import { useState, useRef, useEffect, useMemo } from 'react';
-
-// src/databases/column-types.ts
-var DATABASE_COLUMN_TYPES = [
-  "text",
-  "number",
-  "date",
-  "checkbox",
-  "select",
-  "person",
-  "document",
-  "relation",
-  "lookup",
-  "rollup"
-];
-var COMPUTED_COLUMN_TYPES = /* @__PURE__ */ new Set([
-  "lookup",
-  "rollup"
-]);
-var LINK_COLUMN_TYPES = /* @__PURE__ */ new Set([
-  "document",
-  "relation"
-]);
-var isComputedColumn = (column) => COMPUTED_COLUMN_TYPES.has(column.type);
-var DATABASE_ROLLUP_OPS = ["count", "sum", "avg", "min", "max"];
-var DEFAULT_DATABASE_COLUMN_TYPE_LABELS = {
-  text: "Text",
-  number: "Number",
-  date: "Date",
-  checkbox: "Checkbox",
-  select: "Select",
-  person: "Person",
-  document: "Documents",
-  relation: "Relation",
-  lookup: "Lookup",
-  rollup: "Rollup"
-};
-var OPTION_TONES = [
-  "bg-blue-bg text-blue-text",
-  "bg-green-bg text-green-text",
-  "bg-yellow-bg text-yellow-text",
-  "bg-purple-bg text-purple-text",
-  "bg-red-bg text-red-text",
-  "bg-gray-bg text-gray-text"
-];
-function optionTone(option) {
-  let hash = 0;
-  for (const ch of option.toLowerCase()) hash = hash * 31 + ch.charCodeAt(0) >>> 0;
-  return OPTION_TONES[hash % OPTION_TONES.length];
-}
-var isEmpty = (value) => value === null || value === void 0 || typeof value === "string" && value.trim() === "" || Array.isArray(value) && value.length === 0;
-function cellList(value) {
-  if (isEmpty(value)) return [];
-  return Array.isArray(value) ? value.filter((v) => !isEmpty(v)) : [value];
-}
-function cellIds(value) {
-  return cellList(value).filter((v) => typeof v === "string");
-}
-function titleOf(id, titles) {
-  return titles?.[id] ?? id;
-}
-function sameCellValue(a, b) {
-  if (Array.isArray(a) || Array.isArray(b)) {
-    const la = cellList(a);
-    const lb = cellList(b);
-    return la.length === lb.length && la.every((v, i) => v === lb[i]);
-  }
-  return (a ?? null) === (b ?? null);
-}
-function formatDateValue(value, locale) {
-  const day = /^(\d{4})-(\d{2})-(\d{2})$/.exec(value);
-  if (day) {
-    const [, y, m, d] = day;
-    return new Date(Date.UTC(+y, +m - 1, +d)).toLocaleDateString(locale, { timeZone: "UTC" });
-  }
-  const at = new Date(value);
-  return Number.isNaN(at.getTime()) ? value : at.toLocaleString(locale);
-}
-function formatNumberValue(value, locale) {
-  return value.toLocaleString(locale, { maximumFractionDigits: 6 });
-}
-var ISO_DATE = /^\d{4}-\d{2}-\d{2}(T\d{2}:\d{2}(:\d{2}(\.\d+)?)?(Z|[+-]\d{2}:?\d{2})?)?$/;
-function formatLookupValue(value, titles, locale) {
-  if (isEmpty(value)) return "";
-  if (typeof value === "number") return formatNumberValue(value, locale);
-  if (typeof value === "boolean") return value ? "Yes" : "No";
-  if (typeof value === "string") {
-    if (titles?.[value] !== void 0) return titles[value];
-    if (ISO_DATE.test(value)) return formatDateValue(value, locale);
-  }
-  return String(value);
-}
-var NAMED_TYPES = /* @__PURE__ */ new Set([
-  "person",
-  "document",
-  "relation"
-]);
-function formatCell(value, type, locale, titles) {
-  if (isEmpty(value)) return "";
-  if ((type === "number" || type === "rollup") && typeof value === "number")
-    return formatNumberValue(value, locale);
-  if (type === "date" && typeof value === "string") return formatDateValue(value, locale);
-  if (type === "checkbox") return value ? "Yes" : "No";
-  if (NAMED_TYPES.has(type))
-    return cellIds(value).map((id) => titleOf(id, titles)).join(", ");
-  if (type === "lookup")
-    return cellList(value).map((v) => formatLookupValue(v, titles, locale)).join(", ");
-  return String(value);
-}
-function toApiValue(value, type) {
-  if (isEmpty(value)) return null;
-  if (LINK_COLUMN_TYPES.has(type)) return cellIds(value);
-  if (type === "checkbox") return Boolean(value);
-  if (type === "date" && value instanceof Date) {
-    const pad = (n) => String(n).padStart(2, "0");
-    return `${value.getFullYear()}-${pad(value.getMonth() + 1)}-${pad(value.getDate())}`;
-  }
-  if (type === "number" && typeof value === "string") {
-    const n = Number(value.replace(/,/g, ""));
-    return Number.isFinite(n) ? n : value;
-  }
-  return value;
-}
-function compareCells(a, b, type, titlesA, titlesB) {
-  const ea = isEmpty(a);
-  const eb = isEmpty(b);
-  if (ea || eb) return ea === eb ? 0 : ea ? 1 : -1;
-  if (type === "number" || type === "checkbox" || type === "rollup") return Number(a) - Number(b);
-  const shown = NAMED_TYPES.has(type) || type === "lookup";
-  const ta = shown ? formatCell(a, type, void 0, titlesA) : String(a);
-  const tb = shown ? formatCell(b, type, void 0, titlesB) : String(b);
-  return ta.localeCompare(tb, void 0, { sensitivity: "base", numeric: true });
-}
-function rowTitle(row, columns, locale) {
-  const first = columns[0];
-  return first ? formatCell(row.values[first.id], first.type, locale, row.titles) : "";
-}
-var CHIP = "inline-flex h-[22px] min-w-0 max-w-[14rem] shrink-0 items-center gap-1 rounded-md border border-border bg-muted/50 px-1.5 text-xs text-foreground";
-function initials(name) {
-  const parts = name.trim().split(/\s+/).filter(Boolean);
-  const letters = parts.length > 1 ? parts[0][0] + parts[parts.length - 1][0] : name.slice(0, 2);
-  return letters.toUpperCase();
-}
-function PersonChip({ name }) {
-  return /* @__PURE__ */ jsxs("span", { className: "inline-flex min-w-0 items-center gap-1.5 text-sm", children: [
-    /* @__PURE__ */ jsx(
-      "span",
-      {
-        "aria-hidden": true,
-        className: "flex size-5 shrink-0 items-center justify-center rounded-full bg-muted text-[10px] font-medium text-muted-foreground",
-        children: initials(name)
-      }
-    ),
-    /* @__PURE__ */ jsx("span", { className: "truncate", children: name })
-  ] });
-}
-function LinkChip({
-  label,
-  kind,
-  onOpen,
-  testId
-}) {
-  const Icon = kind === "document" ? FileText : ArrowUpRight;
-  const body = /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(Icon, { className: "size-3 shrink-0 text-muted-foreground", "aria-hidden": true }),
-    /* @__PURE__ */ jsx("span", { className: "truncate", children: label })
-  ] });
-  if (!onOpen) {
-    return /* @__PURE__ */ jsx("span", { className: CHIP, title: label, "data-testid": testId, children: body });
-  }
-  const stop = (e) => e.stopPropagation();
-  return /* @__PURE__ */ jsx(
-    "button",
-    {
-      type: "button",
-      title: label,
-      "data-testid": testId,
-      onClick: (e) => {
-        e.stopPropagation();
-        onOpen();
-      },
-      onDoubleClick: stop,
-      onMouseDown: stop,
-      className: cn(CHIP, "hover:bg-muted hover:underline"),
-      children: body
-    }
-  );
-}
-function ChipRow({ children, wrap }) {
-  return /* @__PURE__ */ jsx(
-    "span",
-    {
-      className: cn(
-        "flex min-w-0 items-center gap-1",
-        wrap ? "flex-wrap py-0.5" : "h-full overflow-hidden"
-      ),
-      children
-    }
-  );
-}
-function PersonCell({ value, titles }) {
-  const [id] = cellIds(value);
-  return id ? /* @__PURE__ */ jsx(PersonChip, { name: titleOf(id, titles) }) : null;
-}
-function LinkChipsCell({
-  value,
-  titles,
-  kind,
-  onOpenDocument,
-  wrap
-}) {
-  const ids = cellIds(value);
-  if (ids.length === 0) return null;
-  return /* @__PURE__ */ jsx(ChipRow, { wrap, children: ids.map((id) => /* @__PURE__ */ jsx(
-    LinkChip,
-    {
-      label: titleOf(id, titles),
-      kind,
-      testId: `database-chip-${id}`,
-      onOpen: kind === "document" && onOpenDocument ? () => onOpenDocument(id) : void 0
-    },
-    id
-  )) });
-}
-function LookupCell({
-  value,
-  titles,
-  locale,
-  wrap
-}) {
-  const values = cellList(value);
-  if (values.length === 0) return null;
-  return /* @__PURE__ */ jsx(ChipRow, { wrap, children: values.map((v, i) => {
-    const text = formatLookupValue(v, titles, locale);
-    const key = `${i}-${text}`;
-    if (typeof v === "string" && /^doc-/.test(v))
-      return /* @__PURE__ */ jsx(LinkChip, { label: text, kind: "document" }, key);
-    if (typeof v === "string" && /^dbr-/.test(v))
-      return /* @__PURE__ */ jsx(LinkChip, { label: text, kind: "relation" }, key);
-    return /* @__PURE__ */ jsx(
-      "span",
-      {
-        title: text,
-        className: "inline-flex h-[22px] min-w-0 max-w-[14rem] shrink-0 items-center truncate rounded-md bg-muted/60 px-1.5 text-xs text-foreground",
-        children: text
-      },
-      key
-    );
-  }) });
-}
-var MAX_SHOWN = 50;
-var SEARCH_DEBOUNCE_MS = 200;
-var DEFAULT_PICK_CELL_EDITOR_LABELS = {
-  searchPlaceholder: "Search\u2026",
-  noMatches: "No matches",
-  searching: "Searching\u2026",
-  clear: "Clear",
-  done: "Done",
-  remove: (label) => `Remove ${label}`
-};
-function useChoices(query, options, search) {
-  const [found, setFound] = useState([]);
-  const [loading, setLoading] = useState(Boolean(search));
-  useEffect(() => {
-    if (!search) return;
-    let live = true;
-    setLoading(true);
-    const t = setTimeout(
-      () => {
-        search(query.trim()).then((rows) => live && setFound(rows)).catch(() => live && setFound([])).finally(() => live && setLoading(false));
-      },
-      query ? SEARCH_DEBOUNCE_MS : 0
-    );
-    return () => {
-      live = false;
-      clearTimeout(t);
-    };
-  }, [query, search]);
-  const filtered = useMemo(() => {
-    if (search) return found.slice(0, MAX_SHOWN);
-    const q = query.trim().toLowerCase();
-    const all = options ?? [];
-    const hits = q ? all.filter(
-      (o) => o.label.toLowerCase().includes(q) || (o.description ?? "").toLowerCase().includes(q)
-    ) : all;
-    return hits.slice(0, MAX_SHOWN);
-  }, [found, options, query, search]);
-  return { choices: filtered, loading: Boolean(search) && loading };
-}
-function PickCellEditor(props) {
-  const { value, onValueChange, stopEditing, data, kind, options, search } = props;
-  const l = { ...DEFAULT_PICK_CELL_EDITOR_LABELS, ...props.labels };
-  const multiple = kind !== "person";
-  const [chosen, setChosen] = useState(() => cellIds(value));
-  const [query, setQuery] = useState("");
-  const [active, setActive] = useState(0);
-  const input = useRef(null);
-  const { choices, loading } = useChoices(query, options, search);
-  const names = useRef({ ...data?.titles ?? {} });
-  for (const o of options ?? []) names.current[o.id] ??= o.label;
-  for (const o of choices) names.current[o.id] = o.label;
-  const nameOf = (id) => names.current[id] ?? id;
-  useEffect(() => input.current?.focus(), []);
-  useEffect(() => setActive(0), [query]);
-  const commit = (ids) => {
-    setChosen(ids);
-    if (data) {
-      const titles = { ...data.titles ?? {} };
-      for (const id of ids) titles[id] ??= nameOf(id);
-      data.titles = titles;
-    }
-    onValueChange(multiple ? ids : ids[0] ?? null);
-  };
-  const close = () => setTimeout(() => stopEditing(), 0);
-  const toggle = (id) => {
-    if (!multiple) {
-      commit([id]);
-      close();
-      return;
-    }
-    commit(chosen.includes(id) ? chosen.filter((x) => x !== id) : [...chosen, id]);
-  };
-  const onKeyDown = (e) => {
-    if (e.key === "ArrowDown" || e.key === "ArrowUp") {
-      e.preventDefault();
-      e.stopPropagation();
-      if (choices.length === 0) return;
-      const step = e.key === "ArrowDown" ? 1 : -1;
-      setActive((i) => (i + step + choices.length) % choices.length);
-    } else if (e.key === "Enter") {
-      e.preventDefault();
-      e.stopPropagation();
-      const pick = choices[active];
-      if (pick) toggle(pick.id);
-      else if (multiple) close();
-    } else if (e.key === "Backspace" && multiple && !query && chosen.length > 0) {
-      commit(chosen.slice(0, -1));
-    } else if (e.key === "ArrowLeft" || e.key === "ArrowRight" || e.key === "Home" || e.key === "End") {
-      e.stopPropagation();
-    }
-  };
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      "data-testid": "database-pick-editor",
-      className: "flex w-72 flex-col rounded-md border border-border bg-popover shadow-md",
-      children: [
-        multiple && chosen.length > 0 && /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-1 border-b border-border p-1.5", children: chosen.map((id) => /* @__PURE__ */ jsxs("span", { className: "inline-flex min-w-0 items-center", children: [
-          /* @__PURE__ */ jsx(LinkChip, { label: nameOf(id), kind: kind === "document" ? "document" : "relation" }),
-          /* @__PURE__ */ jsx(
-            "button",
-            {
-              type: "button",
-              "aria-label": l.remove(nameOf(id)),
-              onClick: () => commit(chosen.filter((x) => x !== id)),
-              "data-testid": `database-pick-remove-${id}`,
-              className: "rounded p-0.5 text-muted-foreground hover:bg-muted hover:text-foreground",
-              children: /* @__PURE__ */ jsx(X, { className: "size-3" })
-            }
-          )
-        ] }, id)) }),
-        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 border-b border-border px-2", children: [
-          /* @__PURE__ */ jsx(Search, { className: "size-3.5 shrink-0 text-muted-foreground", "aria-hidden": true }),
-          /* @__PURE__ */ jsx(
-            "input",
-            {
-              ref: input,
-              value: query,
-              placeholder: l.searchPlaceholder,
-              onChange: (e) => setQuery(e.target.value),
-              onKeyDown,
-              "data-testid": "database-pick-search",
-              className: "h-8 min-w-0 flex-1 bg-transparent text-sm outline-none placeholder:text-muted-foreground"
-            }
-          ),
-          loading && /* @__PURE__ */ jsx(Loader2, { className: "size-3.5 animate-spin text-muted-foreground" })
-        ] }),
-        /* @__PURE__ */ jsxs("div", { role: "listbox", "aria-multiselectable": multiple, className: "max-h-64 overflow-y-auto p-1", children: [
-          choices.map((o, i) => {
-            const isChosen = chosen.includes(o.id);
-            return /* @__PURE__ */ jsxs(
-              "button",
-              {
-                type: "button",
-                role: "option",
-                "aria-selected": isChosen,
-                onMouseEnter: () => setActive(i),
-                onClick: () => toggle(o.id),
-                "data-testid": `database-pick-option-${o.id}`,
-                className: cn(
-                  "flex w-full items-center gap-2 rounded px-2 py-1 text-left text-sm",
-                  i === active && "bg-muted"
-                ),
-                children: [
-                  /* @__PURE__ */ jsxs("span", { className: "flex min-w-0 flex-1 flex-col", children: [
-                    kind === "person" ? /* @__PURE__ */ jsx(PersonChip, { name: o.label }) : /* @__PURE__ */ jsx("span", { className: "truncate", children: o.label }),
-                    o.description && /* @__PURE__ */ jsx("span", { className: "truncate text-xs text-muted-foreground", children: o.description })
-                  ] }),
-                  isChosen && /* @__PURE__ */ jsx(Check, { className: "size-3.5 shrink-0" })
-                ]
-              },
-              o.id
-            );
-          }),
-          choices.length === 0 && /* @__PURE__ */ jsx("p", { className: "px-2 py-1.5 text-sm text-muted-foreground", children: loading ? l.searching : l.noMatches })
-        ] }),
-        (multiple || chosen.length > 0) && /* @__PURE__ */ jsx("div", { className: "flex justify-end border-t border-border p-1", children: !multiple ? /* @__PURE__ */ jsx(
-          "button",
-          {
-            type: "button",
-            onClick: () => {
-              commit([]);
-              close();
-            },
-            "data-testid": "database-pick-clear",
-            className: "rounded px-2 py-1 text-sm text-muted-foreground hover:bg-muted",
-            children: l.clear
-          }
-        ) : /* @__PURE__ */ jsx(
-          "button",
-          {
-            type: "button",
-            onClick: close,
-            "data-testid": "database-pick-done",
-            className: "rounded px-2 py-1 text-sm font-medium hover:bg-muted",
-            children: l.done
-          }
-        ) })
-      ]
-    }
-  );
-}
-function SelectChip({ value }) {
-  return /* @__PURE__ */ jsx(
-    "span",
-    {
-      className: cn(
-        "inline-flex max-w-full items-center truncate rounded-md px-2 py-0.5 text-xs font-medium",
-        optionTone(value)
-      ),
-      children: value
-    }
-  );
-}
-function SelectCellEditor(props) {
-  const { value, onValueChange, stopEditing, options, clearLabel = "Clear" } = props;
-  const items = [...options, null];
-  const [active, setActive] = useState(() => Math.max(0, options.indexOf(String(value ?? ""))));
-  const list = useRef(null);
-  useEffect(() => list.current?.focus(), []);
-  const pick = (option) => {
-    onValueChange(option);
-    setTimeout(() => stopEditing(), 0);
-  };
-  const onKeyDown = (e) => {
-    if (e.key === "ArrowDown" || e.key === "ArrowUp") {
-      e.preventDefault();
-      e.stopPropagation();
-      const step = e.key === "ArrowDown" ? 1 : -1;
-      setActive((i) => (i + step + items.length) % items.length);
-    } else if (e.key === "Enter") {
-      e.preventDefault();
-      e.stopPropagation();
-      pick(items[active]);
-    }
-  };
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      ref: list,
-      role: "listbox",
-      tabIndex: -1,
-      onKeyDown,
-      "data-testid": "database-select-editor",
-      className: "flex min-w-44 flex-col gap-0.5 rounded-md border border-border bg-popover p-1 shadow-md outline-none",
-      children: items.map((option, i) => /* @__PURE__ */ jsxs(
-        "button",
-        {
-          type: "button",
-          role: "option",
-          "aria-selected": option === value,
-          onMouseEnter: () => setActive(i),
-          onClick: () => pick(option),
-          "data-testid": option === null ? "database-select-clear" : `database-select-option-${option}`,
-          className: cn(
-            "flex items-center gap-2 rounded px-2 py-1 text-left text-sm",
-            i === active && "bg-muted"
-          ),
-          children: [
-            option === null ? /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: clearLabel }) : /* @__PURE__ */ jsx(SelectChip, { value: option }),
-            option !== null && option === value && /* @__PURE__ */ jsx(Check, { className: "ml-auto size-3.5" })
-          ]
-        },
-        option ?? "__clear"
-      ))
-    }
-  );
-}
-var DEFAULT_DATABASE_COLUMN_LABELS = {
-  addColumn: "Add a column",
-  columnSettings: (name) => `${name} column settings`,
-  computed: "Computed from a relation (read-only)",
-  openRow: "Open row"
-};
-var ADD_COLUMN_COL_ID = "__add_column";
-var OPEN_ROW_COL_ID = "__open_row";
-var COLUMN_TYPE_ICONS = {
-  text: Type,
-  number: Hash,
-  date: CalendarDays,
-  checkbox: CheckSquare,
-  select: ChevronDown,
-  person: UserRound,
-  document: FileText,
-  relation: ArrowUpRight,
-  lookup: Search,
-  rollup: Sigma
-};
-var WIDTHS = {
-  text: 220,
-  number: 130,
-  date: 140,
-  checkbox: 110,
-  select: 160,
-  person: 180,
-  document: 240,
-  relation: 240,
-  lookup: 200,
-  rollup: 130
-};
-function HeaderLabel({
-  column,
-  onEdit,
-  label,
-  computedLabel
-}) {
-  const Icon = COLUMN_TYPE_ICONS[column.type];
-  return /* @__PURE__ */ jsxs("span", { className: "group/dbh flex min-w-0 items-center gap-1.5", children: [
-    /* @__PURE__ */ jsx(Icon, { className: "size-3.5 shrink-0 text-muted-foreground", "aria-hidden": true }),
-    /* @__PURE__ */ jsx("span", { className: "truncate text-[12.5px] font-medium", children: column.name }),
-    isComputedColumn(column) && /* @__PURE__ */ jsx("span", { title: computedLabel, "data-testid": `database-column-computed-${column.id}`, children: /* @__PURE__ */ jsx(Lock, { className: "size-3 shrink-0 text-muted-foreground/70", "aria-label": computedLabel }) }),
-    onEdit && /* @__PURE__ */ jsx(
-      "button",
-      {
-        type: "button",
-        "aria-label": label,
-        title: label,
-        "data-testid": `database-column-settings-${column.id}`,
-        onClick: (e) => {
-          e.stopPropagation();
-          onEdit();
-        },
-        onMouseDown: (e) => e.stopPropagation(),
-        className: "ml-auto rounded p-0.5 text-muted-foreground opacity-0 hover:bg-muted hover:text-foreground focus-visible:opacity-100 group-hover/dbh:opacity-100",
-        children: /* @__PURE__ */ jsx(MoreHorizontal, { className: "size-3.5" })
-      }
-    )
-  ] });
-}
-function columnWidth(column) {
-  const header = Math.round(column.name.length * 8) + 76 + (isComputedColumn(column) ? 16 : 0);
-  return Math.min(320, Math.max(WIDTHS[column.type], header));
-}
-function canEditColumn(column, sources) {
-  if (isComputedColumn(column)) return false;
-  if (column.type === "person") return Boolean(sources?.members);
-  if (column.type === "document") return Boolean(sources?.documents);
-  if (column.type === "relation") return Boolean(sources?.searchRows && column.relation);
-  return true;
-}
-function editorFor(column, sources) {
-  const pick = (params) => ({
-    cellEditor: PickCellEditor,
-    cellEditorPopup: true,
-    cellEditorParams: params
-  });
-  switch (column.type) {
-    case "number":
-      return { cellEditor: "agNumberCellEditor", cellEditorParams: { showStepperButtons: false } };
-    case "date":
-      return { cellEditor: "agDateStringCellEditor" };
-    case "checkbox":
-      return { cellEditor: "agCheckboxCellEditor" };
-    case "select":
-      return {
-        cellEditor: SelectCellEditor,
-        cellEditorPopup: true,
-        cellEditorParams: { options: column.options ?? [] }
-      };
-    case "person":
-      return pick({ kind: "person", options: sources?.members ?? [] });
-    case "document":
-      return pick({ kind: "document", options: sources?.documents ?? [] });
-    case "relation": {
-      const target = column.relation?.database_id;
-      const searchRows = sources?.searchRows;
-      return pick({
-        kind: "relation",
-        search: target && searchRows ? (q) => searchRows(target, q) : void 0
-      });
-    }
-    case "lookup":
-    case "rollup":
-      return {};
-    default:
-      return { cellEditor: "agTextCellEditor" };
-  }
-}
-function rendererFor(column, locale, sources) {
-  switch (column.type) {
-    case "checkbox":
-      return {
-        cellRenderer: "agCheckboxCellRenderer",
-        cellClass: "flex items-center justify-center"
-      };
-    case "select":
-      return {
-        cellRenderer: (p) => typeof p.value === "string" && p.value ? /* @__PURE__ */ jsx(SelectChip, { value: p.value }) : null
-      };
-    case "number":
-      return {
-        cellClass: "cell-numeric",
-        valueFormatter: (p) => formatCell(p.value, "number", locale)
-      };
-    case "rollup":
-      return {
-        cellClass: "cell-numeric text-muted-foreground",
-        valueFormatter: (p) => formatCell(p.value, "rollup", locale)
-      };
-    case "date":
-      return {
-        valueFormatter: (p) => formatCell(p.value, "date", locale)
-      };
-    case "person":
-      return {
-        cellRenderer: (p) => /* @__PURE__ */ jsx(PersonCell, { value: p.value, titles: p.data?.titles })
-      };
-    case "document":
-    case "relation":
-      return {
-        cellRenderer: (p) => /* @__PURE__ */ jsx(
-          LinkChipsCell,
-          {
-            value: p.value,
-            titles: p.data?.titles,
-            kind: column.type === "document" ? "document" : "relation",
-            onOpenDocument: sources?.onOpenDocument
-          }
-        )
-      };
-    case "lookup":
-      return {
-        cellRenderer: (p) => /* @__PURE__ */ jsx(LookupCell, { value: p.value, titles: p.data?.titles, locale })
-      };
-    default:
-      return {};
-  }
-}
-function createDatabaseColumns(columns, options = {}) {
-  const { readOnly, onEditColumn, onAddColumn, onOpenRow, locale, sources } = options;
-  const l = { ...DEFAULT_DATABASE_COLUMN_LABELS, ...options.labels };
-  const openRow = onOpenRow && columns.length > 0 ? [
-    {
-      colId: OPEN_ROW_COL_ID,
-      headerName: "",
-      width: 40,
-      minWidth: 40,
-      maxWidth: 40,
-      resizable: false,
-      sortable: false,
-      editable: false,
-      suppressMovable: true,
-      // Pinned: the button stays in view however far the table scrolls.
-      pinned: "left",
-      lockPinned: true,
-      lockPosition: "left",
-      cellClass: "flex items-center justify-center !px-0",
-      valueGetter: () => null,
-      cellRenderer: (p) => p.data ? /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          "aria-label": l.openRow,
-          title: l.openRow,
-          "data-testid": `database-open-row-${p.data.id}`,
-          onClick: (e) => {
-            e.stopPropagation();
-            if (p.data) onOpenRow(p.data);
-          },
-          onDoubleClick: (e) => e.stopPropagation(),
-          className: "flex size-6 items-center justify-center rounded text-muted-foreground/70 hover:bg-muted hover:text-foreground",
-          children: /* @__PURE__ */ jsx(Maximize2, { className: "size-3.5" })
-        }
-      ) : null
-    }
-  ] : [];
-  const defs = columns.map((column) => ({
-    colId: column.id,
-    headerName: column.name,
-    width: columnWidth(column),
-    minWidth: 90,
-    resizable: true,
-    sortable: true,
-    editable: !readOnly && canEditColumn(column, sources),
-    // The grid's own type inference must not second-guess the database's column type.
-    cellDataType: false,
-    headerComponentParams: {
-      innerHeaderComponent: () => /* @__PURE__ */ jsx(
-        HeaderLabel,
-        {
-          column,
-          label: l.columnSettings(column.name),
-          computedLabel: l.computed,
-          onEdit: !readOnly && onEditColumn ? () => onEditColumn(column) : void 0
-        }
-      )
-    },
-    // An empty checkbox reads as unticked (not indeterminate).
-    valueGetter: (p) => column.type === "checkbox" ? p.data?.values[column.id] === true : p.data?.values[column.id] ?? null,
-    // Edits land in the row's values as the API would store them; the host saves them in
-    // onCellValueChanged and puts the server's normalised row back.
-    valueSetter: (p) => {
-      if (!p.data) return false;
-      const next = toApiValue(p.newValue, column.type);
-      if (sameCellValue(next, p.oldValue)) return false;
-      p.data.values = { ...p.data.values, [column.id]: next };
-      return true;
-    },
-    comparator: (a, b, nodeA, nodeB) => compareCells(a, b, column.type, nodeA?.data?.titles, nodeB?.data?.titles),
-    getQuickFilterText: (p) => formatCell(p.value, column.type, locale, p.data?.titles),
-    ...editorFor(column, sources),
-    ...rendererFor(column, locale, sources)
-  }));
-  defs.unshift(...openRow);
-  if (!readOnly && onAddColumn) {
-    defs.push({
-      colId: ADD_COLUMN_COL_ID,
-      width: 52,
-      minWidth: 52,
-      maxWidth: 52,
-      resizable: false,
-      sortable: false,
-      editable: false,
-      suppressMovable: true,
-      // Pinned: on a wide table the add button stays in view instead of scrolling off the right.
-      pinned: "right",
-      lockPinned: true,
-      headerComponent: () => /* @__PURE__ */ jsx(
-        "button",
-        {
-          type: "button",
-          "aria-label": l.addColumn,
-          title: l.addColumn,
-          "data-testid": "database-add-column",
-          onClick: onAddColumn,
-          className: "flex size-7 items-center justify-center rounded-md text-muted-foreground hover:bg-muted hover:text-foreground",
-          children: /* @__PURE__ */ jsx(Plus, { className: "size-4" })
-        }
-      ),
-      valueGetter: () => null
-    });
-  }
-  return defs;
-}
-var DEFAULT_COLUMN_CONFIG_LABELS = {
-  relatedDatabase: "Related database",
-  pickDatabase: "Pick a database",
-  noDatabases: "There is no database to link to yet.",
-  targetFixed: "The related database can\u2019t be changed once the column has been added.",
-  thisDatabase: "this database",
-  showOnTarget: (target) => `Show on ${target}`,
-  showOnTargetHint: "Adds a column to the related database that lists the links back.",
-  pairName: "Name of the column there",
-  pairNamePlaceholder: (name) => name,
-  pairedWith: (target) => `Shown on ${target} too (two-way).`,
-  oneWay: "One-way: only this database shows the links.",
-  relation: "Relation",
-  pickRelation: "Pick a relation column",
-  noRelations: "Add a relation column first: lookups and rollups read through one.",
-  lookupColumn: "Column to show",
-  pickColumn: "Pick a column",
-  noColumns: "The related database has no column to show.",
-  rollupOp: "Calculate",
-  rollupColumn: "Of the number column",
-  noNumberColumns: "The related database has no number column.",
-  ops: { count: "Count", sum: "Sum", avg: "Average", min: "Min", max: "Max" }
-};
-function Field({ label, children, hint }) {
-  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
-    /* @__PURE__ */ jsx(Label, { children: label }),
-    children,
-    hint && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: hint })
-  ] });
-}
-function Hint({ children, testId }) {
-  return /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", "data-testid": testId, children });
-}
-function ColumnSelect({
-  value,
-  onChange,
-  columns,
-  placeholder,
-  testId
-}) {
-  return /* @__PURE__ */ jsxs(Select, { value: value || void 0, onValueChange: onChange, children: [
-    /* @__PURE__ */ jsx(SelectTrigger, { "data-testid": testId, children: /* @__PURE__ */ jsx(SelectValue, { placeholder }) }),
-    /* @__PURE__ */ jsx(SelectContent, { children: columns.map((c) => {
-      const Icon = COLUMN_TYPE_ICONS[c.type];
-      return /* @__PURE__ */ jsx(SelectItem, { value: c.id, "data-testid": `${testId}-${c.id}`, children: /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-2", children: [
-        /* @__PURE__ */ jsx(Icon, { className: "size-4 text-muted-foreground" }),
-        c.name
-      ] }) }, c.id);
-    }) })
-  ] });
-}
-function RelationFields({
-  draft,
-  onChange,
-  databases,
-  databaseId,
-  databaseName,
-  editing,
-  column,
-  labels
-}) {
-  const nameOf = (id) => databases.find((d) => d.id === id)?.name ?? (id === databaseId ? labels.thisDatabase : id);
-  if (editing && column?.relation) {
-    const target2 = nameOf(column.relation.database_id);
-    return /* @__PURE__ */ jsxs(Field, { label: labels.relatedDatabase, hint: labels.targetFixed, children: [
-      /* @__PURE__ */ jsx("p", { className: "text-sm", "data-testid": "database-column-relation-target", children: target2 }),
-      /* @__PURE__ */ jsx(Hint, { children: column.relation.two_way ? labels.pairedWith(target2) : labels.oneWay })
-    ] });
-  }
-  if (databases.length === 0) return /* @__PURE__ */ jsx(Hint, { children: labels.noDatabases });
-  const target = draft.database_id ? nameOf(draft.database_id) : "";
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(Field, { label: labels.relatedDatabase, children: /* @__PURE__ */ jsxs(
-      Select,
-      {
-        value: draft.database_id || void 0,
-        onValueChange: (v) => onChange({ ...draft, database_id: v }),
-        children: [
-          /* @__PURE__ */ jsx(SelectTrigger, { "data-testid": "database-column-relation-database", children: /* @__PURE__ */ jsx(SelectValue, { placeholder: labels.pickDatabase }) }),
-          /* @__PURE__ */ jsx(SelectContent, { children: databases.map((d) => /* @__PURE__ */ jsx(
-            SelectItem,
-            {
-              value: d.id,
-              "data-testid": `database-column-relation-database-${d.id}`,
-              children: d.id === databaseId ? `${d.name} (${labels.thisDatabase})` : d.name
-            },
-            d.id
-          )) })
-        ]
-      }
-    ) }),
-    draft.database_id && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2 rounded-md border border-border p-3", children: [
-      /* @__PURE__ */ jsxs("label", { className: "flex items-center justify-between gap-3 text-sm", children: [
-        /* @__PURE__ */ jsxs("span", { className: "flex flex-col", children: [
-          /* @__PURE__ */ jsx("span", { className: "font-medium", children: labels.showOnTarget(target) }),
-          /* @__PURE__ */ jsx("span", { className: "text-xs text-muted-foreground", children: labels.showOnTargetHint })
-        ] }),
-        /* @__PURE__ */ jsx(
-          Switch,
-          {
-            checked: draft.two_way,
-            onCheckedChange: (two_way) => onChange({ ...draft, two_way }),
-            "data-testid": "database-column-relation-two-way"
-          }
-        )
-      ] }),
-      draft.two_way && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
-        /* @__PURE__ */ jsx(Label, { htmlFor: "database-column-pair-name", children: labels.pairName }),
-        /* @__PURE__ */ jsx(
-          Input,
-          {
-            id: "database-column-pair-name",
-            value: draft.pair_name,
-            maxLength: 200,
-            placeholder: labels.pairNamePlaceholder(databaseName ?? ""),
-            onChange: (e) => onChange({ ...draft, pair_name: e.target.value }),
-            "data-testid": "database-column-pair-name"
-          }
-        )
-      ] })
-    ] })
-  ] });
-}
-function relationColumnsOf(columns) {
-  return columns.filter((c) => c.type === "relation" && c.relation);
-}
-function targetColumnsOf(relationId, columns, databases, databaseId) {
-  const relation = columns.find((c) => c.id === relationId)?.relation;
-  if (!relation) return [];
-  if (relation.database_id === databaseId) return columns;
-  return databases.find((d) => d.id === relation.database_id)?.columns ?? [];
-}
-function LookupFields({
-  draft,
-  onChange,
-  columns,
-  databases,
-  databaseId,
-  labels
-}) {
-  const relations = relationColumnsOf(columns);
-  if (relations.length === 0)
-    return /* @__PURE__ */ jsx(Hint, { testId: "database-column-no-relations", children: labels.noRelations });
-  const shown = targetColumnsOf(draft.relation, columns, databases, databaseId).filter(
-    (c) => !isComputedColumn(c)
-  );
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(Field, { label: labels.relation, children: /* @__PURE__ */ jsx(
-      ColumnSelect,
-      {
-        value: draft.relation,
-        onChange: (relation) => onChange({ relation, column: "" }),
-        columns: relations,
-        placeholder: labels.pickRelation,
-        testId: "database-column-lookup-relation"
-      }
-    ) }),
-    draft.relation && /* @__PURE__ */ jsx(Field, { label: labels.lookupColumn, children: shown.length ? /* @__PURE__ */ jsx(
-      ColumnSelect,
-      {
-        value: draft.column,
-        onChange: (column) => onChange({ ...draft, column }),
-        columns: shown,
-        placeholder: labels.pickColumn,
-        testId: "database-column-lookup-column"
-      }
-    ) : /* @__PURE__ */ jsx(Hint, { children: labels.noColumns }) })
-  ] });
-}
-function RollupFields({
-  draft,
-  onChange,
-  columns,
-  databases,
-  databaseId,
-  labels
-}) {
-  const relations = relationColumnsOf(columns);
-  if (relations.length === 0)
-    return /* @__PURE__ */ jsx(Hint, { testId: "database-column-no-relations", children: labels.noRelations });
-  const numbers = targetColumnsOf(draft.relation, columns, databases, databaseId).filter(
-    (c) => c.type === "number"
-  );
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(Field, { label: labels.relation, children: /* @__PURE__ */ jsx(
-      ColumnSelect,
-      {
-        value: draft.relation,
-        onChange: (relation) => onChange({ ...draft, relation, column: "" }),
-        columns: relations,
-        placeholder: labels.pickRelation,
-        testId: "database-column-rollup-relation"
-      }
-    ) }),
-    draft.relation && /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-[8rem_1fr] gap-2", children: [
-      /* @__PURE__ */ jsx(Field, { label: labels.rollupOp, children: /* @__PURE__ */ jsxs(
-        Select,
-        {
-          value: draft.op,
-          onValueChange: (op) => onChange({ ...draft, op }),
-          children: [
-            /* @__PURE__ */ jsx(SelectTrigger, { "data-testid": "database-column-rollup-op", children: /* @__PURE__ */ jsx(SelectValue, {}) }),
-            /* @__PURE__ */ jsx(SelectContent, { children: DATABASE_ROLLUP_OPS.map((op) => /* @__PURE__ */ jsx(SelectItem, { value: op, "data-testid": `database-column-rollup-op-${op}`, children: labels.ops[op] }, op)) })
-          ]
-        }
-      ) }),
-      draft.op !== "count" && /* @__PURE__ */ jsx(Field, { label: labels.rollupColumn, children: numbers.length ? /* @__PURE__ */ jsx(
-        ColumnSelect,
-        {
-          value: draft.column,
-          onChange: (column) => onChange({ ...draft, column }),
-          columns: numbers,
-          placeholder: labels.pickColumn,
-          testId: "database-column-rollup-column"
-        }
-      ) : /* @__PURE__ */ jsx(Hint, { children: labels.noNumberColumns }) })
-    ] })
-  ] });
-}
-var DEFAULT_DATABASE_ROW_DETAIL_LABELS = {
-  untitled: "Untitled",
-  fields: "Fields",
-  documents: "Linked documents",
-  noDocuments: "No document is linked to this row.",
-  empty: "Empty",
-  deleteRow: "Delete row",
-  close: "Close",
-  computed: "Computed from a relation"
-};
-function DraftInput({
-  value,
-  type,
-  onCommit,
-  testId,
-  label
-}) {
-  const [draft, setDraft] = useState(value);
-  useEffect(() => setDraft(value), [value]);
-  return /* @__PURE__ */ jsx(
-    Input,
-    {
-      type,
-      value: draft,
-      "aria-label": label,
-      onChange: (e) => setDraft(e.target.value),
-      onBlur: () => draft !== value && onCommit(draft),
-      onKeyDown: (e) => {
-        if (e.key === "Enter") e.currentTarget.blur();
-        if (e.key === "Escape") {
-          setDraft(value);
-          requestAnimationFrame(() => e.target.blur());
-        }
-      },
-      className: "h-8",
-      "data-testid": testId
-    }
-  );
-}
-function PopoverField({
-  display,
-  emptyLabel,
-  testId,
-  label,
-  renderEditor,
-  onCommit
-}) {
-  const [open, setOpen] = useState(false);
-  const pending = useRef(null);
-  const cancelled = useRef(false);
-  const close = (keep) => {
-    setOpen(false);
-    const change = pending.current;
-    pending.current = null;
-    if (change && !cancelled.current) onCommit(change.value);
-    cancelled.current = false;
-  };
-  return /* @__PURE__ */ jsxs(
-    Popover,
-    {
-      open,
-      onOpenChange: (next) => {
-        if (next) {
-          pending.current = null;
-          cancelled.current = false;
-          setOpen(true);
-        } else close();
-      },
-      children: [
-        /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
-          "div",
-          {
-            role: "button",
-            tabIndex: 0,
-            "aria-label": label,
-            "aria-haspopup": "dialog",
-            onKeyDown: (e) => {
-              if (e.target === e.currentTarget && (e.key === "Enter" || e.key === " ")) {
-                e.preventDefault();
-                setOpen(true);
-              }
-            },
-            className: "flex min-h-8 w-full min-w-0 cursor-pointer items-center rounded-md border border-input bg-transparent px-2 py-1 text-left text-sm outline-none hover:bg-muted/50 focus-visible:ring-2 focus-visible:ring-ring",
-            "data-testid": testId,
-            children: display ?? /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: emptyLabel })
-          }
-        ) }),
-        /* @__PURE__ */ jsx(
-          PopoverContent,
-          {
-            align: "start",
-            className: "w-auto border-0 bg-transparent p-0 shadow-none",
-            onEscapeKeyDown: () => {
-              cancelled.current = true;
-            },
-            children: renderEditor({
-              onValueChange: (value) => {
-                pending.current = { value };
-              },
-              stopEditing: () => close()
-            })
-          }
-        )
-      ]
-    }
-  );
-}
-function DatabaseRowDetail({
-  row,
-  columns,
-  onChange,
-  sources,
-  onDelete,
-  onClose,
-  readOnly = false,
-  locale,
-  labels,
-  className,
-  testId = "database-row-detail"
-}) {
-  const l = { ...DEFAULT_DATABASE_ROW_DETAIL_LABELS, ...labels };
-  const title = row ? rowTitle(row, columns, locale) || l.untitled : "";
-  const commit = (column, value) => {
-    if (!row || !onChange) return;
-    const next = toApiValue(value, column.type);
-    if (sameCellValue(next, row.values[column.id])) return;
-    onChange(row, column.id, next);
-  };
-  const fieldEditor = (column) => {
-    if (!row) return null;
-    const value = row.values[column.id];
-    const id = `${testId}-input-${column.id}`;
-    const editable = !readOnly && Boolean(onChange) && canEditColumn(column, sources);
-    const display = () => {
-      switch (column.type) {
-        case "select":
-          return typeof value === "string" && value ? /* @__PURE__ */ jsx(SelectChip, { value }) : null;
-        case "person":
-          return cellIds(value).length ? /* @__PURE__ */ jsx(PersonCell, { value, titles: row.titles }) : null;
-        case "document":
-        case "relation":
-          return cellIds(value).length ? /* @__PURE__ */ jsx(
-            LinkChipsCell,
-            {
-              value,
-              titles: row.titles,
-              kind: column.type,
-              onOpenDocument: sources?.onOpenDocument,
-              wrap: true
-            }
-          ) : null;
-        case "lookup":
-          return /* @__PURE__ */ jsx(LookupCell, { value, titles: row.titles, locale, wrap: true });
-        default: {
-          const text = formatCell(value, column.type, locale, row.titles);
-          return text ? /* @__PURE__ */ jsx("span", { className: "break-words", children: text }) : null;
-        }
-      }
-    };
-    if (!editable) {
-      const shown = display();
-      return /* @__PURE__ */ jsx(
-        "div",
-        {
-          className: cn(
-            "flex min-h-8 min-w-0 items-center py-1 text-sm",
-            isComputedColumn(column) && "text-muted-foreground"
-          ),
-          title: isComputedColumn(column) ? l.computed : void 0,
-          "data-testid": id,
-          children: shown ?? /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: "\u2014" })
-        }
-      );
-    }
-    switch (column.type) {
-      case "checkbox":
-        return /* @__PURE__ */ jsx("div", { className: "flex min-h-8 items-center", children: /* @__PURE__ */ jsx(
-          Checkbox,
-          {
-            checked: value === true,
-            "aria-label": column.name,
-            onCheckedChange: (checked) => commit(column, checked === true),
-            "data-testid": id
-          }
-        ) });
-      case "number":
-      case "date":
-      case "text": {
-        const text = value == null ? "" : column.type === "date" ? String(value).slice(0, 10) : String(value);
-        return /* @__PURE__ */ jsx(
-          DraftInput,
-          {
-            value: text,
-            type: column.type,
-            label: column.name,
-            onCommit: (next) => commit(column, next),
-            testId: id
-          }
-        );
-      }
-      case "select":
-        return /* @__PURE__ */ jsx(
-          PopoverField,
-          {
-            display: display(),
-            emptyLabel: l.empty,
-            label: column.name,
-            testId: id,
-            onCommit: (next) => commit(column, next),
-            renderEditor: (editor) => /* @__PURE__ */ jsx(SelectCellEditor, { ...editor, value, options: column.options ?? [] })
-          }
-        );
-      case "person":
-      case "document":
-      case "relation": {
-        const target = column.relation?.database_id;
-        const searchRows = sources?.searchRows;
-        return /* @__PURE__ */ jsx(
-          PopoverField,
-          {
-            display: display(),
-            emptyLabel: l.empty,
-            label: column.name,
-            testId: id,
-            onCommit: (next) => commit(column, next),
-            renderEditor: (editor) => /* @__PURE__ */ jsx(
-              PickCellEditor,
-              {
-                ...editor,
-                value,
-                data: row,
-                kind: column.type,
-                options: column.type === "person" ? sources?.members : column.type === "document" ? sources?.documents : void 0,
-                search: column.type === "relation" && target && searchRows ? (q) => searchRows(target, q) : void 0
-              }
-            )
-          }
-        );
-      }
-      default:
-        return null;
-    }
-  };
-  const documents = /* @__PURE__ */ new Map();
-  if (row) {
-    for (const column of columns) {
-      if (column.type !== "document") continue;
-      for (const id of cellIds(row.values[column.id])) {
-        documents.set(id, [...documents.get(id) ?? [], column.name]);
-      }
-    }
-  }
-  const openDocument = sources?.onOpenDocument;
-  return /* @__PURE__ */ jsxs(
-    DetailPanel,
-    {
-      title,
-      icon: /* @__PURE__ */ jsx(Rows3, { className: "size-4" }),
-      isLoading: !row,
-      onClose,
-      labels: { close: l.close },
-      className,
-      testId,
-      actions: row && onDelete && !readOnly ? /* @__PURE__ */ jsx(
-        Button,
-        {
-          variant: "ghost",
-          size: "icon",
-          className: "size-8 text-red-text",
-          onClick: () => onDelete(row),
-          "aria-label": l.deleteRow,
-          title: l.deleteRow,
-          "data-testid": `${testId}-delete`,
-          children: /* @__PURE__ */ jsx(Trash2, { className: "size-4" })
-        }
-      ) : void 0,
-      children: [
-        /* @__PURE__ */ jsx(DetailSection, { title: l.fields, testId: `${testId}-fields`, children: /* @__PURE__ */ jsx(DetailFields, { children: columns.map((column) => {
-          const Icon = COLUMN_TYPE_ICONS[column.type];
-          return /* @__PURE__ */ jsx(
-            DetailField,
-            {
-              label: column.name,
-              icon: Icon ? /* @__PURE__ */ jsx(Icon, { className: "size-3.5" }) : void 0,
-              testId: `${testId}-field-${column.id}`,
-              children: fieldEditor(column)
-            },
-            column.id
-          );
-        }) }) }),
-        columns.some((c) => c.type === "document") && /* @__PURE__ */ jsx(DetailSection, { title: l.documents, count: documents.size, testId: `${testId}-documents`, children: documents.size ? /* @__PURE__ */ jsx(DetailLinkList, { children: [...documents].map(([id, via]) => /* @__PURE__ */ jsx(
-          DetailLinkItem,
-          {
-            icon: /* @__PURE__ */ jsx(FileText, { className: "size-4" }),
-            onClick: openDocument ? () => openDocument(id) : void 0,
-            testId: `${testId}-doc-${id}`,
-            children: /* @__PURE__ */ jsxs("span", { className: "min-w-0 flex-1", children: [
-              /* @__PURE__ */ jsx("span", { className: "block truncate font-medium", children: titleOf(id, row?.titles) }),
-              /* @__PURE__ */ jsx("span", { className: "block truncate text-xs text-muted-foreground", children: via.join(", ") })
-            ] })
-          },
-          id
-        )) }) : /* @__PURE__ */ jsx(DetailEmpty, { children: l.noDocuments }) })
-      ]
-    }
-  );
-}
-var escapeHtml = (text) => text.replace(/[&<>"']/g, (ch) => `&#${ch.charCodeAt(0)};`);
-var DEFAULT_DATABASE_TABLE_LABELS = {
-  newRow: "New row",
-  emptyTitle: "No rows yet",
-  emptyMessage: "Add a row, or import a spreadsheet.",
-  noColumnsTitle: "No columns yet",
-  noColumnsMessage: "Add a column to start.",
-  noMatches: "No rows match your search."
-};
-function DatabaseTable({
-  columns,
-  rows,
-  onCellChange,
-  onAddRow,
-  onAddColumn,
-  onEditColumn,
-  onOpenRow,
-  sources,
-  onSelectionChange,
-  selected,
-  readOnly = false,
-  isFiltered = false,
-  isLoading,
-  locale,
-  gridId,
-  height = "100%",
-  labels,
-  columnLabels,
-  gridProps,
-  testId
-}) {
-  const l = { ...DEFAULT_DATABASE_TABLE_LABELS, ...labels };
-  const columnDefs = useMemo(
-    () => createDatabaseColumns(columns, {
-      readOnly,
-      onEditColumn,
-      onAddColumn,
-      onOpenRow,
-      sources,
-      locale,
-      labels: columnLabels
-    }),
-    [columns, readOnly, onEditColumn, onAddColumn, onOpenRow, sources, locale, columnLabels]
-  );
-  const noColumns = columns.length === 0;
-  const emptyState = {
-    icon: /* @__PURE__ */ jsx(Table2, { className: "size-8 text-muted-foreground" }),
-    title: l.noColumnsTitle,
-    message: readOnly ? void 0 : l.noColumnsMessage,
-    action: !readOnly && onAddColumn ? /* @__PURE__ */ jsxs(Button, { onClick: onAddColumn, "data-testid": "database-empty-add-column", className: "gap-1.5", children: [
-      /* @__PURE__ */ jsx(Plus, { className: "size-4" }),
-      columnLabels?.addColumn ?? DEFAULT_DATABASE_COLUMN_LABELS.addColumn
-    ] }) : void 0
-  };
-  const noRowsText = isFiltered ? l.noMatches : readOnly ? l.emptyTitle : `${l.emptyTitle}. ${l.emptyMessage}`;
-  const api = useRef(null);
-  const knownColumns = useRef(null);
-  useEffect(() => {
-    const ids = new Set(columns.map((c) => c.id));
-    const added = knownColumns.current ? columns.filter((c) => !knownColumns.current.has(c.id)) : [];
-    knownColumns.current = ids;
-    const last = added[added.length - 1];
-    if (last && api.current) {
-      const grid = api.current;
-      setTimeout(() => grid.ensureColumnVisible(last.id, "end"), 0);
-    }
-  }, [columns]);
-  const handleCellValueChanged = (event) => {
-    const columnId = event.column.getColId();
-    if (!event.data || !onCellChange) return;
-    onCellChange(event.data, columnId, event.data.values[columnId] ?? null);
-  };
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      className: "flex h-full min-h-0 flex-col",
-      "data-testid": testIdOr(testId, { testId: "database-table" }),
-      children: [
-        /* @__PURE__ */ jsx("div", { className: "min-h-0 flex-1", children: /* @__PURE__ */ jsx(
-          GridView,
-          {
-            testId: "database-grid",
-            items: rows,
-            columnDefs,
-            getItemId: (row) => row.id,
-            getRowTestId: (row) => `database-row-${row.id}`,
-            getCellTestId: (colId, row) => `database-cell-${row.id}-${colId}`,
-            isLoading,
-            emptyState,
-            showEmpty: noColumns,
-            gridId,
-            height,
-            rowHeight: 38,
-            selection: onSelectionChange ? { mode: "multiple", selected: selected ?? [], onSelectionChange, controlled: true } : void 0,
-            onCellValueChanged: handleCellValueChanged,
-            ...gridProps,
-            onGridReady: (params) => {
-              api.current = params.api;
-              gridProps?.onGridReady?.(params);
-            },
-            gridOptions: {
-              overlayNoRowsTemplate: `<span class="text-sm text-muted-foreground">${escapeHtml(noRowsText)}</span>`,
-              singleClickEdit: false,
-              stopEditingWhenCellsLoseFocus: true,
-              enterNavigatesVerticallyAfterEdit: true,
-              undoRedoCellEditing: false,
-              ...gridProps?.gridOptions
-            }
-          }
-        ) }),
-        !readOnly && onAddRow && columns.length > 0 && /* @__PURE__ */ jsx("div", { className: "border-t border-border px-2 py-1", children: /* @__PURE__ */ jsxs(
-          Button,
-          {
-            variant: "ghost",
-            size: "sm",
-            onClick: onAddRow,
-            "data-testid": "database-add-row",
-            className: "gap-1.5 text-muted-foreground",
-            children: [
-              /* @__PURE__ */ jsx(Plus, { className: "size-4" }),
-              l.newRow
-            ]
-          }
-        ) })
-      ]
-    }
-  );
-}
-var DEFAULT_DATABASE_TOOLBAR_LABELS = {
-  back: "All databases",
-  rename: "Rename database",
-  rows: (n) => `${n.toLocaleString()} row${n === 1 ? "" : "s"}`,
-  showing: (shown, total) => `Showing ${shown.toLocaleString()} of ${total.toLocaleString()}`,
-  search: "Search",
-  deleteSelected: (n) => `Delete ${n} row${n === 1 ? "" : "s"}`,
-  more: "More actions",
-  importRows: "Import rows from a spreadsheet\u2026",
-  exportXlsx: "Export to Excel (.xlsx)",
-  exportCsv: "Export to CSV",
-  deleteDatabase: "Delete database",
-  readOnly: "Read-only here: this database belongs to another workspace."
-};
-var SPREADSHEET_ACCEPT = ".csv,.xlsx,text/csv,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet";
-function DatabaseToolbar({
-  name,
-  description,
-  total,
-  shown,
-  search,
-  onSearchChange,
-  onBack,
-  onRename,
-  selectedCount = 0,
-  onDeleteSelected,
-  onImportRows,
-  onExport,
-  onDeleteDatabase,
-  readOnly = false,
-  views,
-  labels
-}) {
-  const l = { ...DEFAULT_DATABASE_TOOLBAR_LABELS, ...labels };
-  const [title, setTitle] = useState(name);
-  const fileInput = useRef(null);
-  useEffect(() => setTitle(name), [name]);
-  const commitTitle = () => {
-    const next = title.trim();
-    if (next && next !== name) onRename?.(next);
-    else setTitle(name);
-  };
-  const onTitleKey = (e) => {
-    if (e.key === "Enter") e.currentTarget.blur();
-    if (e.key === "Escape") {
-      setTitle(name);
-      e.currentTarget.blur();
-    }
-  };
-  const onFile = (e) => {
-    const file = e.target.files?.[0];
-    if (file) onImportRows?.(file);
-    e.target.value = "";
-  };
-  const canRename = !readOnly && Boolean(onRename);
-  const hasMenu = Boolean(onExport || !readOnly && (onImportRows || onDeleteDatabase));
-  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2 px-2 pb-2 pt-1", "data-testid": "database-toolbar", children: [
-    /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 items-center gap-2", children: [
-      onBack && /* @__PURE__ */ jsx(
-        Button,
-        {
-          variant: "ghost",
-          size: "icon",
-          onClick: onBack,
-          "aria-label": l.back,
-          title: l.back,
-          "data-testid": "database-back",
-          children: /* @__PURE__ */ jsx(ArrowLeft, { className: "size-4" })
-        }
-      ),
-      /* @__PURE__ */ jsx(FileSpreadsheet, { className: "size-5 shrink-0 text-muted-foreground", "aria-hidden": true }),
-      canRename ? /* @__PURE__ */ jsx(
-        "input",
-        {
-          value: title,
-          "aria-label": l.rename,
-          maxLength: 200,
-          onChange: (e) => setTitle(e.target.value),
-          onBlur: commitTitle,
-          onKeyDown: onTitleKey,
-          "data-testid": "database-title",
-          className: "min-w-0 flex-1 truncate rounded-md bg-transparent px-1 text-xl font-semibold outline-none hover:bg-muted/60 focus:bg-muted/60"
-        }
-      ) : /* @__PURE__ */ jsx(
-        "h2",
-        {
-          className: "min-w-0 flex-1 truncate px-1 text-xl font-semibold",
-          "data-testid": "database-title",
-          children: name
-        }
-      ),
-      /* @__PURE__ */ jsx("span", { className: "shrink-0 text-sm text-muted-foreground", "data-testid": "database-row-count", children: shown !== void 0 && shown < total ? l.showing(shown, total) : l.rows(total) })
-    ] }),
-    description && /* @__PURE__ */ jsx("p", { className: "px-1 text-sm text-muted-foreground", children: description }),
-    readOnly && /* @__PURE__ */ jsxs(
-      "p",
-      {
-        className: "flex items-center gap-1.5 rounded-md bg-muted px-2 py-1 text-xs text-muted-foreground",
-        "data-testid": "database-read-only",
-        children: [
-          /* @__PURE__ */ jsx(Eye, { className: "size-3.5" }),
-          l.readOnly
-        ]
-      }
-    ),
-    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-      /* @__PURE__ */ jsxs("div", { className: "relative max-w-sm flex-1", children: [
-        /* @__PURE__ */ jsx(Search, { className: "pointer-events-none absolute left-2.5 top-1/2 size-4 -translate-y-1/2 text-muted-foreground" }),
-        /* @__PURE__ */ jsx(
-          Input,
-          {
-            value: search,
-            onChange: (e) => onSearchChange(e.target.value),
-            placeholder: l.search,
-            "aria-label": l.search,
-            className: "h-8 pl-8",
-            "data-testid": "database-search"
-          }
-        )
-      ] }),
-      /* @__PURE__ */ jsx("span", { className: "flex-1" }),
-      views,
-      !readOnly && selectedCount > 0 && onDeleteSelected && /* @__PURE__ */ jsxs(
-        Button,
-        {
-          variant: "outline",
-          size: "sm",
-          onClick: onDeleteSelected,
-          className: "gap-1.5 text-red-text",
-          "data-testid": "database-delete-rows",
-          children: [
-            /* @__PURE__ */ jsx(Trash2, { className: "size-4" }),
-            l.deleteSelected(selectedCount)
-          ]
-        }
-      ),
-      hasMenu && /* @__PURE__ */ jsxs(DropdownMenu, { children: [
-        /* @__PURE__ */ jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
-          Button,
-          {
-            variant: "outline",
-            size: "icon",
-            "aria-label": l.more,
-            title: l.more,
-            "data-testid": "database-menu",
-            children: /* @__PURE__ */ jsx(MoreHorizontal, { className: "size-4" })
-          }
-        ) }),
-        /* @__PURE__ */ jsxs(DropdownMenuContent, { align: "end", className: "w-64", children: [
-          !readOnly && onImportRows && /* @__PURE__ */ jsxs(
-            DropdownMenuItem,
-            {
-              onSelect: () => fileInput.current?.click(),
-              "data-testid": "database-import-rows",
-              children: [
-                /* @__PURE__ */ jsx(Upload, { className: "size-4" }),
-                l.importRows
-              ]
-            }
-          ),
-          onExport && /* @__PURE__ */ jsxs(Fragment, { children: [
-            /* @__PURE__ */ jsxs(
-              DropdownMenuItem,
-              {
-                onSelect: () => onExport("xlsx"),
-                "data-testid": "database-export-xlsx",
-                children: [
-                  /* @__PURE__ */ jsx(Download, { className: "size-4" }),
-                  l.exportXlsx
-                ]
-              }
-            ),
-            /* @__PURE__ */ jsxs(
-              DropdownMenuItem,
-              {
-                onSelect: () => onExport("csv"),
-                "data-testid": "database-export-csv",
-                children: [
-                  /* @__PURE__ */ jsx(Download, { className: "size-4" }),
-                  l.exportCsv
-                ]
-              }
-            )
-          ] }),
-          !readOnly && onDeleteDatabase && /* @__PURE__ */ jsxs(Fragment, { children: [
-            /* @__PURE__ */ jsx(DropdownMenuSeparator, {}),
-            /* @__PURE__ */ jsxs(
-              DropdownMenuItem,
-              {
-                onSelect: onDeleteDatabase,
-                className: "text-red-text",
-                "data-testid": "database-delete",
-                children: [
-                  /* @__PURE__ */ jsx(Trash2, { className: "size-4" }),
-                  l.deleteDatabase
-                ]
-              }
-            )
-          ] })
-        ] })
-      ] }),
-      /* @__PURE__ */ jsx(
-        "input",
-        {
-          ref: fileInput,
-          type: "file",
-          accept: SPREADSHEET_ACCEPT,
-          className: "hidden",
-          onChange: onFile,
-          "data-testid": "database-import-rows-input"
-        }
-      )
-    ] })
-  ] });
-}
-var DEFAULT_DATABASE_COLUMN_DIALOG_LABELS = {
-  addTitle: "Add a column",
-  editTitle: "Column settings",
-  addDescription: "Pick what the column holds; every cell in it is checked against its type.",
-  editDescription: "Rename the column or change its options.",
-  name: "Name",
-  namePlaceholder: "e.g. Client, Reference, Fee",
-  type: "Type",
-  typeFixed: "A column\u2019s type can\u2019t be changed once it has been added.",
-  options: "Options",
-  optionPlaceholder: "Add an option and press Enter",
-  addOption: "Add",
-  removeOption: (option) => `Remove ${option}`,
-  needsOptions: "A select column needs at least one option.",
-  cancel: "Cancel",
-  add: "Add column",
-  save: "Save",
-  saving: "Saving\u2026",
-  delete: "Delete column",
-  confirmDelete: "Delete this column and every value in it?"
-};
-var NO_RELATION = { database_id: "", two_way: false, pair_name: "" };
-var NO_LOOKUP = { relation: "", column: "" };
-var NO_ROLLUP = { relation: "", column: "", op: "count" };
-var NO_COLUMNS = [];
-var NO_DATABASES = [];
-function configComplete(type, editing, relation, lookup, rollup) {
-  if (type === "relation") return editing || Boolean(relation.database_id);
-  if (type === "lookup") return Boolean(lookup.relation && lookup.column);
-  if (type === "rollup") return Boolean(rollup.relation && (rollup.op === "count" || rollup.column));
-  return true;
-}
-function DatabaseColumnDialog({
-  open,
-  onOpenChange,
-  column,
-  databaseId,
-  databaseName,
-  columns = NO_COLUMNS,
-  databases = NO_DATABASES,
-  onSave,
-  onDelete,
-  isSaving = false,
-  error,
-  labels,
-  typeLabels,
-  configLabels
-}) {
-  const l = { ...DEFAULT_DATABASE_COLUMN_DIALOG_LABELS, ...labels };
-  const tl = { ...DEFAULT_DATABASE_COLUMN_TYPE_LABELS, ...typeLabels };
-  const cl = { ...DEFAULT_COLUMN_CONFIG_LABELS, ...configLabels };
-  const editing = Boolean(column);
-  const [name, setName] = useState("");
-  const [type, setType] = useState("text");
-  const [options, setOptions] = useState([]);
-  const [optionDraft, setOptionDraft] = useState("");
-  const [confirmingDelete, setConfirmingDelete] = useState(false);
-  const [relation, setRelation] = useState(NO_RELATION);
-  const [lookup, setLookup] = useState(NO_LOOKUP);
-  const [rollup, setRollup] = useState(NO_ROLLUP);
-  useEffect(() => {
-    if (!open) return;
-    setName(column?.name ?? "");
-    setType(column?.type ?? "text");
-    setOptions(column?.options ?? []);
-    setOptionDraft("");
-    setConfirmingDelete(false);
-    setRelation(NO_RELATION);
-    setLookup(column?.lookup ? { ...column.lookup } : NO_LOOKUP);
-    setRollup(
-      column?.rollup ? {
-        relation: column.rollup.relation,
-        column: column.rollup.column ?? "",
-        op: column.rollup.op ?? "count"
-      } : NO_ROLLUP
-    );
-  }, [open, column]);
-  const addOption = () => {
-    const option = optionDraft.trim();
-    if (option && !options.some((o) => o.toLowerCase() === option.toLowerCase())) {
-      setOptions([...options, option]);
-    }
-    setOptionDraft("");
-  };
-  const pendingOptions = optionDraft.trim() ? [...options, optionDraft.trim()] : options;
-  const missingOptions = type === "select" && pendingOptions.length === 0;
-  const canSave = name.trim().length > 0 && !missingOptions && configComplete(type, editing, relation, lookup, rollup) && !isSaving;
-  const submit = (e) => {
-    e.preventDefault();
-    if (!canSave) return;
-    const draft = {
-      name: name.trim(),
-      type,
-      options: type === "select" ? Array.from(new Set(pendingOptions)) : null
-    };
-    if (type === "relation" && !editing)
-      draft.relation = {
-        database_id: relation.database_id,
-        two_way: relation.two_way,
-        pair_name: relation.two_way ? relation.pair_name.trim() || null : null
-      };
-    if (type === "lookup") draft.lookup = { ...lookup };
-    if (type === "rollup")
-      draft.rollup = {
-        relation: rollup.relation,
-        op: rollup.op,
-        column: rollup.op === "count" ? null : rollup.column
-      };
-    onSave(draft);
-  };
-  const onOptionKey = (e) => {
-    if (e.key === "Enter") {
-      e.preventDefault();
-      addOption();
-    }
-  };
-  return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsx(DialogContent, { className: "sm:max-w-md", "data-testid": "database-column-dialog", children: /* @__PURE__ */ jsxs("form", { onSubmit: submit, className: "flex flex-col gap-4", children: [
-    /* @__PURE__ */ jsxs(DialogHeader, { children: [
-      /* @__PURE__ */ jsx(DialogTitle, { children: editing ? l.editTitle : l.addTitle }),
-      /* @__PURE__ */ jsx(DialogDescription, { children: editing ? l.editDescription : l.addDescription })
-    ] }),
-    /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
-      /* @__PURE__ */ jsx(Label, { htmlFor: "database-column-name", children: l.name }),
-      /* @__PURE__ */ jsx(
-        Input,
-        {
-          id: "database-column-name",
-          autoFocus: true,
-          value: name,
-          maxLength: 200,
-          placeholder: l.namePlaceholder,
-          onChange: (e) => setName(e.target.value),
-          "data-testid": "database-column-name"
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
-      /* @__PURE__ */ jsx(Label, { children: l.type }),
-      /* @__PURE__ */ jsxs(
-        Select,
-        {
-          value: type,
-          onValueChange: (v) => setType(v),
-          disabled: editing,
-          children: [
-            /* @__PURE__ */ jsx(SelectTrigger, { "data-testid": "database-column-type", children: /* @__PURE__ */ jsx(SelectValue, {}) }),
-            /* @__PURE__ */ jsx(SelectContent, { children: DATABASE_COLUMN_TYPES.map((t) => {
-              const Icon = COLUMN_TYPE_ICONS[t];
-              return /* @__PURE__ */ jsx(SelectItem, { value: t, "data-testid": `database-column-type-${t}`, children: /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-2", children: [
-                /* @__PURE__ */ jsx(Icon, { className: "size-4 text-muted-foreground" }),
-                tl[t]
-              ] }) }, t);
-            }) })
-          ]
-        }
-      ),
-      editing && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: l.typeFixed })
-    ] }),
-    type === "select" && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
-      /* @__PURE__ */ jsx(Label, { htmlFor: "database-column-option", children: l.options }),
-      options.length > 0 && /* @__PURE__ */ jsx("div", { className: "flex flex-wrap gap-1.5", "data-testid": "database-column-options", children: options.map((option) => /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-0.5", children: [
-        /* @__PURE__ */ jsx(SelectChip, { value: option }),
-        /* @__PURE__ */ jsx(
-          "button",
-          {
-            type: "button",
-            "aria-label": l.removeOption(option),
-            onClick: () => setOptions(options.filter((o) => o !== option)),
-            className: "rounded p-0.5 text-muted-foreground hover:bg-muted hover:text-foreground",
-            children: /* @__PURE__ */ jsx(X, { className: "size-3" })
-          }
-        )
-      ] }, option)) }),
-      /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
-        /* @__PURE__ */ jsx(
-          Input,
-          {
-            id: "database-column-option",
-            value: optionDraft,
-            maxLength: 200,
-            placeholder: l.optionPlaceholder,
-            onChange: (e) => setOptionDraft(e.target.value),
-            onKeyDown: onOptionKey,
-            "data-testid": "database-column-option-input"
-          }
-        ),
-        /* @__PURE__ */ jsx(
-          Button,
-          {
-            type: "button",
-            variant: "outline",
-            onClick: addOption,
-            disabled: !optionDraft.trim(),
-            children: l.addOption
-          }
-        )
-      ] }),
-      missingOptions && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted-foreground", children: l.needsOptions })
-    ] }),
-    type === "relation" && /* @__PURE__ */ jsx(
-      RelationFields,
-      {
-        draft: relation,
-        onChange: setRelation,
-        databases,
-        databaseId,
-        databaseName,
-        editing,
-        column,
-        labels: cl
-      }
-    ),
-    type === "lookup" && /* @__PURE__ */ jsx(
-      LookupFields,
-      {
-        draft: lookup,
-        onChange: setLookup,
-        columns,
-        databases,
-        databaseId,
-        labels: cl
-      }
-    ),
-    type === "rollup" && /* @__PURE__ */ jsx(
-      RollupFields,
-      {
-        draft: rollup,
-        onChange: setRollup,
-        columns,
-        databases,
-        databaseId,
-        labels: cl
-      }
-    ),
-    error && /* @__PURE__ */ jsx("p", { role: "alert", className: "text-sm text-red-text", "data-testid": "database-column-error", children: error }),
-    /* @__PURE__ */ jsxs(DialogFooter, { className: "flex-row items-center gap-2 sm:justify-between", children: [
-      editing && onDelete ? confirmingDelete ? /* @__PURE__ */ jsxs("span", { className: "flex items-center gap-2 text-sm", children: [
-        /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: l.confirmDelete }),
-        /* @__PURE__ */ jsx(
-          Button,
-          {
-            type: "button",
-            variant: "destructive",
-            size: "sm",
-            onClick: onDelete,
-            "data-testid": "database-column-delete-confirm",
-            children: l.delete
-          }
-        )
-      ] }) : /* @__PURE__ */ jsxs(
-        Button,
-        {
-          type: "button",
-          variant: "ghost",
-          size: "sm",
-          onClick: () => setConfirmingDelete(true),
-          className: "gap-1.5 text-red-text",
-          "data-testid": "database-column-delete",
-          children: [
-            /* @__PURE__ */ jsx(Trash2, { className: "size-4" }),
-            l.delete
-          ]
-        }
-      ) : /* @__PURE__ */ jsx("span", {}),
-      /* @__PURE__ */ jsxs("span", { className: "flex gap-2", children: [
-        /* @__PURE__ */ jsx(Button, { type: "button", variant: "outline", onClick: () => onOpenChange(false), children: l.cancel }),
-        /* @__PURE__ */ jsx(Button, { type: "submit", disabled: !canSave, "data-testid": "database-column-save", children: isSaving ? l.saving : editing ? l.save : l.add })
-      ] })
-    ] })
-  ] }) }) });
-}
-var DEFAULT_DATABASE_LIST_LABELS = {
-  title: "Databases",
-  subtitle: "Tables your team keeps and searches \u2014 a client database, billing records, precedents.",
-  newDatabase: "New database",
-  importSpreadsheet: "Import spreadsheet",
-  importing: "Importing\u2026",
-  ownGroup: "In this workspace",
-  sharedGroup: "Shared with everyone",
-  readOnly: "Read-only",
-  rows: (n) => `${n.toLocaleString()} row${n === 1 ? "" : "s"}`,
-  columns: (n) => `${n} column${n === 1 ? "" : "s"}`,
-  emptyTitle: "No databases yet",
-  emptyMessage: "Start from a blank table, or import a spreadsheet (.xlsx or .csv) \u2014 its columns and their types come with it.",
-  loading: "Loading databases\u2026"
-};
-var SPREADSHEET_ACCEPT2 = ".csv,.xlsx,text/csv,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet";
-function DatabaseCard({
-  database,
-  onOpen,
-  l
-}) {
-  return /* @__PURE__ */ jsxs(
-    "button",
-    {
-      type: "button",
-      onClick: onOpen,
-      "data-testid": `database-card-${database.id}`,
-      className: cn(
-        "flex min-h-32 flex-col gap-2 rounded-lg border border-border bg-background p-4 text-left transition-colors",
-        "hover:border-primary/40 hover:bg-muted/40 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
-      ),
-      children: [
-        /* @__PURE__ */ jsxs("span", { className: "flex w-full items-start gap-2", children: [
-          /* @__PURE__ */ jsx(FileSpreadsheet, { className: "mt-0.5 size-5 shrink-0 text-muted-foreground", "aria-hidden": true }),
-          /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate font-medium", children: database.name }),
-          !database.editable && /* @__PURE__ */ jsxs("span", { className: "inline-flex shrink-0 items-center gap-1 rounded-full bg-muted px-2 py-0.5 text-[11px] text-muted-foreground", children: [
-            /* @__PURE__ */ jsx(Eye, { className: "size-3" }),
-            l.readOnly
-          ] })
-        ] }),
-        database.description && /* @__PURE__ */ jsx("span", { className: "line-clamp-2 text-sm text-muted-foreground", children: database.description }),
-        /* @__PURE__ */ jsxs("span", { className: "mt-auto flex w-full items-center gap-3 text-xs text-muted-foreground", children: [
-          /* @__PURE__ */ jsx("span", { children: l.rows(database.row_count) }),
-          /* @__PURE__ */ jsx("span", { children: l.columns(database.columns.length) }),
-          /* @__PURE__ */ jsx("span", { className: "ml-auto flex items-center gap-1", "aria-hidden": true, children: database.columns.slice(0, 6).map((c) => {
-            const Icon = COLUMN_TYPE_ICONS[c.type];
-            return /* @__PURE__ */ jsx(Icon, { className: "size-3.5" }, c.id);
-          }) })
-        ] })
-      ]
-    }
-  );
-}
-function DatabaseList({
-  databases,
-  onOpen,
-  onNew,
-  onImport,
-  isImporting = false,
-  isLoading = false,
-  labels
-}) {
-  const l = { ...DEFAULT_DATABASE_LIST_LABELS, ...labels };
-  const fileInput = useRef(null);
-  const own = databases.filter((d) => d.editable);
-  const shared = databases.filter((d) => !d.editable);
-  const onFile = (e) => {
-    const file = e.target.files?.[0];
-    if (file) onImport?.(file);
-    e.target.value = "";
-  };
-  const actions = /* @__PURE__ */ jsxs("span", { className: "flex gap-2", children: [
-    onImport && /* @__PURE__ */ jsxs(
-      Button,
-      {
-        variant: "outline",
-        onClick: () => fileInput.current?.click(),
-        disabled: isImporting,
-        className: "gap-1.5",
-        "data-testid": "database-import",
-        children: [
-          /* @__PURE__ */ jsx(Upload, { className: "size-4" }),
-          isImporting ? l.importing : l.importSpreadsheet
-        ]
-      }
-    ),
-    onNew && /* @__PURE__ */ jsxs(Button, { onClick: onNew, className: "gap-1.5", "data-testid": "database-new", children: [
-      /* @__PURE__ */ jsx(Plus, { className: "size-4" }),
-      l.newDatabase
-    ] })
-  ] });
-  const grid = (items) => /* @__PURE__ */ jsx("div", { className: "grid grid-cols-1 gap-3 sm:grid-cols-2 xl:grid-cols-3", children: items.map((d) => /* @__PURE__ */ jsx(DatabaseCard, { database: d, onOpen: () => onOpen(d), l }, d.id)) });
-  return /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-6 p-2 sm:p-4", "data-testid": "database-list", children: [
-    /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-start justify-between gap-3", children: [
-      /* @__PURE__ */ jsxs("div", { children: [
-        /* @__PURE__ */ jsx("h1", { className: "text-2xl font-semibold", children: l.title }),
-        /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: l.subtitle })
-      ] }),
-      actions
-    ] }),
-    isLoading ? /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: l.loading }) : databases.length === 0 ? /* @__PURE__ */ jsxs(
-      "div",
-      {
-        className: "flex flex-col items-center gap-2 rounded-lg border border-dashed border-border px-6 py-12 text-center",
-        "data-testid": "database-list-empty",
-        children: [
-          /* @__PURE__ */ jsx(FileSpreadsheet, { className: "size-8 text-muted-foreground" }),
-          /* @__PURE__ */ jsx("h3", { className: "text-lg font-medium", children: l.emptyTitle }),
-          /* @__PURE__ */ jsx("p", { className: "max-w-md text-sm text-muted-foreground", children: l.emptyMessage })
-        ]
-      }
-    ) : /* @__PURE__ */ jsxs(Fragment, { children: [
-      own.length > 0 && /* @__PURE__ */ jsxs("section", { className: "flex flex-col gap-2", children: [
-        shared.length > 0 && /* @__PURE__ */ jsx("h2", { className: "text-sm font-medium text-muted-foreground", children: l.ownGroup }),
-        grid(own)
-      ] }),
-      shared.length > 0 && /* @__PURE__ */ jsxs("section", { className: "flex flex-col gap-2", "data-testid": "database-list-shared", children: [
-        /* @__PURE__ */ jsx("h2", { className: "text-sm font-medium text-muted-foreground", children: l.sharedGroup }),
-        grid(shared)
-      ] })
-    ] }),
-    /* @__PURE__ */ jsx(
-      "input",
-      {
-        ref: fileInput,
-        type: "file",
-        accept: SPREADSHEET_ACCEPT2,
-        className: "hidden",
-        onChange: onFile,
-        "data-testid": "database-import-input"
-      }
-    )
-  ] });
-}
-var DEFAULT_NEW_DATABASE_DIALOG_LABELS = {
-  title: "New database",
-  description: "A table your workspace keeps: add columns of the kinds you need, then rows.",
-  name: "Name",
-  namePlaceholder: "e.g. Client database",
-  about: "Description",
-  aboutPlaceholder: "Optional: what it holds and who keeps it",
-  cancel: "Cancel",
-  create: "Create",
-  creating: "Creating\u2026"
-};
-function NewDatabaseDialog({
-  open,
-  onOpenChange,
-  onCreate,
-  isCreating = false,
-  error,
-  labels
-}) {
-  const l = { ...DEFAULT_NEW_DATABASE_DIALOG_LABELS, ...labels };
-  const [name, setName] = useState("");
-  const [about, setAbout] = useState("");
-  useEffect(() => {
-    if (open) {
-      setName("");
-      setAbout("");
-    }
-  }, [open]);
-  const submit = (e) => {
-    e.preventDefault();
-    if (!name.trim() || isCreating) return;
-    onCreate({ name: name.trim(), description: about.trim() || null });
-  };
-  return /* @__PURE__ */ jsx(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsx(DialogContent, { className: "sm:max-w-md", "data-testid": "new-database-dialog", children: /* @__PURE__ */ jsxs("form", { onSubmit: submit, className: "flex flex-col gap-4", children: [
-    /* @__PURE__ */ jsxs(DialogHeader, { children: [
-      /* @__PURE__ */ jsx(DialogTitle, { children: l.title }),
-      /* @__PURE__ */ jsx(DialogDescription, { children: l.description })
-    ] }),
-    /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
-      /* @__PURE__ */ jsx(Label, { htmlFor: "new-database-name", children: l.name }),
-      /* @__PURE__ */ jsx(
-        Input,
-        {
-          id: "new-database-name",
-          autoFocus: true,
-          value: name,
-          maxLength: 200,
-          placeholder: l.namePlaceholder,
-          onChange: (e) => setName(e.target.value),
-          "data-testid": "new-database-name"
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-1.5", children: [
-      /* @__PURE__ */ jsx(Label, { htmlFor: "new-database-about", children: l.about }),
-      /* @__PURE__ */ jsx(
-        Textarea,
-        {
-          id: "new-database-about",
-          value: about,
-          maxLength: 2e3,
-          rows: 2,
-          placeholder: l.aboutPlaceholder,
-          onChange: (e) => setAbout(e.target.value),
-          "data-testid": "new-database-description"
-        }
-      )
-    ] }),
-    error && /* @__PURE__ */ jsx("p", { role: "alert", className: "text-sm text-red-text", children: error }),
-    /* @__PURE__ */ jsxs(DialogFooter, { children: [
-      /* @__PURE__ */ jsx(Button, { type: "button", variant: "outline", onClick: () => onOpenChange(false), children: l.cancel }),
-      /* @__PURE__ */ jsx(
-        Button,
-        {
-          type: "submit",
-          disabled: !name.trim() || isCreating,
-          "data-testid": "new-database-create",
-          children: isCreating ? l.creating : l.create
-        }
-      )
-    ] })
-  ] }) }) });
-}
-
-export { ADD_COLUMN_COL_ID, COLUMN_TYPE_ICONS, COMPUTED_COLUMN_TYPES, DATABASE_COLUMN_TYPES, DATABASE_ROLLUP_OPS, DEFAULT_COLUMN_CONFIG_LABELS, DEFAULT_DATABASE_COLUMN_DIALOG_LABELS, DEFAULT_DATABASE_COLUMN_LABELS, DEFAULT_DATABASE_COLUMN_TYPE_LABELS, DEFAULT_DATABASE_LIST_LABELS, DEFAULT_DATABASE_ROW_DETAIL_LABELS, DEFAULT_DATABASE_TABLE_LABELS, DEFAULT_DATABASE_TOOLBAR_LABELS, DEFAULT_NEW_DATABASE_DIALOG_LABELS, DEFAULT_PICK_CELL_EDITOR_LABELS, DatabaseColumnDialog, DatabaseList, DatabaseRowDetail, DatabaseTable, DatabaseToolbar, LINK_COLUMN_TYPES, LinkChip, LinkChipsCell, LookupCell, NewDatabaseDialog, OPEN_ROW_COL_ID, PersonCell, PersonChip, PickCellEditor, SelectCellEditor, SelectChip, canEditColumn, cellIds, cellList, columnWidth, compareCells, createDatabaseColumns, formatCell, formatDateValue, formatLookupValue, formatNumberValue, isComputedColumn, optionTone, rowTitle, sameCellValue, titleOf, toApiValue };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map