@vertesia/ui 1.5.0-dev.20260807.073259Z → 1.5.0-dev.20260901.005903Z

package/src/shell/apps/iframe-auth.ts

@@ -0,0 +1,193 @@
+import { SUPPORTED_LANGUAGES, type SupportedLanguage } from '../../i18n/rtl.js';
+
+export const IFRAME_AUTH_REQUEST = 'vertesia:iframe-auth-request';
+export const IFRAME_AUTH_RESPONSE = 'vertesia:iframe-auth-response';
+export const IFRAME_APP_CONTEXT_REQUEST = 'vertesia:iframe-context-request';
+export const IFRAME_APP_CONTEXT = 'vertesia:iframe-context';
+export const IFRAME_APP_NAVIGATE = 'vertesia:iframe-navigate';
+export const IFRAME_APP_LOCATION_CHANGE = 'vertesia:iframe-location-change';
+export const IFRAME_APP_SLOT_PARAM = '__vertesia_slot';
+export const IFRAME_APP_HOST_ORIGIN_PARAM = '__vertesia_host_origin';
+export const IFRAME_APP_CONTENT_SLOT = 'content';
+
+export interface IframeAuthRequest {
+    type: typeof IFRAME_AUTH_REQUEST;
+    requestId: string;
+}
+
+export interface IframeAuthResponse {
+    type: typeof IFRAME_AUTH_RESPONSE;
+    requestId: string;
+    token?: string;
+}
+
+export interface IframeAppContextRequest {
+    type: typeof IFRAME_APP_CONTEXT_REQUEST;
+}
+
+export interface IframeAppContext {
+    type: typeof IFRAME_APP_CONTEXT;
+    theme: 'dark' | 'light' | 'system';
+    language: SupportedLanguage;
+}
+
+export interface IframeAppNavigate {
+    type: typeof IFRAME_APP_NAVIGATE;
+    url: string;
+}
+
+export interface IframeAppLocationChange {
+    type: typeof IFRAME_APP_LOCATION_CHANGE;
+    url: string;
+}
+
+export function isIframeAuthRequest(value: unknown): value is IframeAuthRequest {
+    if (!value || typeof value !== 'object') return false;
+    const message = value as Partial<IframeAuthRequest>;
+    return message.type === IFRAME_AUTH_REQUEST && typeof message.requestId === 'string' && !!message.requestId;
+}
+
+export function isIframeAuthResponse(value: unknown): value is IframeAuthResponse {
+    if (!value || typeof value !== 'object') return false;
+    const message = value as Partial<IframeAuthResponse>;
+    return (
+        message.type === IFRAME_AUTH_RESPONSE &&
+        typeof message.requestId === 'string' &&
+        !!message.requestId &&
+        (message.token === undefined || typeof message.token === 'string')
+    );
+}
+
+export function isIframeAppContextRequest(value: unknown): value is IframeAppContextRequest {
+    if (!value || typeof value !== 'object') return false;
+    return (value as Partial<IframeAppContextRequest>).type === IFRAME_APP_CONTEXT_REQUEST;
+}
+
+export function isIframeAppContext(value: unknown): value is IframeAppContext {
+    if (!value || typeof value !== 'object') return false;
+    const message = value as Partial<IframeAppContext>;
+    return (
+        message.type === IFRAME_APP_CONTEXT &&
+        (message.theme === 'dark' || message.theme === 'light' || message.theme === 'system') &&
+        typeof message.language === 'string' &&
+        (SUPPORTED_LANGUAGES as readonly string[]).includes(message.language)
+    );
+}
+
+export function isIframeAppNavigate(value: unknown): value is IframeAppNavigate {
+    if (!value || typeof value !== 'object') return false;
+    const message = value as Partial<IframeAppNavigate>;
+    return message.type === IFRAME_APP_NAVIGATE && typeof message.url === 'string' && !!message.url;
+}
+
+export function isIframeAppLocationChange(value: unknown): value is IframeAppLocationChange {
+    if (!value || typeof value !== 'object') return false;
+    const message = value as Partial<IframeAppLocationChange>;
+    return message.type === IFRAME_APP_LOCATION_CHANGE && typeof message.url === 'string' && !!message.url;
+}
+
+const LOOPBACK_HOSTS = new Set(['localhost', '127.0.0.1', '[::1]']);
+
+function parseHttpOrigin(value: string | null | undefined): URL | undefined {
+    if (!value) return undefined;
+    try {
+        const url = new URL(value);
+        const isLoopback = LOOPBACK_HOSTS.has(url.hostname);
+        return url.protocol === 'https:' || (url.protocol === 'http:' && isLoopback) ? url : undefined;
+    } catch {
+        return undefined;
+    }
+}
+
+function hasEmbeddedCredentials(value: string | null | undefined): boolean {
+    if (!value) return false;
+    const normalized = value.trim();
+    const schemeEnd = normalized.indexOf('://');
+    if (schemeEnd < 0) return false;
+
+    const authorityStart = schemeEnd + 3;
+    const authoritySuffix = normalized.slice(authorityStart);
+    const authorityEnd = authoritySuffix.search(/[/?#]/);
+    const authority = authorityEnd < 0 ? authoritySuffix : authoritySuffix.slice(0, authorityEnd);
+    return authority.includes('@');
+}
+
+function isVertesiaStudioHost(host: string): boolean {
+    if (host === 'studio.vertesia.io') return true;
+
+    const labels = host.split('.');
+    if (labels.at(-2) !== 'vertesia' || labels.at(-1) !== 'io') return false;
+
+    const platformLabels = labels.slice(0, -2);
+    const cloudIndex = platformLabels.lastIndexOf('cloud');
+    if (cloudIndex >= 0 && platformLabels.length - cloudIndex <= 2) return true;
+
+    const uiIndex = platformLabels.lastIndexOf('ui');
+    return uiIndex >= 0 && platformLabels.length - uiIndex === 2;
+}
+
+function parseTrustedIframeHostOrigin(value: string | null | undefined): string | undefined {
+    if (hasEmbeddedCredentials(value)) return undefined;
+    const url = parseHttpOrigin(value);
+    if (!url) return undefined;
+
+    const host = url.hostname;
+    const isStudioHost = isVertesiaStudioHost(host);
+    const isLocalDevelopment = LOOPBACK_HOSTS.has(host) && LOOPBACK_HOSTS.has(window.location.hostname);
+    return (url.protocol === 'https:' && isStudioHost) || isLocalDevelopment ? url.origin : undefined;
+}
+
+/**
+ * Resolve a trusted embedding Studio origin without relying on referrer surviving a reload or auth redirect.
+ * The URL value is a continuity hint rather than a trust anchor: only Studio UI host patterns are accepted, and
+ * loopback parents are accepted only when the child app is also running on loopback.
+ */
+export function resolveIframeHostOrigin(): string | undefined {
+    if (window.parent === window) return undefined;
+
+    const explicitOrigin = parseTrustedIframeHostOrigin(
+        new URL(window.location.href).searchParams.get(IFRAME_APP_HOST_ORIGIN_PARAM),
+    );
+    if (explicitOrigin) return explicitOrigin;
+
+    return parseTrustedIframeHostOrigin(document.referrer);
+}
+
+/**
+ * Ask an embedding Studio window for a fresh Vertesia token. Both sides validate the request nonce,
+ * source window, and exact origin. The explicit host-origin parameter survives framed redirects and
+ * hard navigations; referrer remains a compatibility fallback for older hosts.
+ * Standalone/top-level apps return undefined and continue through the normal sign-in flow.
+ */
+export function requestIframeHostAuthToken(timeoutMs = 5000): Promise<string | undefined> {
+    const parentOrigin = resolveIframeHostOrigin();
+    if (!parentOrigin) return Promise.resolve(undefined);
+
+    const requestId = crypto.randomUUID();
+    return new Promise((resolve) => {
+        let timeout: number;
+        let retry: number;
+        let retryDelay = 250;
+        const finish = (token?: string) => {
+            window.removeEventListener('message', onMessage);
+            clearTimeout(timeout);
+            clearTimeout(retry);
+            resolve(token);
+        };
+        const onMessage = (event: MessageEvent<unknown>) => {
+            if (event.source !== window.parent || event.origin !== parentOrigin || !isIframeAuthResponse(event.data)) {
+                return;
+            }
+            if (event.data.requestId === requestId && event.data.token) finish(event.data.token);
+        };
+        const request = { type: IFRAME_AUTH_REQUEST, requestId } satisfies IframeAuthRequest;
+        const sendRequest = () => {
+            window.parent.postMessage(request, parentOrigin);
+            retry = window.setTimeout(sendRequest, retryDelay);
+            retryDelay = Math.min(retryDelay * 2, 1000);
+        };
+        timeout = window.setTimeout(() => finish(), timeoutMs);
+        window.addEventListener('message', onMessage);
+        sendRequest();
+    });
+}

package/src/shell/apps/index.ts

@@ -1,3 +1,5 @@
 export * from './AppInstallationProvider';
 export * from './AppProjectSelector';
+export * from './IframeAppContextSync';
+export * from './iframe-auth';
 export * from './StandaloneApp';

package/src/widgets/markdown/ArtifactEditingSurface.test.tsx

@@ -44,6 +44,7 @@ function renderSurface(props?: {
     onSendChangesToAgent?: () => void;
     hasUnsentChanges?: boolean;
     toolbarStatus?: React.ReactNode;
+    onContentChange?: (content: string, generation?: string) => void;
     flushChangesRef?: React.MutableRefObject<(() => Promise<false | ArtifactEditingSurfaceDocumentEdit>) | null>;
 }) {
     return render(
@@ -61,6 +62,7 @@ function renderSurface(props?: {
                 onSendChangesToAgent={props?.onSendChangesToAgent}
                 hasUnsentChanges={props?.hasUnsentChanges}
                 toolbarStatus={props?.toolbarStatus}
+                onContentChange={props?.onContentChange}
                 flushChangesRef={props?.flushChangesRef}
             />
         </I18nProvider>,
@@ -292,6 +294,7 @@ describe('ArtifactEditingSurface', () => {
 
     it('rebases focused full-document edits over a non-overlapping agent change after 412', async () => {
         const user = userEvent.setup();
+        const onContentChange = vi.fn();
         const baseContent = 'First paragraph.\n\nSecond paragraph.';
         const remoteContent = 'First paragraph updated remotely.\n\nSecond paragraph.';
         mocks.getArtifactContent
@@ -314,16 +317,22 @@ describe('ArtifactEditingSurface', () => {
             .mockRejectedValueOnce({ status: 412 })
             .mockResolvedValueOnce({ path: 'drafts/document.md', generation: 'generation-merged' });
 
-        const view = renderSurface({ viewMode: 'document' });
+        const view = renderSurface({ viewMode: 'document', onContentChange });
         const editor = await screen.findByRole('textbox', { name: 'Markdown document editor' }, LAZY_EDITOR_WAIT);
         await user.click(editor);
 
         view.rerender(
             <I18nProvider lng="en">
-                <ArtifactEditingSurface runId="run-1" path="drafts/document.md" refreshKey={1} viewMode="document" />
+                <ArtifactEditingSurface
+                    runId="run-1"
+                    path="drafts/document.md"
+                    refreshKey={1}
+                    viewMode="document"
+                    onContentChange={onContentChange}
+                />
             </I18nProvider>,
         );
-        await waitFor(() => expect(mocks.getArtifactContent).toHaveBeenCalledTimes(2));
+        await waitFor(() => expect(onContentChange).toHaveBeenCalledWith(remoteContent, 'generation-agent'));
 
         editor.focus();
         const secondParagraphText = editor.querySelectorAll('p')[1]?.firstChild;

package/src/widgets/markdown/MarkdownRenderer.tsx

@@ -1,7 +1,6 @@
 import type { Element } from 'hast';
 import React from 'react';
 import Markdown, { type Components, defaultUrlTransform } from 'react-markdown';
-import rehypeKatex from 'rehype-katex';
 import { defListHastHandlers, remarkDefinitionList } from 'remark-definition-list';
 import remarkDirective from 'remark-directive';
 import remarkGfm from 'remark-gfm';
@@ -24,6 +23,55 @@ type MarkdownTree = Parameters<typeof visit>[0];
 type MarkdownNode = { value?: unknown };
 type MarkdownParent = { children?: unknown[] };
 type RemarkPluginList = NonNullable<React.ComponentProps<typeof Markdown>['remarkPlugins']>;
+type RehypePluginList = NonNullable<React.ComponentProps<typeof Markdown>['rehypePlugins']>;
+type RehypePlugin = RehypePluginList[number];
+
+// A `$` that the math preprocessor left unescaped — the only way remark-math can produce a math
+// node. Currency is escaped to `\$` by `preprocessMathDelimiters`, so it does not match.
+const MATH_DELIMITER_REGEX = /(?:^|[^\\])\$/;
+const NO_REHYPE_PLUGINS: RehypePluginList = [];
+
+let rehypeKatex: RehypePlugin | undefined;
+let rehypeKatexPromise: Promise<RehypePlugin> | undefined;
+
+function loadRehypeKatex(): Promise<RehypePlugin> {
+    if (!rehypeKatexPromise) {
+        rehypeKatexPromise = import('rehype-katex').then(({ default: plugin }) => {
+            rehypeKatex = plugin;
+            return plugin;
+        });
+    }
+    return rehypeKatexPromise;
+}
+
+/**
+ * KaTeX is ~250 KB and most markdown has no math in it, so it is fetched the first time a document
+ * containing math delimiters is rendered. Until it resolves, math renders unstyled; once loaded it
+ * stays loaded for the rest of the session and later renderers pick it up without a second pass.
+ */
+function useRehypePlugins(markdown: string): RehypePluginList {
+    const hasMath = React.useMemo(() => MATH_DELIMITER_REGEX.test(markdown), [markdown]);
+    const [plugin, setPlugin] = React.useState(() => rehypeKatex);
+
+    React.useEffect(() => {
+        if (!hasMath || plugin) return;
+        let cancelled = false;
+        loadRehypeKatex()
+            .then((loaded) => {
+                if (!cancelled) {
+                    setPlugin(() => loaded);
+                }
+            })
+            .catch((err: unknown) => {
+                console.error('Failed to load KaTeX; math will render unstyled', err);
+            });
+        return () => {
+            cancelled = true;
+        };
+    }, [hasMath, plugin]);
+
+    return React.useMemo(() => (plugin ? [plugin] : NO_REHYPE_PLUGINS), [plugin]);
+}
 
 // Custom URL schemes that we handle in our components
 const ALLOWED_CUSTOM_SCHEMES = [
@@ -151,7 +199,7 @@ export function MarkdownRenderer({
     }, [remarkPlugins, removeComments]);
 
     // Rehype plugins (HTML processing, including KaTeX for math)
-    const rehypePluginsArray = React.useMemo(() => [rehypeKatex], []);
+    const rehypePluginsArray = useRehypePlugins(normalizedMarkdown);
 
     // Remark-rehype bridge options (custom AST handlers for definition lists)
     const remarkRehypeOptions = React.useMemo(

package/src/widgets/markdown/MermaidDiagram.tsx

@@ -1,6 +1,7 @@
-import mermaid from 'mermaid';
 import { useEffect, useId, useRef, useState } from 'react';
 
+type Mermaid = typeof import('mermaid').default;
+
 const MERMAID_FONT_FAMILY =
     'Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif';
 
@@ -78,27 +79,41 @@ export function makeSvgResponsive(svg: string): string {
     });
 }
 
-// Initialize mermaid with a browser-focused config close to Mermaid Playground defaults.
-mermaid.initialize({
-    startOnLoad: false,
-    theme: 'default',
-    securityLevel: 'loose',
-    fontFamily: MERMAID_FONT_FAMILY,
-    suppressErrorRendering: true,
-    flowchart: {
-        htmlLabels: true,
-        useMaxWidth: true,
-        nodeSpacing: 40,
-        rankSpacing: 50,
-        padding: 12,
-    },
-    sequence: {
-        useMaxWidth: true,
-    },
-    themeVariables: {
-        fontFamily: MERMAID_FONT_FAMILY,
-    },
-});
+let mermaidPromise: Promise<Mermaid> | undefined;
+
+/**
+ * Load Mermaid on first render of a diagram, initialized with a browser-focused config close to
+ * Mermaid Playground defaults. Mermaid is several hundred KB and most pages never render a diagram,
+ * so it is imported dynamically to keep it out of the eager bundle of every consuming app.
+ */
+function loadMermaid(): Promise<Mermaid> {
+    if (!mermaidPromise) {
+        mermaidPromise = import('mermaid').then(({ default: mermaid }) => {
+            mermaid.initialize({
+                startOnLoad: false,
+                theme: 'default',
+                securityLevel: 'loose',
+                fontFamily: MERMAID_FONT_FAMILY,
+                suppressErrorRendering: true,
+                flowchart: {
+                    htmlLabels: true,
+                    useMaxWidth: true,
+                    nodeSpacing: 40,
+                    rankSpacing: 50,
+                    padding: 12,
+                },
+                sequence: {
+                    useMaxWidth: true,
+                },
+                themeVariables: {
+                    fontFamily: MERMAID_FONT_FAMILY,
+                },
+            });
+            return mermaid;
+        });
+    }
+    return mermaidPromise;
+}
 
 export interface MermaidDiagramProps {
     /** The mermaid diagram code */
@@ -147,6 +162,7 @@ export function MermaidDiagram({ code, className }: MermaidDiagramProps) {
                 const normalizedCode = normalizeMermaidCodeForBrowser(code);
 
                 // Render the diagram
+                const mermaid = await loadMermaid();
                 const { svg: renderedSvg } = await mermaid.render(id, normalizedCode);
                 const responsiveSvg = makeSvgResponsive(renderedSvg);
 

package/src/widgets/monacoEditor/MonacoEditor.tsx

@@ -1,11 +1,16 @@
-import { Editor } from '@monaco-editor/react';
 import { useTheme } from '@vertesia/ui/core';
 import clsx from 'clsx';
 import debounce from 'debounce';
 import type * as monaco from 'monaco-editor';
-import { type RefObject, useCallback, useEffect, useMemo, useRef, useState } from 'react';
+import { lazy, type RefObject, Suspense, useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { registerCustomFoldingProviders } from './foldingProviders.js';
 
+/**
+ * The Monaco React wrapper drags in the Monaco loader (and, once mounted, the editor itself) on
+ * import. Most screens never open an editor, so it is fetched on first render instead.
+ */
+const Editor = lazy(() => import('@monaco-editor/react').then(({ Editor: component }) => ({ default: component })));
+
 export type Monaco = typeof monaco;
 
 /**
@@ -343,24 +348,26 @@ export function MonacoEditor({
 
     return (
         <div className={clsx(className, 'w-full h-full!')}>
-            <Editor
-                className="h-full w-full"
-                height="100%"
-                theme={resolvedTheme === 'dark' ? 'vs-dark' : 'light'}
-                language={language}
-                path={modelPath}
-                onChange={handleEditorChange}
-                onMount={handleEditorDidMount}
-                beforeMount={beforeMount}
-                options={defaultOptions}
-                // Uncontrolled: seed the initial content once via `defaultValue` and never bind a
-                // reactive `value`. @monaco-editor/react re-applies a changed `value` prop through
-                // `executeEdits(..., forceMoveMarkers: true)` whenever it differs from the live
-                // model, snapping the caret to the END of the content — the cursor jump we are
-                // eliminating whenever a caller feeds its own onChange output back into `value`.
-                // All external updates instead flow through the focus-guarded sync effect above.
-                defaultValue={effectiveValue}
-            />
+            <Suspense fallback={<div className="h-full w-full" />}>
+                <Editor
+                    className="h-full w-full"
+                    height="100%"
+                    theme={resolvedTheme === 'dark' ? 'vs-dark' : 'light'}
+                    language={language}
+                    path={modelPath}
+                    onChange={handleEditorChange}
+                    onMount={handleEditorDidMount}
+                    beforeMount={beforeMount}
+                    options={defaultOptions}
+                    // Uncontrolled: seed the initial content once via `defaultValue` and never bind a
+                    // reactive `value`. @monaco-editor/react re-applies a changed `value` prop through
+                    // `executeEdits(..., forceMoveMarkers: true)` whenever it differs from the live
+                    // model, snapping the caret to the END of the content — the cursor jump we are
+                    // eliminating whenever a caller feeds its own onChange output back into `value`.
+                    // All external updates instead flow through the focus-guarded sync effect above.
+                    defaultValue={effectiveValue}
+                />
+            </Suspense>
         </div>
     );
 }

package/lib/features/magic-pdf/GroundedExtractionAssistantPanel.d.ts

@@ -1,25 +0,0 @@
-interface GroundedExtractionAssistantPanelProps {
-    objectId: string;
-    /**
-     * Called after the assistant finishes a turn (which may have applied a grounded
-     * edit) so the grounded view can re-fetch and re-render the data + citation boxes.
-     */
-    onExtractionChanged?: () => void;
-    /**
-     * The field path currently selected in the view. When set (before the
-     * conversation starts), it seeds the assistant: the first message is scoped to
-     * this field so "click a field, say what's wrong" reaches the model.
-     */
-    selectedField?: string;
-    onClose?: () => void;
-}
-/**
- * Interactive assistant embedded in the grounded-extraction view. Starts the
- * server-side GroundedExtractionAssistant conversation (recordRun -> stage the
- * document into the agent space -> launch interactive), then renders the live
- * conversation. Each completed turn triggers `onExtractionChanged` so an operator's
- * grounded edits appear in the data tree + citation overlay without a manual reload.
- */
-export declare function GroundedExtractionAssistantPanel({ objectId, onExtractionChanged, selectedField, onClose, }: GroundedExtractionAssistantPanelProps): import("react").JSX.Element;
-export {};
-//# sourceMappingURL=GroundedExtractionAssistantPanel.d.ts.map

package/lib/features/magic-pdf/GroundedExtractionAssistantPanel.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"GroundedExtractionAssistantPanel.d.ts","sourceRoot":"","sources":["../../../src/features/magic-pdf/GroundedExtractionAssistantPanel.tsx"],"names":[],"mappings":"AAKA,UAAU,qCAAqC;IAC3C,QAAQ,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,mBAAmB,CAAC,EAAE,MAAM,IAAI,CAAC;IACjC;;;;OAIG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB;AAED;;;;;;GAMG;AACH,wBAAgB,gCAAgC,CAAC,EAC7C,QAAQ,EACR,mBAAmB,EACnB,aAAa,EACb,OAAO,GACV,EAAE,qCAAqC,+BAoDvC"}

package/lib/features/magic-pdf/GroundedExtractionAssistantPanel.js

@@ -1,42 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useUITranslation } from '@vertesia/ui/i18n';
-import { useUserSession } from '@vertesia/ui/session';
-import { useCallback, useRef, useState } from 'react';
-import { ModernAgentConversation } from '../agent/chat';
-/**
- * Interactive assistant embedded in the grounded-extraction view. Starts the
- * server-side GroundedExtractionAssistant conversation (recordRun -> stage the
- * document into the agent space -> launch interactive), then renders the live
- * conversation. Each completed turn triggers `onExtractionChanged` so an operator's
- * grounded edits appear in the data tree + citation overlay without a manual reload.
- */
-export function GroundedExtractionAssistantPanel({ objectId, onExtractionChanged, selectedField, onClose, }) {
-    const { t } = useUITranslation();
-    const { client } = useUserSession();
-    const [agentRunId, setAgentRunId] = useState(undefined);
-    // Keep the latest callback/selection without re-creating the handlers each render.
-    const changedRef = useRef(onExtractionChanged);
-    changedRef.current = onExtractionChanged;
-    const selectedRef = useRef(selectedField);
-    selectedRef.current = selectedField;
-    const startWorkflow = useCallback(async (initialMessage) => {
-        const field = selectedRef.current;
-        // Scope the opening message to the field the operator had selected, so
-        // "click a field, say what's wrong" reaches the model with the target.
-        const prompt = field && initialMessage ? `Regarding the field "${field}": ${initialMessage}` : initialMessage;
-        const res = await client.store.objects
-            .analyze(objectId)
-            .startGroundedAssistant(prompt ? { user_prompt: prompt } : {});
-        setAgentRunId(res.agent_run_id);
-        return { agent_run_id: res.agent_run_id };
-    }, [client, objectId]);
-    // The agent re-enables the follow-up input when a turn completes; that turn may
-    // have applied a grounded edit, so refresh the extraction at that point.
-    const handleShowInputChange = useCallback((canSendFollowUp) => {
-        if (canSendFollowUp) {
-            changedRef.current?.();
-        }
-    }, []);
-    return (_jsxs("div", { className: "flex h-full flex-col", children: [selectedField && !agentRunId && (_jsxs("div", { className: "shrink-0 border-b border-border bg-muted/40 px-3 py-1.5 text-xs text-muted-foreground", children: [t('grounded.assistantField'), " ", _jsx("span", { className: "font-mono text-foreground", children: selectedField })] })), _jsx(ModernAgentConversation, { agentRunId: agentRunId, startWorkflow: startWorkflow, interactive: true, fullWidth: true, hideObjectLinking: true, onShowInputChange: handleShowInputChange, onClose: onClose })] }));
-}
-//# sourceMappingURL=GroundedExtractionAssistantPanel.js.map

package/lib/features/magic-pdf/GroundedExtractionAssistantPanel.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"GroundedExtractionAssistantPanel.js","sourceRoot":"","sources":["../../../src/features/magic-pdf/GroundedExtractionAssistantPanel.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AACrD,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACtD,OAAO,EAAE,uBAAuB,EAAwB,MAAM,eAAe,CAAC;AAkB9E;;;;;;GAMG;AACH,MAAM,UAAU,gCAAgC,CAAC,EAC7C,QAAQ,EACR,mBAAmB,EACnB,aAAa,EACb,OAAO,GAC6B;IACpC,MAAM,EAAE,CAAC,EAAE,GAAG,gBAAgB,EAAE,CAAC;IACjC,MAAM,EAAE,MAAM,EAAE,GAAG,cAAc,EAAE,CAAC;IACpC,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAqB,SAAS,CAAC,CAAC;IAC5E,mFAAmF;IACnF,MAAM,UAAU,GAAG,MAAM,CAAC,mBAAmB,CAAC,CAAC;IAC/C,UAAU,CAAC,OAAO,GAAG,mBAAmB,CAAC;IACzC,MAAM,WAAW,GAAG,MAAM,CAAC,aAAa,CAAC,CAAC;IAC1C,WAAW,CAAC,OAAO,GAAG,aAAa,CAAC;IAEpC,MAAM,aAAa,GAAoB,WAAW,CAC9C,KAAK,EAAE,cAAc,EAAE,EAAE;QACrB,MAAM,KAAK,GAAG,WAAW,CAAC,OAAO,CAAC;QAClC,uEAAuE;QACvE,uEAAuE;QACvE,MAAM,MAAM,GACR,KAAK,IAAI,cAAc,CAAC,CAAC,CAAC,wBAAwB,KAAK,MAAM,cAAc,EAAE,CAAC,CAAC,CAAC,cAAc,CAAC;QACnG,MAAM,GAAG,GAAG,MAAM,MAAM,CAAC,KAAK,CAAC,OAAO;aACjC,OAAO,CAAC,QAAQ,CAAC;aACjB,sBAAsB,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,WAAW,EAAE,MAAM,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;QACnE,aAAa,CAAC,GAAG,CAAC,YAAY,CAAC,CAAC;QAChC,OAAO,EAAE,YAAY,EAAE,GAAG,CAAC,YAAY,EAAE,CAAC;IAC9C,CAAC,EACD,CAAC,MAAM,EAAE,QAAQ,CAAC,CACrB,CAAC;IAEF,gFAAgF;IAChF,yEAAyE;IACzE,MAAM,qBAAqB,GAAG,WAAW,CAAC,CAAC,eAAwB,EAAE,EAAE;QACnE,IAAI,eAAe,EAAE,CAAC;YAClB,UAAU,CAAC,OAAO,EAAE,EAAE,CAAC;QAC3B,CAAC;IACL,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACH,eAAK,SAAS,EAAC,sBAAsB,aAChC,aAAa,IAAI,CAAC,UAAU,IAAI,CAC7B,eAAK,SAAS,EAAC,uFAAuF,aACjG,CAAC,CAAC,yBAAyB,CAAC,OAAE,eAAM,SAAS,EAAC,2BAA2B,YAAE,aAAa,GAAQ,IAC/F,CACT,EACD,KAAC,uBAAuB,IACpB,UAAU,EAAE,UAAU,EACtB,aAAa,EAAE,aAAa,EAC5B,WAAW,QACX,SAAS,QACT,iBAAiB,QACjB,iBAAiB,EAAE,qBAAqB,EACxC,OAAO,EAAE,OAAO,GAClB,IACA,CACT,CAAC;AACN,CAAC"}

package/src/features/magic-pdf/GroundedExtractionAssistantPanel.tsx

@@ -1,86 +0,0 @@
-import { useUITranslation } from '@vertesia/ui/i18n';
-import { useUserSession } from '@vertesia/ui/session';
-import { useCallback, useRef, useState } from 'react';
-import { ModernAgentConversation, type StartWorkflowFn } from '../agent/chat';
-
-interface GroundedExtractionAssistantPanelProps {
-    objectId: string;
-    /**
-     * Called after the assistant finishes a turn (which may have applied a grounded
-     * edit) so the grounded view can re-fetch and re-render the data + citation boxes.
-     */
-    onExtractionChanged?: () => void;
-    /**
-     * The field path currently selected in the view. When set (before the
-     * conversation starts), it seeds the assistant: the first message is scoped to
-     * this field so "click a field, say what's wrong" reaches the model.
-     */
-    selectedField?: string;
-    onClose?: () => void;
-}
-
-/**
- * Interactive assistant embedded in the grounded-extraction view. Starts the
- * server-side GroundedExtractionAssistant conversation (recordRun -> stage the
- * document into the agent space -> launch interactive), then renders the live
- * conversation. Each completed turn triggers `onExtractionChanged` so an operator's
- * grounded edits appear in the data tree + citation overlay without a manual reload.
- */
-export function GroundedExtractionAssistantPanel({
-    objectId,
-    onExtractionChanged,
-    selectedField,
-    onClose,
-}: GroundedExtractionAssistantPanelProps) {
-    const { t } = useUITranslation();
-    const { client } = useUserSession();
-    const [agentRunId, setAgentRunId] = useState<string | undefined>(undefined);
-    // Keep the latest callback/selection without re-creating the handlers each render.
-    const changedRef = useRef(onExtractionChanged);
-    changedRef.current = onExtractionChanged;
-    const selectedRef = useRef(selectedField);
-    selectedRef.current = selectedField;
-
-    const startWorkflow: StartWorkflowFn = useCallback(
-        async (initialMessage) => {
-            const field = selectedRef.current;
-            // Scope the opening message to the field the operator had selected, so
-            // "click a field, say what's wrong" reaches the model with the target.
-            const prompt =
-                field && initialMessage ? `Regarding the field "${field}": ${initialMessage}` : initialMessage;
-            const res = await client.store.objects
-                .analyze(objectId)
-                .startGroundedAssistant(prompt ? { user_prompt: prompt } : {});
-            setAgentRunId(res.agent_run_id);
-            return { agent_run_id: res.agent_run_id };
-        },
-        [client, objectId],
-    );
-
-    // The agent re-enables the follow-up input when a turn completes; that turn may
-    // have applied a grounded edit, so refresh the extraction at that point.
-    const handleShowInputChange = useCallback((canSendFollowUp: boolean) => {
-        if (canSendFollowUp) {
-            changedRef.current?.();
-        }
-    }, []);
-
-    return (
-        <div className="flex h-full flex-col">
-            {selectedField && !agentRunId && (
-                <div className="shrink-0 border-b border-border bg-muted/40 px-3 py-1.5 text-xs text-muted-foreground">
-                    {t('grounded.assistantField')} <span className="font-mono text-foreground">{selectedField}</span>
-                </div>
-            )}
-            <ModernAgentConversation
-                agentRunId={agentRunId}
-                startWorkflow={startWorkflow}
-                interactive
-                fullWidth
-                hideObjectLinking
-                onShowInputChange={handleShowInputChange}
-                onClose={onClose}
-            />
-        </div>
-    );
-}