@arbidocs/blocks 0.4.96 → 0.4.97

package/dist/chunk-ZCOVDK2E.js

@@ -0,0 +1,153 @@
+"use client";
+import { X, Loader2 } from 'lucide-react';
+import { Button, cn } from '@arbidocs/react/ui';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+// src/components/DetailPanel.tsx
+var DEFAULT_DETAIL_PANEL_LABELS = {
+  close: "Close",
+  loading: "Loading\u2026",
+  showing: "Showing {shown} of {count}"
+};
+function DetailPanel({
+  title,
+  icon,
+  subtitle,
+  actions,
+  onClose,
+  isLoading,
+  children,
+  labels,
+  className,
+  testId = "detail-panel"
+}) {
+  const l = { ...DEFAULT_DETAIL_PANEL_LABELS, ...labels };
+  return /* @__PURE__ */ jsxs(
+    "section",
+    {
+      className: cn("flex h-full min-h-0 flex-col bg-card", className),
+      "data-slot": "detail-panel",
+      "data-testid": testId,
+      children: [
+        /* @__PURE__ */ jsxs("header", { className: "flex items-start gap-2 border-b border-border px-4 py-3", children: [
+          icon && /* @__PURE__ */ jsx("span", { className: "mt-1 shrink-0 text-muted-foreground", children: icon }),
+          /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
+            /* @__PURE__ */ jsx(
+              "h2",
+              {
+                className: "break-words text-base font-semibold leading-snug",
+                "data-testid": `${testId}-title`,
+                children: title
+              }
+            ),
+            subtitle && /* @__PURE__ */ jsx("p", { className: "mt-0.5 text-xs text-muted-foreground", children: subtitle })
+          ] }),
+          actions && /* @__PURE__ */ jsx("div", { className: "flex shrink-0 items-center gap-1", children: actions }),
+          onClose && /* @__PURE__ */ jsx(
+            Button,
+            {
+              variant: "ghost",
+              size: "icon",
+              className: "size-8 shrink-0",
+              onClick: onClose,
+              "aria-label": l.close,
+              title: l.close,
+              "data-testid": `${testId}-close`,
+              children: /* @__PURE__ */ jsx(X, { className: "size-4" })
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx("div", { className: "min-h-0 flex-1 overflow-y-auto px-4 py-4", children: isLoading ? /* @__PURE__ */ jsx(DetailLoading, { label: l.loading }) : /* @__PURE__ */ jsx(DetailBody, { children }) })
+      ]
+    }
+  );
+}
+function DetailBody({
+  children,
+  className,
+  testId
+}) {
+  return /* @__PURE__ */ jsx("div", { className: cn("flex flex-col gap-6", className), "data-testid": testId, children });
+}
+function DetailLoading({ label = DEFAULT_DETAIL_PANEL_LABELS.loading }) {
+  return /* @__PURE__ */ jsxs("p", { className: "flex items-center gap-2 text-sm text-muted-foreground", children: [
+    /* @__PURE__ */ jsx(Loader2, { className: "size-4 animate-spin" }),
+    " ",
+    label
+  ] });
+}
+function DetailSection({
+  title,
+  count,
+  shown,
+  showingLabel = DEFAULT_DETAIL_PANEL_LABELS.showing,
+  children,
+  testId
+}) {
+  return /* @__PURE__ */ jsxs("section", { className: "flex flex-col gap-2", "data-testid": testId, children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex items-baseline gap-2", children: [
+      /* @__PURE__ */ jsx("h2", { className: "text-sm font-semibold", children: title }),
+      count !== void 0 && /* @__PURE__ */ jsx("span", { className: "text-sm tabular-nums text-muted-foreground", children: count }),
+      count !== void 0 && shown !== void 0 && shown < count && /* @__PURE__ */ jsx("span", { className: "ml-auto text-xs text-muted-foreground", children: showingLabel.replace("{shown}", String(shown)).replace("{count}", String(count)) })
+    ] }),
+    children
+  ] });
+}
+function DetailFields({ children, className }) {
+  return /* @__PURE__ */ jsx(
+    "dl",
+    {
+      className: cn(
+        "grid grid-cols-1 gap-x-4 gap-y-2 sm:grid-cols-[minmax(8rem,auto)_1fr]",
+        className
+      ),
+      children
+    }
+  );
+}
+function DetailField({ label, icon, children, testId }) {
+  return /* @__PURE__ */ jsxs("div", { className: "contents", "data-testid": testId, children: [
+    /* @__PURE__ */ jsxs("dt", { className: "flex items-start gap-1.5 pt-1.5 text-sm text-muted-foreground", children: [
+      icon && /* @__PURE__ */ jsx("span", { className: "mt-0.5 shrink-0", children: icon }),
+      /* @__PURE__ */ jsx("span", { className: "min-w-0 break-words", children: label })
+    ] }),
+    /* @__PURE__ */ jsx("dd", { className: "min-w-0", children })
+  ] });
+}
+function DetailLinkList({ children }) {
+  return /* @__PURE__ */ jsx("ul", { className: "divide-y divide-border overflow-hidden rounded-lg border border-border", children });
+}
+function DetailLinkItem({
+  icon,
+  children,
+  trailing,
+  after,
+  onClick,
+  testId
+}) {
+  return /* @__PURE__ */ jsxs("li", { className: "flex items-start", children: [
+    /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        className: "flex w-full items-start gap-2 px-3 py-2 text-left text-sm transition-colors hover:bg-muted/50 disabled:hover:bg-transparent",
+        disabled: !onClick,
+        onClick,
+        "data-testid": testId,
+        children: [
+          icon && /* @__PURE__ */ jsx("span", { className: "mt-0.5 shrink-0 text-muted-foreground", children: icon }),
+          children,
+          trailing
+        ]
+      }
+    ),
+    after
+  ] });
+}
+function DetailEmpty({ children }) {
+  return /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children });
+}
+
+export { DEFAULT_DETAIL_PANEL_LABELS, DetailBody, DetailEmpty, DetailField, DetailFields, DetailLinkItem, DetailLinkList, DetailLoading, DetailPanel, DetailSection };
+//# sourceMappingURL=chunk-ZCOVDK2E.js.map
+//# sourceMappingURL=chunk-ZCOVDK2E.js.map

package/dist/chunk-ZCOVDK2E.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/DetailPanel.tsx"],"names":[],"mappings":"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","file":"chunk-ZCOVDK2E.js","sourcesContent":["/**\n * DetailPanel: one record in full, the same way for every kind of record (a tag, a database row,\n * …). The parts compose:\n *\n *   <DetailPanel title=\"Acme Ltd\" icon={…} actions={…} onClose={…}>   header + scrolling body\n *     <DetailSection title=\"Fields\">                                 a titled block (with a count)\n *       <DetailFields>                                               label / value grid\n *         <DetailField label=\"Status\">{typed editor}</DetailField>\n *       </DetailFields>\n *     </DetailSection>\n *     <DetailSection title=\"Documents\" count={12} shown={5}>\n *       <DetailLinkList>                                             linked items, each openable\n *         <DetailLinkItem icon={…} onClick={…}>Engagement letter.pdf</DetailLinkItem>\n *       </DetailLinkList>\n *     </DetailSection>\n *   </DetailPanel>\n *\n * `DetailBody` is the body alone (sections stacked, no header) for a host that has its own header,\n * like a page section. Presentational: values and edits belong to the host.\n */\nimport type { ReactNode } from 'react'\nimport { Loader2, X } from 'lucide-react'\nimport { Button, cn } from '@arbidocs/react/ui'\n\nexport interface DetailPanelLabels {\n  close: string\n  loading: string\n  /** `{shown}` of `{count}` listed. */\n  showing: string\n}\n\nexport const DEFAULT_DETAIL_PANEL_LABELS: DetailPanelLabels = {\n  close: 'Close',\n  loading: 'Loading…',\n  showing: 'Showing {shown} of {count}',\n}\n\nexport interface DetailPanelProps {\n  title: ReactNode\n  /** A glyph before the title (the record's kind). */\n  icon?: ReactNode\n  /** A quieter line under the title. */\n  subtitle?: ReactNode\n  /** Buttons on the header's right (delete, open elsewhere, …). */\n  actions?: ReactNode\n  /** Shows a close button. */\n  onClose?: () => void\n  isLoading?: boolean\n  children?: ReactNode\n  labels?: Partial<DetailPanelLabels>\n  className?: string\n  testId?: string\n}\n\n/** A record's header (title, actions, close) over its sections, which scroll. */\nexport function DetailPanel({\n  title,\n  icon,\n  subtitle,\n  actions,\n  onClose,\n  isLoading,\n  children,\n  labels,\n  className,\n  testId = 'detail-panel',\n}: DetailPanelProps) {\n  const l = { ...DEFAULT_DETAIL_PANEL_LABELS, ...labels }\n  return (\n    <section\n      className={cn('flex h-full min-h-0 flex-col bg-card', className)}\n      data-slot=\"detail-panel\"\n      data-testid={testId}\n    >\n      <header className=\"flex items-start gap-2 border-b border-border px-4 py-3\">\n        {icon && <span className=\"mt-1 shrink-0 text-muted-foreground\">{icon}</span>}\n        <div className=\"min-w-0 flex-1\">\n          <h2\n            className=\"break-words text-base font-semibold leading-snug\"\n            data-testid={`${testId}-title`}\n          >\n            {title}\n          </h2>\n          {subtitle && <p className=\"mt-0.5 text-xs text-muted-foreground\">{subtitle}</p>}\n        </div>\n        {actions && <div className=\"flex shrink-0 items-center gap-1\">{actions}</div>}\n        {onClose && (\n          <Button\n            variant=\"ghost\"\n            size=\"icon\"\n            className=\"size-8 shrink-0\"\n            onClick={onClose}\n            aria-label={l.close}\n            title={l.close}\n            data-testid={`${testId}-close`}\n          >\n            <X className=\"size-4\" />\n          </Button>\n        )}\n      </header>\n      <div className=\"min-h-0 flex-1 overflow-y-auto px-4 py-4\">\n        {isLoading ? <DetailLoading label={l.loading} /> : <DetailBody>{children}</DetailBody>}\n      </div>\n    </section>\n  )\n}\n\n/** The sections of a record, stacked (a host with its own header renders this alone). */\nexport function DetailBody({\n  children,\n  className,\n  testId,\n}: {\n  children?: ReactNode\n  className?: string\n  testId?: string\n}) {\n  return (\n    <div className={cn('flex flex-col gap-6', className)} data-testid={testId}>\n      {children}\n    </div>\n  )\n}\n\n/** The record is still loading. */\nexport function DetailLoading({ label = DEFAULT_DETAIL_PANEL_LABELS.loading }: { label?: string }) {\n  return (\n    <p className=\"flex items-center gap-2 text-sm text-muted-foreground\">\n      <Loader2 className=\"size-4 animate-spin\" /> {label}\n    </p>\n  )\n}\n\nexport interface DetailSectionProps {\n  title: ReactNode\n  /** How many there are (shown after the title). */\n  count?: number\n  /** How many are listed, when fewer than `count`: \"Showing 5 of 12\". */\n  shown?: number\n  /** The \"showing\" line, `{shown}` and `{count}` filled in. */\n  showingLabel?: string\n  children: ReactNode\n  testId?: string\n}\n\n/** A titled block of a record: its fields, or a kind of linked item. */\nexport function DetailSection({\n  title,\n  count,\n  shown,\n  showingLabel = DEFAULT_DETAIL_PANEL_LABELS.showing,\n  children,\n  testId,\n}: DetailSectionProps) {\n  return (\n    <section className=\"flex flex-col gap-2\" data-testid={testId}>\n      <div className=\"flex items-baseline gap-2\">\n        <h2 className=\"text-sm font-semibold\">{title}</h2>\n        {count !== undefined && (\n          <span className=\"text-sm tabular-nums text-muted-foreground\">{count}</span>\n        )}\n        {count !== undefined && shown !== undefined && shown < count && (\n          <span className=\"ml-auto text-xs text-muted-foreground\">\n            {showingLabel.replace('{shown}', String(shown)).replace('{count}', String(count))}\n          </span>\n        )}\n      </div>\n      {children}\n    </section>\n  )\n}\n\n/** The fields of a record: labels beside their values (stacked on a narrow screen). */\nexport function DetailFields({ children, className }: { children: ReactNode; className?: string }) {\n  return (\n    <dl\n      className={cn(\n        'grid grid-cols-1 gap-x-4 gap-y-2 sm:grid-cols-[minmax(8rem,auto)_1fr]',\n        className\n      )}\n    >\n      {children}\n    </dl>\n  )\n}\n\nexport interface DetailFieldProps {\n  label: ReactNode\n  /** A glyph before the label (the field's type). */\n  icon?: ReactNode\n  /** The value: read-only text or the field's editor. */\n  children: ReactNode\n  testId?: string\n}\n\n/** One field: its label and its value (or editor). */\nexport function DetailField({ label, icon, children, testId }: DetailFieldProps) {\n  return (\n    <div className=\"contents\" data-testid={testId}>\n      <dt className=\"flex items-start gap-1.5 pt-1.5 text-sm text-muted-foreground\">\n        {icon && <span className=\"mt-0.5 shrink-0\">{icon}</span>}\n        <span className=\"min-w-0 break-words\">{label}</span>\n      </dt>\n      <dd className=\"min-w-0\">{children}</dd>\n    </div>\n  )\n}\n\n/** Linked items (documents, facts, threads, rows), one per line. */\nexport function DetailLinkList({ children }: { children: ReactNode }) {\n  return (\n    <ul className=\"divide-y divide-border overflow-hidden rounded-lg border border-border\">\n      {children}\n    </ul>\n  )\n}\n\nexport interface DetailLinkItemProps {\n  icon?: ReactNode\n  /** The item: its name, and any quieter lines under it. */\n  children: ReactNode\n  /** Right of the item, inside its button (a date, a count). */\n  trailing?: ReactNode\n  /** Right of the item, outside its button (its own control: a popover, …). */\n  after?: ReactNode\n  /** Open the item. Without it the line is inert. */\n  onClick?: () => void\n  testId?: string\n}\n\n/** One linked item: the whole line opens it. */\nexport function DetailLinkItem({\n  icon,\n  children,\n  trailing,\n  after,\n  onClick,\n  testId,\n}: DetailLinkItemProps) {\n  return (\n    <li className=\"flex items-start\">\n      <button\n        type=\"button\"\n        className=\"flex w-full items-start gap-2 px-3 py-2 text-left text-sm transition-colors hover:bg-muted/50 disabled:hover:bg-transparent\"\n        disabled={!onClick}\n        onClick={onClick}\n        data-testid={testId}\n      >\n        {icon && <span className=\"mt-0.5 shrink-0 text-muted-foreground\">{icon}</span>}\n        {children}\n        {trailing}\n      </button>\n      {after}\n    </li>\n  )\n}\n\n/** Nothing of a kind is linked yet. */\nexport function DetailEmpty({ children }: { children: ReactNode }) {\n  return <p className=\"text-sm text-muted-foreground\">{children}</p>\n}\n"]}

package/dist/components/DetailPanel.d.ts

@@ -0,0 +1,106 @@
+/**
+ * DetailPanel: one record in full, the same way for every kind of record (a tag, a database row,
+ * …). The parts compose:
+ *
+ *   <DetailPanel title="Acme Ltd" icon={…} actions={…} onClose={…}>   header + scrolling body
+ *     <DetailSection title="Fields">                                 a titled block (with a count)
+ *       <DetailFields>                                               label / value grid
+ *         <DetailField label="Status">{typed editor}</DetailField>
+ *       </DetailFields>
+ *     </DetailSection>
+ *     <DetailSection title="Documents" count={12} shown={5}>
+ *       <DetailLinkList>                                             linked items, each openable
+ *         <DetailLinkItem icon={…} onClick={…}>Engagement letter.pdf</DetailLinkItem>
+ *       </DetailLinkList>
+ *     </DetailSection>
+ *   </DetailPanel>
+ *
+ * `DetailBody` is the body alone (sections stacked, no header) for a host that has its own header,
+ * like a page section. Presentational: values and edits belong to the host.
+ */
+import type { ReactNode } from 'react';
+export interface DetailPanelLabels {
+    close: string;
+    loading: string;
+    /** `{shown}` of `{count}` listed. */
+    showing: string;
+}
+export declare const DEFAULT_DETAIL_PANEL_LABELS: DetailPanelLabels;
+export interface DetailPanelProps {
+    title: ReactNode;
+    /** A glyph before the title (the record's kind). */
+    icon?: ReactNode;
+    /** A quieter line under the title. */
+    subtitle?: ReactNode;
+    /** Buttons on the header's right (delete, open elsewhere, …). */
+    actions?: ReactNode;
+    /** Shows a close button. */
+    onClose?: () => void;
+    isLoading?: boolean;
+    children?: ReactNode;
+    labels?: Partial<DetailPanelLabels>;
+    className?: string;
+    testId?: string;
+}
+/** A record's header (title, actions, close) over its sections, which scroll. */
+export declare function DetailPanel({ title, icon, subtitle, actions, onClose, isLoading, children, labels, className, testId, }: DetailPanelProps): import("react").JSX.Element;
+/** The sections of a record, stacked (a host with its own header renders this alone). */
+export declare function DetailBody({ children, className, testId, }: {
+    children?: ReactNode;
+    className?: string;
+    testId?: string;
+}): import("react").JSX.Element;
+/** The record is still loading. */
+export declare function DetailLoading({ label }: {
+    label?: string;
+}): import("react").JSX.Element;
+export interface DetailSectionProps {
+    title: ReactNode;
+    /** How many there are (shown after the title). */
+    count?: number;
+    /** How many are listed, when fewer than `count`: "Showing 5 of 12". */
+    shown?: number;
+    /** The "showing" line, `{shown}` and `{count}` filled in. */
+    showingLabel?: string;
+    children: ReactNode;
+    testId?: string;
+}
+/** A titled block of a record: its fields, or a kind of linked item. */
+export declare function DetailSection({ title, count, shown, showingLabel, children, testId, }: DetailSectionProps): import("react").JSX.Element;
+/** The fields of a record: labels beside their values (stacked on a narrow screen). */
+export declare function DetailFields({ children, className }: {
+    children: ReactNode;
+    className?: string;
+}): import("react").JSX.Element;
+export interface DetailFieldProps {
+    label: ReactNode;
+    /** A glyph before the label (the field's type). */
+    icon?: ReactNode;
+    /** The value: read-only text or the field's editor. */
+    children: ReactNode;
+    testId?: string;
+}
+/** One field: its label and its value (or editor). */
+export declare function DetailField({ label, icon, children, testId }: DetailFieldProps): import("react").JSX.Element;
+/** Linked items (documents, facts, threads, rows), one per line. */
+export declare function DetailLinkList({ children }: {
+    children: ReactNode;
+}): import("react").JSX.Element;
+export interface DetailLinkItemProps {
+    icon?: ReactNode;
+    /** The item: its name, and any quieter lines under it. */
+    children: ReactNode;
+    /** Right of the item, inside its button (a date, a count). */
+    trailing?: ReactNode;
+    /** Right of the item, outside its button (its own control: a popover, …). */
+    after?: ReactNode;
+    /** Open the item. Without it the line is inert. */
+    onClick?: () => void;
+    testId?: string;
+}
+/** One linked item: the whole line opens it. */
+export declare function DetailLinkItem({ icon, children, trailing, after, onClick, testId, }: DetailLinkItemProps): import("react").JSX.Element;
+/** Nothing of a kind is linked yet. */
+export declare function DetailEmpty({ children }: {
+    children: ReactNode;
+}): import("react").JSX.Element;

package/dist/connect/docx.cjs

@@ -1,10 +1,10 @@
 "use client";
 'use strict';
 
-var chunkCK6TU76J_cjs = require('../chunk-CK6TU76J.cjs');
+var chunkEHB7J6SR_cjs = require('../chunk-EHB7J6SR.cjs');
 require('../chunk-MUMH3Z6K.cjs');
-var chunkSC33PQTQ_cjs = require('../chunk-SC33PQTQ.cjs');
-require('../chunk-7RI3G5BO.cjs');
+var chunkGVOTXXZG_cjs = require('../chunk-GVOTXXZG.cjs');
+require('../chunk-HGJGALLN.cjs');
 require('../chunk-AOFATOT3.cjs');
 require('../chunk-RC25WMVB.cjs');
 require('../chunk-7UTB4PHM.cjs');
@@ -16,13 +16,13 @@ function ConnectedStreamedWordArtifact({
   fontBaseUrl,
   ...props
 }) {
-  const adapter = chunkCK6TU76J_cjs.useConnectedNativeDocxAdapter(fontBaseUrl);
-  return /* @__PURE__ */ jsxRuntime.jsx(chunkSC33PQTQ_cjs.StreamedWordArtifact, { ...props, adapter });
+  const adapter = chunkEHB7J6SR_cjs.useConnectedNativeDocxAdapter(fontBaseUrl);
+  return /* @__PURE__ */ jsxRuntime.jsx(chunkGVOTXXZG_cjs.StreamedWordArtifact, { ...props, adapter });
 }
 
 Object.defineProperty(exports, "ConnectedNativeDocxEditor", {
   enumerable: true,
-  get: function () { return chunkCK6TU76J_cjs.ConnectedNativeDocxEditor; }
+  get: function () { return chunkEHB7J6SR_cjs.ConnectedNativeDocxEditor; }
 });
 exports.ConnectedStreamedWordArtifact = ConnectedStreamedWordArtifact;
 //# sourceMappingURL=docx.cjs.map

package/dist/connect/docx.js

@@ -1,9 +1,9 @@
 "use client";
-import { useConnectedNativeDocxAdapter } from '../chunk-H4SVY5FH.js';
-export { ConnectedNativeDocxEditor } from '../chunk-H4SVY5FH.js';
+import { useConnectedNativeDocxAdapter } from '../chunk-YH6SSJDW.js';
+export { ConnectedNativeDocxEditor } from '../chunk-YH6SSJDW.js';
 import '../chunk-OYMWV45N.js';
-import { StreamedWordArtifact } from '../chunk-Y52CEKVD.js';
-import '../chunk-K27SDLLN.js';
+import { StreamedWordArtifact } from '../chunk-RSUOOMPT.js';
+import '../chunk-QIEEFBZ5.js';
 import '../chunk-D3QPYKZG.js';
 import '../chunk-AF6RDAJF.js';
 import '../chunk-AA3PT6KR.js';

package/dist/connect/index.cjs

@@ -3,21 +3,21 @@
 
 var chunk5YXG342J_cjs = require('../chunk-5YXG342J.cjs');
 var chunkXMBYDLZQ_cjs = require('../chunk-XMBYDLZQ.cjs');
-var chunkCK6TU76J_cjs = require('../chunk-CK6TU76J.cjs');
+var chunkEHB7J6SR_cjs = require('../chunk-EHB7J6SR.cjs');
 var chunkMUMH3Z6K_cjs = require('../chunk-MUMH3Z6K.cjs');
 var chunkJH6JTI76_cjs = require('../chunk-JH6JTI76.cjs');
-require('../chunk-7RI3G5BO.cjs');
+require('../chunk-HGJGALLN.cjs');
 var chunkO4YPVYPO_cjs = require('../chunk-O4YPVYPO.cjs');
-var chunkPSN4VWI7_cjs = require('../chunk-PSN4VWI7.cjs');
+var chunkLENXDIMY_cjs = require('../chunk-LENXDIMY.cjs');
 var chunkAOFATOT3_cjs = require('../chunk-AOFATOT3.cjs');
 require('../chunk-RC25WMVB.cjs');
-var chunk3WW32OUU_cjs = require('../chunk-3WW32OUU.cjs');
+var chunk3US5OIDQ_cjs = require('../chunk-3US5OIDQ.cjs');
 var chunkN26CXGXC_cjs = require('../chunk-N26CXGXC.cjs');
 var chunk7RGLTF76_cjs = require('../chunk-7RGLTF76.cjs');
-require('../chunk-7D737FLE.cjs');
 require('../chunk-DETZZBG2.cjs');
 require('../chunk-32HW2Q33.cjs');
 var chunk2EI7NCUA_cjs = require('../chunk-2EI7NCUA.cjs');
+require('../chunk-7D737FLE.cjs');
 var chunkQVBZESYQ_cjs = require('../chunk-QVBZESYQ.cjs');
 require('../chunk-ADOKTJHV.cjs');
 var chunkMP6FK43E_cjs = require('../chunk-MP6FK43E.cjs');
@@ -119,7 +119,7 @@ function ConnectedWorkspaceActivity({
     [feed.data]
   );
   return /* @__PURE__ */ jsxRuntime.jsx(
-    chunkPSN4VWI7_cjs.WorkspaceActivityList,
+    chunkLENXDIMY_cjs.WorkspaceActivityList,
     {
       ...listProps,
       items,
@@ -145,7 +145,7 @@ function ConnectedWorkspaceNotificationMenu({
   });
   if (!workspaceId) return null;
   return /* @__PURE__ */ jsxRuntime.jsx(
-    chunkPSN4VWI7_cjs.WorkspaceNotificationMenu,
+    chunkLENXDIMY_cjs.WorkspaceNotificationMenu,
     {
       ...menuProps,
       level,
@@ -164,7 +164,7 @@ function ConnectedThreadFollow({
     enabled: status === "authenticated"
   });
   if (!conversationId) return null;
-  const Control = as === "menu-item" ? chunkPSN4VWI7_cjs.ThreadFollowMenuItem : chunkPSN4VWI7_cjs.ThreadFollowButton;
+  const Control = as === "menu-item" ? chunkLENXDIMY_cjs.ThreadFollowMenuItem : chunkLENXDIMY_cjs.ThreadFollowButton;
   return /* @__PURE__ */ jsxRuntime.jsx(
     Control,
     {
@@ -290,7 +290,7 @@ function StreamedArtifact({
 }
 var STARTING = /* @__PURE__ */ new Set(["pending", "running"]);
 function formValues(step, inputs) {
-  const fields = chunk3WW32OUU_cjs.stepFields(step);
+  const fields = chunk3US5OIDQ_cjs.stepFields(step);
   if (!fields.length) return void 0;
   if (step.kind === "form")
     return Object.fromEntries(fields.map((f) => [f.name, inputs[f.name] ?? ""]));
@@ -328,7 +328,7 @@ function useWorkflowThread(workflow, options = {}) {
   const { wsId } = chunkXMBYDLZQ_cjs.useWorkspaceDocs();
   const [threadId, setThreadId] = react.useState(options.conversationId);
   const [localInputs, setLocalInputs] = react.useState(
-    () => chunk3WW32OUU_cjs.initialRunInputs(workflow, options.initialInputs)
+    () => chunk3US5OIDQ_cjs.initialRunInputs(workflow, options.initialInputs)
   );
   const [edits, setEdits] = react.useState({});
   const [localStates, setLocalStates] = react.useState({});
@@ -348,12 +348,12 @@ function useWorkflowThread(workflow, options = {}) {
   );
   const conversation = conversations.data?.find((c) => c.external_id === threadId);
   const steps = react.useMemo(
-    () => chunk3WW32OUU_cjs.workflowSteps(workflow).length > 0 ? chunk3WW32OUU_cjs.workflowSteps(workflow) : chunk3WW32OUU_cjs.fromPlanSteps(conversation?.plan?.steps ?? []),
+    () => chunk3US5OIDQ_cjs.workflowSteps(workflow).length > 0 ? chunk3US5OIDQ_cjs.workflowSteps(workflow) : chunk3US5OIDQ_cjs.fromPlanSteps(conversation?.plan?.steps ?? []),
     [workflow, conversation?.plan?.steps]
   );
   const activity = react$1.useConversationActivity(threadId, { live: !!threadId });
   const serverStates = react.useMemo(
-    () => chunk3WW32OUU_cjs.stepStatesFromActivity(activity.data ?? []),
+    () => chunk3US5OIDQ_cjs.stepStatesFromActivity(activity.data ?? []),
     [activity.data]
   );
   const working = steps.some(
@@ -396,7 +396,7 @@ function useWorkflowThread(workflow, options = {}) {
     async (values, done) => {
       await ensureWorkspaceOpen();
       const created = await createWork.mutateAsync({
-        title: chunk3WW32OUU_cjs.runThreadTitle(workflow, values).slice(0, 60),
+        title: chunk3US5OIDQ_cjs.runThreadTitle(workflow, values).slice(0, 60),
         description: workflow.description || null,
         prompt: null,
         skill_ref: null,
@@ -408,7 +408,7 @@ function useWorkflowThread(workflow, options = {}) {
           criteria: [],
           max_passes: 3,
           documents: [],
-          steps: chunk3WW32OUU_cjs.toPlanSteps(workflow, {
+          steps: chunk3US5OIDQ_cjs.toPlanSteps(workflow, {
             inputs: values,
             resolveWorkflow: options.resolveWorkflow,
             compose: options.compose
@@ -495,7 +495,7 @@ function useWorkflowThread(workflow, options = {}) {
   const anyRunning = Object.values(states).some((s) => s.status === "running");
   const needsStart = !threadId || idle && !anyRunning;
   const runError = idle ? conversation?.last_error ?? null : null;
-  const view = chunk3WW32OUU_cjs.useWorkflowView({
+  const view = chunk3US5OIDQ_cjs.useWorkflowView({
     steps,
     states,
     inputs,
@@ -576,7 +576,7 @@ function WorkflowSignDialog({
   const arbi = react$1.useArbi();
   const { user, ensureWorkspaceOpen } = chunkMUMH3Z6K_cjs.useConnection();
   const tools = documentTools.useOptionalDocumentTools();
-  const { id, version: stepVersion } = chunk3WW32OUU_cjs.splitDocRef(docRef);
+  const { id, version: stepVersion } = chunk3US5OIDQ_cjs.splitDocRef(docRef);
   const [version, setVersion] = react.useState(stepVersion);
   const [pdf, setPdf] = react.useState(null);
   const [preparing, setPreparing] = react.useState(false);
@@ -654,7 +654,7 @@ function WorkflowWordDialog({
   onClose,
   labels
 }) {
-  const { id } = chunk3WW32OUU_cjs.splitDocRef(docRef);
+  const { id } = chunk3US5OIDQ_cjs.splitDocRef(docRef);
   return /* @__PURE__ */ jsxRuntime.jsx(
     chunkULWRNGGE_cjs.ModalScaffold,
     {
@@ -663,7 +663,7 @@ function WorkflowWordDialog({
       title: title ?? labels.wordTitle,
       size: "xl",
       testId: "workflow-word-dialog",
-      children: /* @__PURE__ */ jsxRuntime.jsx(chunkULWRNGGE_cjs.ModalScaffold.Body, { className: "h-[70dvh] p-0", children: /* @__PURE__ */ jsxRuntime.jsx(chunkCK6TU76J_cjs.ConnectedNativeDocxEditor, { documentId: id, title: title ?? labels.wordTitle }) })
+      children: /* @__PURE__ */ jsxRuntime.jsx(chunkULWRNGGE_cjs.ModalScaffold.Body, { className: "h-[70dvh] p-0", children: /* @__PURE__ */ jsxRuntime.jsx(chunkEHB7J6SR_cjs.ConnectedNativeDocxEditor, { documentId: id, title: title ?? labels.wordTitle }) })
     }
   );
 }
@@ -826,7 +826,7 @@ function ConnectedWorkflowRunner({
     () => ({
       me: user?.externalId,
       openDocument: onOpenDocument && ((ref) => {
-        const { id, version } = chunk3WW32OUU_cjs.splitDocRef(ref);
+        const { id, version } = chunk3US5OIDQ_cjs.splitDocRef(ref);
         onOpenDocument(id, version);
       }),
       openDraft: onOpenDraft && ((draftId) => onOpenDraft(draftId)),
@@ -836,7 +836,7 @@ function ConnectedWorkflowRunner({
         const w = state.waiting;
         if (w?.doc_ext_id) setDialog({ kind: "sign", docRef: w.doc_ext_id });
       }),
-      openRedline: hostActions?.openRedline ?? ((ref) => setDialog({ kind: "word", docRef: ref, title: nameOfDoc(chunk3WW32OUU_cjs.splitDocRef(ref).id) ?? "" })),
+      openRedline: hostActions?.openRedline ?? ((ref) => setDialog({ kind: "word", docRef: ref, title: nameOfDoc(chunk3US5OIDQ_cjs.splitDocRef(ref).id) ?? "" })),
       openReview: hostActions?.openReview ?? ((tags, documents) => setDialog({ kind: "review", tags, documents }))
     }),
     [user?.externalId, onOpenDocument, onOpenDraft, onOpenMessage, hostActions, nameOfDoc, inThread]
@@ -972,7 +972,7 @@ function ConnectedWorkflowRunner({
     );
   };
   const runner = (compact) => /* @__PURE__ */ jsxRuntime.jsx(
-    chunk3WW32OUU_cjs.WorkflowRunner,
+    chunk3US5OIDQ_cjs.WorkflowRunner,
     {
       people,
       ...runnerProps,
@@ -1018,10 +1018,10 @@ function ConnectedWorkflowRunner({
     ) }),
     inThread && conversationId ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
       /* @__PURE__ */ jsxRuntime.jsx(
-        chunk3WW32OUU_cjs.WorkflowStepBar,
+        chunk3US5OIDQ_cjs.WorkflowStepBar,
         {
           run: view,
-          levels: chunk3WW32OUU_cjs.stepLevels(view.steps),
+          levels: chunk3US5OIDQ_cjs.stepLevels(view.steps),
           doneTitle: (workflow.run.kind === "steps" ? workflow.run.completion?.title : void 0) ?? runnerProps.labels?.complete ?? "Done",
           icon: (key) => key && runnerProps.renderIcon ? runnerProps.renderIcon(key) : void 0,
           tid: (suffix) => `${testIdPrefix}-${suffix}`
@@ -1202,7 +1202,7 @@ function ConnectedTagTable({
   const fail = (e) => setError(e instanceof Error ? e.message : String(e));
   const snapshot = (data) => {
     const title = exportTitle ?? KIND_TITLES[kind];
-    const bytes = chunkPSN4VWI7_cjs.tagTableDocx(data, {
+    const bytes = chunkLENXDIMY_cjs.tagTableDocx(data, {
       title,
       nameOf: (id) => people.find((p) => p.value === id)?.label
     });
@@ -1212,7 +1212,7 @@ function ConnectedTagTable({
   };
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
     /* @__PURE__ */ jsxRuntime.jsx(
-      chunkPSN4VWI7_cjs.TagTable,
+      chunkLENXDIMY_cjs.TagTable,
       {
         ...props,
         table,

package/dist/connect/index.js

@@ -2,22 +2,22 @@
 import { SettingsSection, ProfileCard, AvatarPicker, IdentityVerificationCard, IdentityVerificationDialog, RequireVerified, SettingsCard, SettingsActionRow, PasswordChangeDialog, EMAIL_NOTIFICATION_KEYS, EMAIL_NOTIFICATION_CATEGORIES, NotificationCategoryList, toNotificationCategories, toActiveSessionViews, SettingsRow, ActiveSessionsDialog, LogoutDialog, toLogoutSessionViews, SettingsDangerZone, DeleteAccountDialog, toDeleteBlockerViews } from '../chunk-W7NZRZ54.js';
 import { useWorkspaceDocs } from '../chunk-XQDM6T6C.js';
 export { ConnectedAssistantDock, redlineStats, textToArtifact, toRedlineMarkdown, useConnectedAiTask, useConnectedChat, useSemanticSearch, useWorkspaceDocs } from '../chunk-XQDM6T6C.js';
-import { ConnectedNativeDocxEditor } from '../chunk-H4SVY5FH.js';
+import { ConnectedNativeDocxEditor } from '../chunk-YH6SSJDW.js';
 import { ConnectionProvider, useConnection } from '../chunk-OYMWV45N.js';
 export { ConnectionProvider, SESSION_EXPIRED_MESSAGE, isAuthenticated, useConnection } from '../chunk-OYMWV45N.js';
 import { SignDocumentDialog } from '../chunk-2YOVK524.js';
-import '../chunk-K27SDLLN.js';
+import '../chunk-QIEEFBZ5.js';
 import { FilesFilterBar, FolderFilterButton, FolderPickerRow } from '../chunk-7RJTEWYM.js';
-import { WorkspaceActivityList, WorkspaceNotificationMenu, ThreadFollowMenuItem, ThreadFollowButton, TagTable, tagTableDocx } from '../chunk-JID3CZSY.js';
+import { WorkspaceActivityList, WorkspaceNotificationMenu, ThreadFollowMenuItem, ThreadFollowButton, TagTable, tagTableDocx } from '../chunk-Z3G65XHZ.js';
 import { DOCX_MIME_TYPE } from '../chunk-D3QPYKZG.js';
 import '../chunk-AF6RDAJF.js';
-import { splitDocRef, WorkflowStepBar, stepLevels, WorkflowRunner, initialRunInputs, workflowSteps, fromPlanSteps, stepStatesFromActivity, toPlanSteps, runThreadTitle, useWorkflowView, stepFields } from '../chunk-SF4BDUZS.js';
+import { splitDocRef, WorkflowStepBar, stepLevels, WorkflowRunner, initialRunInputs, workflowSteps, fromPlanSteps, stepStatesFromActivity, toPlanSteps, runThreadTitle, useWorkflowView, stepFields } from '../chunk-PGDL26TQ.js';
 import { TriStateFilterMenu } from '../chunk-6S5FLMWG.js';
 import { TabHeader } from '../chunk-4WWM3GQ5.js';
-import '../chunk-XD2M6LIG.js';
 import '../chunk-EVUEIBNU.js';
 import '../chunk-AUS3KBHJ.js';
 import { FilterInput } from '../chunk-YU2KUMGE.js';
+import '../chunk-XD2M6LIG.js';
 import { StreamedArtifactFrame } from '../chunk-LOJVUGBJ.js';
 import '../chunk-VILAPTCB.js';
 import { ChatPage } from '../chunk-EWSEQEPL.js';

package/dist/databases/DatabaseRowDetail.d.ts

@@ -0,0 +1,32 @@
+import { type DatabaseColumnView, type DatabaseRowView } from './column-types';
+import { type DatabaseCellSources } from './linkCells';
+export interface DatabaseRowDetailLabels {
+    untitled: string;
+    fields: string;
+    documents: string;
+    noDocuments: string;
+    /** An empty cell that can be filled in. */
+    empty: string;
+    deleteRow: string;
+    close: string;
+    /** Under a computed (lookup / rollup) field. */
+    computed: string;
+}
+export declare const DEFAULT_DATABASE_ROW_DETAIL_LABELS: DatabaseRowDetailLabels;
+export interface DatabaseRowDetailProps {
+    /** The row (absent while it loads). */
+    row: DatabaseRowView | undefined;
+    columns: DatabaseColumnView[];
+    /** A field edited here: the value is in the API's form (`null` empties the cell). */
+    onChange?: (row: DatabaseRowView, columnId: string, value: unknown) => void;
+    /** The pickers' choices and what a document opens (the grid's sources). */
+    sources?: DatabaseCellSources;
+    onDelete?: (row: DatabaseRowView) => void;
+    onClose?: () => void;
+    readOnly?: boolean;
+    locale?: string;
+    labels?: Partial<DatabaseRowDetailLabels>;
+    className?: string;
+    testId?: string;
+}
+export declare function DatabaseRowDetail({ row, columns, onChange, sources, onDelete, onClose, readOnly, locale, labels, className, testId, }: DatabaseRowDetailProps): import("react").JSX.Element;

package/dist/databases/DatabaseTable.d.ts

@@ -19,6 +19,8 @@ export interface DatabaseTableProps {
     onAddRow?: () => void;
     onAddColumn?: () => void;
     onEditColumn?: (column: DatabaseColumnView) => void;
+    /** Open a row in full (its detail): a leading column of "open" buttons. */
+    onOpenRow?: (row: DatabaseRowView) => void;
     /**
      * Choices for person, document and relation cells (workspace members, documents, a search of
      * the related database's rows) and what a document chip opens. Keep it stable (memoise it): the
@@ -42,4 +44,4 @@ export interface DatabaseTableProps {
     gridProps?: Partial<Omit<GridViewProps<DatabaseRowView>, 'items' | 'columnDefs' | 'getItemId'>>;
     testId?: string;
 }
-export declare function DatabaseTable({ columns, rows, onCellChange, onAddRow, onAddColumn, onEditColumn, sources, onSelectionChange, selected, readOnly, isFiltered, isLoading, locale, gridId, height, labels, columnLabels, gridProps, testId, }: DatabaseTableProps): import("react").JSX.Element;
+export declare function DatabaseTable({ columns, rows, onCellChange, onAddRow, onAddColumn, onEditColumn, onOpenRow, sources, onSelectionChange, selected, readOnly, isFiltered, isLoading, locale, gridId, height, labels, columnLabels, gridProps, testId, }: DatabaseTableProps): import("react").JSX.Element;

package/dist/databases/DatabaseToolbar.d.ts

@@ -1,3 +1,9 @@
+/**
+ * DatabaseToolbar: the header of an open database. Back to the list, the database's name (rename
+ * in place), its row count, a search box, the saved-views menu, the bulk delete for ticked rows, and the import/export
+ * menu. A database of another workspace is read-only here and says where to edit it.
+ */
+import { type ReactNode } from 'react';
 export type DatabaseExportFormat = 'csv' | 'xlsx';
 export interface DatabaseToolbarLabels {
     back: string;
@@ -33,6 +39,8 @@ export interface DatabaseToolbarProps {
     /** Delete the whole database (the host confirms first). */
     onDeleteDatabase?: () => void;
     readOnly?: boolean;
+    /** The saved-views menu (`ViewSelectorMenu`, as the Files table has), beside the search. */
+    views?: ReactNode;
     labels?: Partial<DatabaseToolbarLabels>;
 }
-export declare function DatabaseToolbar({ name, description, total, shown, search, onSearchChange, onBack, onRename, selectedCount, onDeleteSelected, onImportRows, onExport, onDeleteDatabase, readOnly, labels, }: DatabaseToolbarProps): import("react").JSX.Element;
+export declare function DatabaseToolbar({ name, description, total, shown, search, onSearchChange, onBack, onRename, selectedCount, onDeleteSelected, onImportRows, onExport, onDeleteDatabase, readOnly, views, labels, }: DatabaseToolbarProps): import("react").JSX.Element;

package/dist/databases/PickCellEditor.d.ts

@@ -18,4 +18,11 @@ export interface PickCellEditorParams {
     search?: (q: string) => Promise<DatabasePickOption[]>;
     labels?: Partial<PickCellEditorLabels>;
 }
-export declare function PickCellEditor(props: CustomCellEditorProps<DatabaseRowView> & PickCellEditorParams): import("react").JSX.Element;
+/**
+ * What the editor reads of AG Grid's editor props: the value, a setter, a close and the row (whose
+ * `titles` name the chosen ids). A host outside the grid (a row's detail panel) passes just these.
+ */
+export type PickCellEditorProps = Pick<CustomCellEditorProps<DatabaseRowView>, 'value' | 'onValueChange' | 'stopEditing'> & {
+    data?: DatabaseRowView;
+} & PickCellEditorParams;
+export declare function PickCellEditor(props: PickCellEditorProps): import("react").JSX.Element;