@arbidocs/blocks 0.4.127 → 0.4.129

package/dist/sandboxDocument-WQUNODSC.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/artifacts/sandboxDocument.ts"],"names":["ARTIFACT_MESSAGE_TAG","ARTIFACT_CSP","transform"],"mappings":";;;;;;AAsBA,IAAM,aAAA,GAAgB,CAAA;AAAA,QAAA,EACZ,IAAA,CAAK,SAAA,CAAUA,sCAAoB,CAAC,CAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,KAAA,CAAA;AAS9C,SAAS,eAAe,SAAA,EAA2B;AACjD,EAAA,OACE,CAAA,qGAAA,EACuDC,8BAAY,CAAA,8EAAA,EAExD,aAAa,YAAY,SAAS,CAAA,aAAA,CAAA;AAEjD;AAIA,IAAM,mBAAA,GACJ,qJAAA;AAEK,SAAS,wBAAA,CAAyB,QAAgB,OAAA,EAAkC;AAEzF,EAAA,MAAM,OAAO,MAAA,CAAO,OAAA;AAAA,IAClB,mBAAA;AAAA,IACA,MAAM,CAAA,QAAA,EAAW,qBAAA,CAAsB,OAAA,CAAQ,QAAQ,CAAC,CAAA,SAAA;AAAA,GAC1D;AACA,EAAA,OAAO,cAAA,CAAe,EAAE,CAAA,GAAI,IAAA;AAC9B;AAGO,SAAS,qBAAqB,MAAA,EAAwB;AAC3D,EAAA,IAAI;AACF,IAAA,OAAOC,kBAAU,MAAA,EAAQ;AAAA,MACvB,UAAA,EAAY,CAAC,KAAA,EAAO,SAAS,CAAA;AAAA,MAC7B,UAAA,EAAY,SAAA;AAAA,MACZ,UAAA,EAAY;AAAA,KACb,CAAA,CAAE,IAAA;AAAA,EACL,SAAS,GAAA,EAAK;AACZ,IAAA,MAAM,UAAU,GAAA,YAAe,KAAA,GAAQ,GAAA,CAAI,OAAA,GAAU,OAAO,GAAG,CAAA;AAC/D,IAAA,MAAM,IAAI,MAAM,CAAA,kCAAA,EAAqC,OAAO,IAAI,EAAE,KAAA,EAAO,KAAK,CAAA;AAAA,EAChF;AACF;AAGA,SAAS,sBAAsB,IAAA,EAAsB;AACnD,EAAA,OAAO,KAAK,OAAA,CAAQ,aAAA,EAAe,YAAY,CAAA,CAAE,OAAA,CAAQ,SAAS,QAAQ,CAAA;AAC5E;AAGA,SAAS,eAAe,QAAA,EAA0B;AAChD,EAAA,OAAO,CAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOP,qBAAA,CAAsB,QAAQ,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,KAAA,CAAA;AAUjC;AAEO,SAAS,yBAAA,CAA0B,QAAgB,OAAA,EAAkC;AAC1F,EAAA,MAAM,QAAA,GAAW,qBAAqB,MAAM,CAAA;AAC5C,EAAA,MAAM,IAAA,GACJ,CAAA,QAAA,EAAW,qBAAA,CAAsB,OAAA,CAAQ,KAAK,CAAC,CAAA,iBAAA,EACpC,qBAAA,CAAsB,OAAA,CAAQ,QAAQ,CAAC,CAAA,iEAAA,CAAA;AAEpD,EAAA,OAAO,eAAe,IAAI,CAAA,GAAI,CAAA,6BAAA,EAAgC,cAAA,CAAe,QAAQ,CAAC,CAAA,SAAA,CAAA;AACxF;AAEO,SAAS,oBAAA,CACd,IAAA,EACA,MAAA,EACA,OAAA,EACQ;AACR,EAAA,OAAO,IAAA,KAAS,UACZ,yBAAA,CAA0B,MAAA,EAAQ,OAAO,CAAA,GACzC,wBAAA,CAAyB,QAAQ,OAAO,CAAA;AAC9C","file":"sandboxDocument-WQUNODSC.cjs","sourcesContent":["/**\n * Builds the document that runs inside the artifact preview iframe.\n *\n * Threat model: artifact code is written by an LLM from untrusted input and runs in\n * the user's browser next to a decrypted session. It must never reach the app.\n * Layers (each independently sufficient for the main risks):\n *   1. The iframe is sandboxed with `allow-scripts` ONLY. No `allow-same-origin`, so the\n *      frame gets an opaque origin: no access to the parent DOM, cookies, localStorage,\n *      IndexedDB or the in-memory session. No popups, forms, top navigation or downloads.\n *   2. A Content-Security-Policy with `connect-src 'none'` and no remote sources: the\n *      artifact cannot fetch, open sockets, load remote scripts/images/fonts or exfiltrate.\n *   3. JSX is compiled in the app (sucrase = text transform only), so the sandbox never\n *      needs a compiler and compile errors surface in the app UI.\n *\n * The security prefix is PREPENDED to artifact HTML, never spliced into it, so a crafted\n * comment or `<head>` in the artifact cannot move the CSP out of effect.\n */\nimport { transform } from 'sucrase'\nimport type { ArtifactPreviewKind } from '@arbidocs/react/artifacts'\nimport { ARTIFACT_CSP, ARTIFACT_MESSAGE_TAG, type ArtifactRuntime } from './sandbox-policy'\n\n// Forwards console output and uncaught errors to the app. Runs first, before artifact code.\nconst BRIDGE_SCRIPT = `(function(){\nvar TAG=${JSON.stringify(ARTIFACT_MESSAGE_TAG)};\nfunction send(m){m[TAG]=true;try{parent.postMessage(m,'*')}catch(e){}}\nfunction str(v){if(typeof v==='string')return v;if(v instanceof Error)return v.stack||v.message;try{return JSON.stringify(v)}catch(e){return String(v)}}\n['log','info','warn','error'].forEach(function(l){var o=console[l];console[l]=function(){var a=[].slice.call(arguments);send({type:'console',level:l,text:a.map(str).join(' ')});try{o.apply(console,a)}catch(e){}}});\nwindow.addEventListener('error',function(e){send({type:'error',text:(e.message||'Error')+(e.lineno?' (line '+e.lineno+')':'')})});\nwindow.addEventListener('unhandledrejection',function(e){send({type:'error',text:'Unhandled promise rejection: '+str(e.reason)})});\nwindow.__arbiArtifactSend=send;\n})();`\n\nfunction securityPrefix(extraHead: string): string {\n  return (\n    '<!doctype html><html><head><meta charset=\"utf-8\">' +\n    `<meta http-equiv=\"Content-Security-Policy\" content=\"${ARTIFACT_CSP}\">` +\n    '<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">' +\n    `<script>${BRIDGE_SCRIPT}</script>${extraHead}</head><body>`\n  )\n}\n\n// Models often include the Tailwind CDN script; there is no network in the sandbox, so replace the\n// whole element with the bundled copy.\nconst TAILWIND_CDN_SCRIPT =\n  /<script\\b[^>]*\\bsrc\\s*=\\s*[\"']https?:\\/\\/(?:cdn\\.tailwindcss\\.com|cdn\\.jsdelivr\\.net\\/npm\\/@tailwindcss\\/browser)[^\"']*[\"'][^>]*>\\s*<\\/script\\s*>/gi\n\nexport function buildHtmlSandboxDocument(source: string, runtime: ArtifactRuntime): string {\n  // A replacer function, not a string: the runtime contains `$` sequences that String.replace would expand.\n  const body = source.replace(\n    TAILWIND_CDN_SCRIPT,\n    () => `<script>${escapeForInlineScript(runtime.tailwind)}</script>`\n  )\n  return securityPrefix('') + body\n}\n\n/** Compiles an artifact's JSX file to plain JS (CommonJS), or throws with a readable message. */\nexport function compileReactArtifact(source: string): string {\n  try {\n    return transform(source, {\n      transforms: ['jsx', 'imports'],\n      jsxRuntime: 'classic',\n      production: true,\n    }).code\n  } catch (err) {\n    const message = err instanceof Error ? err.message : String(err)\n    throw new Error(`Could not compile this component: ${message}`, { cause: err })\n  }\n}\n\n/** Keeps code from terminating an inline <script> or opening an HTML comment. */\nfunction escapeForInlineScript(code: string): string {\n  return code.replace(/<\\/script/gi, '<\\\\/script').replace(/<!--/g, '<\\\\!--')\n}\n\n// Runs compiled artifact code with a tiny CommonJS shim and mounts its default export.\nfunction reactBootstrap(compiled: string): string {\n  return `(function(){\nvar send=window.__arbiArtifactSend||function(){};\nvar available={'react':window.React,'react-dom':window.ReactDOM,'react-dom/client':window.ReactDOMClient};\nfunction req(name){if(Object.prototype.hasOwnProperty.call(available,name))return available[name];throw new Error('Module \"'+name+'\" is not available in artifacts. Only \"react\" and \"react-dom\" can be imported.')}\nvar module={exports:{}};var exports=module.exports;\ntry{\n(function(require,module,exports){\n${escapeForInlineScript(compiled)}\n})(req,module,exports);\nvar App=(module.exports&&module.exports.default)||module.exports;\nif(typeof App!=='function')throw new Error('The artifact must export a React component with \"export default\".');\nvar React=window.React;\nvar Boundary=class extends React.Component{constructor(p){super(p);this.state={e:null}}static getDerivedStateFromError(e){return{e:e}}componentDidCatch(e){send({type:'error',text:String(e&&e.stack||e)})}render(){if(this.state.e)return React.createElement('pre',{style:{color:'#b91c1c',padding:'16px',whiteSpace:'pre-wrap',font:'13px/1.5 ui-monospace,monospace'}},String(this.state.e&&this.state.e.message||this.state.e));return this.props.children}};\nwindow.ReactDOMClient.createRoot(document.getElementById('root')).render(React.createElement(Boundary,null,React.createElement(App)));\nsend({type:'ready'});\n}catch(e){send({type:'error',text:String(e&&e.message||e)})}\n})();`\n}\n\nexport function buildReactSandboxDocument(source: string, runtime: ArtifactRuntime): string {\n  const compiled = compileReactArtifact(source)\n  const head =\n    `<script>${escapeForInlineScript(runtime.react)}</script>` +\n    `<script>${escapeForInlineScript(runtime.tailwind)}</script>` +\n    '<style>html,body,#root{min-height:100%;margin:0}</style>'\n  return securityPrefix(head) + `<div id=\"root\"></div><script>${reactBootstrap(compiled)}</script>`\n}\n\nexport function buildSandboxDocument(\n  kind: ArtifactPreviewKind,\n  source: string,\n  runtime: ArtifactRuntime\n): string {\n  return kind === 'react'\n    ? buildReactSandboxDocument(source, runtime)\n    : buildHtmlSandboxDocument(source, runtime)\n}\n"]}

package/dist/settings/DraggableHeader.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Wrapper that makes a header region draggable for FloatingPanel,
+ * while ignoring clicks on interactive elements (buttons, inputs, tabs, etc.).
+ */
+import React from 'react';
+export interface DraggableHeaderProps {
+    onDragStart?: (e: React.MouseEvent) => void;
+    children: React.ReactNode;
+}
+export declare function DraggableHeader({ onDragStart, children }: DraggableHeaderProps): React.JSX.Element;

package/dist/settings/FilterChip.d.ts

@@ -0,0 +1,15 @@
+import type { ReactNode } from 'react';
+import type { TriState } from './TriStateFilterMenu';
+export interface FilterChipProps {
+    label: string;
+    state: TriState;
+    icon?: ReactNode;
+    /** When provided, renders a colored pill identical to Labels column */
+    color?: string;
+    onDismiss?: () => void;
+    /** The dismiss button's accessible name (default "Remove <label>"). */
+    dismissLabel?: string;
+    className?: string;
+    testId?: string;
+}
+export declare function FilterChip({ label, state, icon, color, onDismiss, dismissLabel, className, testId, }: FilterChipProps): import("react").JSX.Element;

package/dist/settings/MessageJsonTree.d.ts

@@ -0,0 +1,7 @@
+/**
+ * MessageJsonTree: the JsonTree with the ARBI message schema hints (field names, ids, timestamps
+ * of a message and its tool outputs), for a "message details" view.
+ */
+import { type JsonTreeProps } from './JsonTree';
+export type MessageJsonTreeProps = Omit<JsonTreeProps, 'resolveHint' | 'formatValue'>;
+export declare function MessageJsonTree(props: MessageJsonTreeProps): import("react").JSX.Element;

package/dist/settings/index.cjs

@@ -145,6 +145,22 @@ function FloatingPanel({
     }
   );
 }
+var INTERACTIVE_SELECTOR = 'button, input, select, a, [role="tab"], [role="radio"]';
+function DraggableHeader({ onDragStart, children }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: "flex-shrink-0",
+      onMouseDown: onDragStart ? (e) => {
+        const target = e.target;
+        if (target.closest(INTERACTIVE_SELECTOR)) return;
+        onDragStart(e);
+      } : void 0,
+      style: onDragStart ? { cursor: "move" } : void 0,
+      children
+    }
+  );
+}
 function PanelFrame({ testId, className, children }) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
@@ -675,7 +691,7 @@ function JsonTree({
   level = 0,
   path = [],
   resolveHint,
-  formatValue
+  formatValue: formatValue2
 }) {
   const [isExpanded, setIsExpanded] = react.useState(defaultExpanded || level < 2);
   const [copied, setCopied] = react.useState(false);
@@ -703,7 +719,7 @@ function JsonTree({
   const isArray = Array.isArray(data);
   const isObject = typeof data === "object" && data !== null && !isArray;
   if (!isObject && !isArray) {
-    const displayValue = hint && formatValue ? formatValue(data, hint) : plainValue(data);
+    const displayValue = hint && formatValue2 ? formatValue2(data, hint) : plainValue(data);
     return /* @__PURE__ */ jsxRuntime.jsxs(
       "div",
       {
@@ -783,13 +799,179 @@ function JsonTree({
           level: level + 1,
           path: currentPath,
           resolveHint,
-          formatValue
+          formatValue: formatValue2
         },
         key
       );
     }) })
   ] });
 }
+
+// src/settings/message-schema-hints.ts
+var messageFieldHints = {
+  role: {
+    displayName: "Role",
+    formatType: "enum",
+    description: "Message role (user, assistant, or system)"
+  },
+  content: {
+    displayName: "Content",
+    formatType: "long-string",
+    description: "Message content text"
+  },
+  created_at: {
+    displayName: "Created At",
+    formatType: "timestamp",
+    description: "Message creation timestamp"
+  },
+  external_id: {
+    displayName: "Message ID",
+    formatType: "id",
+    description: "External message identifier"
+  },
+  conversation_ext_id: {
+    displayName: "Conversation ID",
+    formatType: "id",
+    description: "Parent conversation identifier"
+  },
+  parent_message_ext_id: {
+    displayName: "Parent Message ID",
+    formatType: "id",
+    description: "Parent message identifier (null for first message)"
+  },
+  created_by_ext_id: {
+    displayName: "Created By",
+    formatType: "id",
+    description: "User who created this message"
+  },
+  config_ext_id: {
+    displayName: "Config ID",
+    formatType: "id",
+    description: "Configuration used for this message"
+  },
+  shared: {
+    displayName: "Shared",
+    formatType: "boolean",
+    description: "Whether message is shared"
+  },
+  tools: {
+    displayName: "Tools",
+    formatType: "json",
+    description: "Tool outputs (citations, retrieval, trace)"
+  },
+  meta: {
+    displayName: "Metadata",
+    formatType: "json",
+    description: "Additional metadata"
+  }
+};
+var traceToolFieldHints = {
+  name: {
+    displayName: "Tool Name",
+    formatType: "enum",
+    description: "Execution trace tool"
+  },
+  description: {
+    displayName: "Description",
+    formatType: "string",
+    description: "Tool description"
+  },
+  trace_id: {
+    displayName: "Trace ID",
+    formatType: "id",
+    description: "Unique trace identifier"
+  },
+  start_time: {
+    displayName: "Start Time",
+    formatType: "timestamp",
+    description: "When execution started"
+  },
+  duration_seconds: {
+    displayName: "Duration (seconds)",
+    formatType: "number",
+    description: "Total execution time"
+  },
+  steps: {
+    displayName: "Execution Steps",
+    formatType: "json",
+    description: "Full execution trace with all steps"
+  }
+};
+var citationToolFieldHints = {
+  name: {
+    displayName: "Tool Name",
+    formatType: "enum",
+    description: "Model citation tool"
+  },
+  tool_responses: {
+    displayName: "Citations",
+    formatType: "json",
+    description: "Citation data mapped by citation number"
+  }
+};
+function getFieldHint(path, fieldName) {
+  if (path.length === 1 && path[0] === "message") {
+    return messageFieldHints[fieldName] || null;
+  }
+  if (path.length >= 3 && path[0] === "message" && path[1] === "tools" && path[2] === "trace") {
+    return traceToolFieldHints[fieldName] || null;
+  }
+  if (path.length >= 3 && path[0] === "message" && path[1] === "tools" && path[2] === "model_citations") {
+    return citationToolFieldHints[fieldName] || null;
+  }
+  if (fieldName === "external_id" || fieldName.endsWith("_ext_id")) {
+    return { formatType: "id", displayName: fieldName.replace(/_/g, " ") };
+  }
+  if (fieldName === "created_at" || fieldName === "updated_at" || fieldName.endsWith("_at")) {
+    return { formatType: "timestamp", displayName: fieldName.replace(/_/g, " ") };
+  }
+  if (fieldName.includes("time") && !fieldName.includes("duration")) {
+    return { formatType: "timestamp" };
+  }
+  if (fieldName.includes("duration")) {
+    return { formatType: "number", description: "Duration in seconds" };
+  }
+  if (path.length >= 2 && path[path.length - 2] === "tools" && fieldName === "trace") {
+    return {
+      displayName: "\u{1F50D} Execution Trace",
+      formatType: "json",
+      description: "Complete execution trace with all steps and timing"
+    };
+  }
+  return null;
+}
+function formatValue(value, hint) {
+  if (value === null) return "null";
+  if (value === void 0) return "undefined";
+  if (hint?.formatType === "timestamp" && typeof value === "string") {
+    try {
+      const date = new Date(value);
+      if (!isNaN(date.getTime())) {
+        return `${date.toLocaleString()} (${value})`;
+      }
+    } catch {
+    }
+  }
+  if (hint?.formatType === "timestamp" && typeof value === "number") {
+    const date = new Date(value * 1e3);
+    return `${date.toLocaleString()} (${value})`;
+  }
+  if (hint?.formatType === "id" && typeof value === "string") {
+    if (value.length > 20) {
+      return `${value.substring(0, 16)}...${value.substring(value.length - 4)}`;
+    }
+  }
+  if (typeof value === "string") {
+    if (value.length > 100) {
+      return `"${value.substring(0, 97)}..." (${value.length} chars)`;
+    }
+    return `"${value}"`;
+  }
+  return String(value);
+}
+function MessageJsonTree(props) {
+  return /* @__PURE__ */ jsxRuntime.jsx(JsonTree, { ...props, resolveHint: getFieldHint, formatValue });
+}
 var DEFAULT_TIPS_EDITOR_LABELS = {
   titleList: "Edit tips",
   titleNew: "New tip",
@@ -1310,6 +1492,64 @@ function SyncFolderStatus({
     }
   );
 }
+function FilterChip({
+  label,
+  state,
+  icon,
+  color,
+  onDismiss,
+  dismissLabel,
+  className,
+  testId
+}) {
+  const isExclude = state === "exclude";
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "span",
+    {
+      className: ui.cn(
+        "inline-flex items-center gap-1 text-xs font-medium rounded px-1.5 py-0.5 flex-shrink-0 border",
+        isExclude ? "bg-background text-red-text border-red-text" : "bg-primary text-white border-primary",
+        className
+      ),
+      "data-state": state,
+      "data-testid": testId,
+      children: [
+        color ? (
+          /* Filled square for include; empty square for exclude */
+          isExclude ? /* @__PURE__ */ jsxRuntime.jsx(
+            "span",
+            {
+              className: "w-3.5 h-3.5 rounded flex-shrink-0 border-2",
+              style: { borderColor: color }
+            }
+          ) : /* @__PURE__ */ jsxRuntime.jsx(
+            "span",
+            {
+              className: "w-3.5 h-3.5 rounded flex items-center justify-center flex-shrink-0",
+              style: { backgroundColor: color },
+              children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "w-2.5 h-2.5 text-white", strokeWidth: 3 })
+            }
+          )
+        ) : icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-none", children: icon }),
+        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "truncate max-w-[80px]", title: label, children: [
+          isExclude && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "opacity-70 mr-0.5", children: "Not" }),
+          label
+        ] }),
+        onDismiss && /* @__PURE__ */ jsxRuntime.jsx(
+          "button",
+          {
+            type: "button",
+            onClick: onDismiss,
+            "aria-label": dismissLabel ?? `Remove ${label}`,
+            className: "flex-none ml-0.5 opacity-70 hover:opacity-100",
+            "data-testid": testId ? `${testId}-remove` : void 0,
+            children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-3 w-3", strokeWidth: 2.5 })
+          }
+        )
+      ]
+    }
+  );
+}
 var planBadgeVariants = classVarianceAuthority.cva(
   "inline-flex flex-shrink-0 items-center rounded-full border font-semibold leading-none",
   {
@@ -2468,7 +2708,7 @@ function UsageLineChart({
   dates,
   series,
   formatDate,
-  formatValue,
+  formatValue: formatValue2,
   emptyLabel,
   labels
 }) {
@@ -2582,7 +2822,7 @@ function UsageLineChart({
           s.key,
           ":"
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium tabular-nums", children: formatValue(s.values[hoverIdx]) })
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-medium tabular-nums", children: formatValue2(s.values[hoverIdx]) })
       ] }, s.key))
     ] })
   ] });
@@ -3814,9 +4054,11 @@ exports.DEFAULT_USAGE_PROPORTION_BAR_LABELS = DEFAULT_USAGE_PROPORTION_BAR_LABEL
 exports.DEFAULT_WELCOME_DIALOG_LABELS = DEFAULT_WELCOME_DIALOG_LABELS;
 exports.DEFAULT_WORK_OFFLINE_LABELS = DEFAULT_WORK_OFFLINE_LABELS;
 exports.DailyCapField = DailyCapField;
+exports.DraggableHeader = DraggableHeader;
 exports.EmailWorkspaceDialogView = EmailWorkspaceDialogView;
 exports.ErrorDialogView = ErrorDialogView;
 exports.FIRM_POOL_MAX_TOP_UP = FIRM_POOL_MAX_TOP_UP;
+exports.FilterChip = FilterChip;
 exports.FirmPoolSection = FirmPoolSection;
 exports.FloatingPanel = FloatingPanel;
 exports.InlineNameEditor = InlineNameEditor;
@@ -3824,6 +4066,7 @@ exports.InviteContactsDialog = InviteContactsDialog;
 exports.InvoicesDialog = InvoicesDialog;
 exports.JsonTree = JsonTree;
 exports.MemberProjectRow = MemberProjectRow;
+exports.MessageJsonTree = MessageJsonTree;
 exports.ModelProviderLabel = ModelProviderLabel;
 exports.ModelSelectionSection = ModelSelectionSection;
 exports.PanelActionsRow = PanelActionsRow;