@agent-native/core 0.153.10 → 0.154.1

package/dist/client/assistant-ui-recovery.js

@@ -13,6 +13,10 @@ export function assistantUiRecoverableRenderErrorKind(error) {
     if (/^Tried to unmount a fiber that is already unmounted\b/.test(message)) {
         return "assistant-ui-react-fiber-unmount";
     }
+    // guard:allow-raw-color — #185 is a React diagnostic code, not a UI color.
+    if (/Maximum update depth exceeded|Minified React error #185/.test(message)) {
+        return "assistant-ui-react-update-depth";
+    }
     return null;
 }
 export function isAssistantUiStaleIndexError(error) {

package/dist/client/chat/message-components.d.ts

@@ -57,6 +57,10 @@ export declare function resolveAssistantRequestId(message: unknown, activeRun: {
     runId: string;
 } | null, threadId: string): string | undefined;
 export declare function MessageBranchPicker(): React.JSX.Element;
+export declare function ChatImageAttachmentPreview({ src, alt, }: {
+    src: string;
+    alt: string;
+}): React.JSX.Element;
 export declare function MessageActionsMenu({ showRevert, onRevert, threadId, }?: {
     showRevert?: boolean;
     onRevert?: () => void;
@@ -68,13 +72,14 @@ export declare function isMissingFinalResponseWarningText(text: string): boolean
 export declare function latestUserMessageText(messages: readonly unknown[]): string;
 export declare function userMessageTextBeforeAssistant(messages: readonly unknown[], assistantMessageId: string): string;
 export declare function assistantMessageHasUnresolvedTool(content: unknown): boolean;
+export declare function assistantMessageHasActiveTool(content: unknown): boolean;
 export declare function assistantMessageHasCompletedCustomUi(content: unknown): boolean;
 export declare function assistantMessageHasCustomUi(content: unknown): boolean;
 export declare function computeActiveTailToolCallId(content: ContentPart[] | undefined, { chatRunning, isLast }: {
     chatRunning: boolean;
     isLast: boolean;
 }): string | null;
-export declare function shouldShowAssistantMessageFooter({ isLast, chatRunning, activeRunId, messageRunId, activeTurnId, messageTurnId, hasRenderableContent, statusIsTerminal, hasUnresolvedTool, }: {
+export declare function shouldShowAssistantMessageFooter({ isLast, chatRunning, activeRunId, messageRunId, activeTurnId, messageTurnId, hasRenderableContent, statusIsTerminal, hasUnresolvedTool, hasActiveTool, }: {
     isLast: boolean;
     chatRunning: boolean;
     activeRunId?: string | null;
@@ -84,6 +89,7 @@ export declare function shouldShowAssistantMessageFooter({ isLast, chatRunning,
     hasRenderableContent: boolean;
     statusIsTerminal: boolean;
     hasUnresolvedTool?: boolean;
+    hasActiveTool?: boolean;
 }): boolean;
 /**
  * Server-authoritative "a run for this thread is still active and running".
@@ -93,21 +99,23 @@ export declare function shouldShowAssistantMessageFooter({ isLast, chatRunning,
  */
 export declare const ServerRunActiveContext: React.Context<boolean>;
 export declare const UserStoppedRunContext: React.Context<(runId?: string) => boolean>;
-export declare function shouldShowMissingFinalResponse({ isCurrentTurnRunning, serverRunActive, statusIsTerminal, hasAssistantText, hasUnresolvedTool, hasCompletedCustomUi, userStoppedRun, }: {
+export declare function shouldShowMissingFinalResponse({ isCurrentTurnRunning, serverRunActive, statusIsTerminal, hasAssistantText, hasUnresolvedTool, hasCompletedCustomUi, hasActiveTool, userStoppedRun, }: {
     isCurrentTurnRunning: boolean;
     serverRunActive?: boolean;
     statusIsTerminal: boolean;
     hasAssistantText: boolean;
     hasUnresolvedTool: boolean;
     hasCompletedCustomUi?: boolean;
+    hasActiveTool?: boolean;
     userStoppedRun?: boolean;
 }): boolean;
 export declare function useSettledFlag(active: boolean, delayMs: number): boolean;
-export declare function shouldShowAssistantWorkSummary({ isLast, isComplete, hasCollapsibleWork, hasUnresolvedTool, chatRunning, }: {
+export declare function shouldShowAssistantWorkSummary({ isLast, isComplete, hasCollapsibleWork, hasUnresolvedTool, hasActiveTool, chatRunning, }: {
     isLast: boolean;
     isComplete: boolean;
     hasCollapsibleWork: boolean;
     hasUnresolvedTool: boolean;
+    hasActiveTool?: boolean;
     chatRunning: boolean;
 }): boolean;
 export declare function getAssistantWorkSummaryDurationMs(durationMs: number | null | undefined, groupStartIndex: number, firstWorkPartIndex: number): number | null | undefined;

package/dist/client/chat/message-components.js

@@ -11,11 +11,12 @@ import React, { useState, useEffect, useCallback, useRef } from "react";
 import { getActiveRun } from "../active-run-state.js";
 import { agentNativePath } from "../api-path.js";
 import { writeClipboardText } from "../clipboard.js";
+import { Dialog, DialogClose, DialogContent, DialogTitle, } from "../components/ui/dialog.js";
 import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger, } from "../components/ui/dropdown-menu.js";
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, } from "../components/ui/tooltip.js";
 import { ThumbsFeedback } from "../observability/ThumbsFeedback.js";
 import { McpConnectionSuggestion } from "../resources/McpConnectionSuggestion.js";
-import { isCallAgentToolCallShadowed, shadowedCallAgentToolCallIds, } from "../tool-display.js";
+import { isCallAgentToolCallShadowed, isToolCallActive, shadowedCallAgentToolCallIds, } from "../tool-display.js";
 import { cn } from "../utils.js";
 import { MarkdownText, renderMarkdownToClipboardHtml, SmoothMarkdownText, } from "./markdown-renderer.js";
 import { getAssistantRunDurationMs } from "./repo-helpers.js";
@@ -292,11 +293,18 @@ function UserMessageAttachments() {
                 !!p.image);
             const imageSrc = uploadUrl || imagePart?.image || null;
             if (imageSrc) {
-                return (_jsx("div", { className: "h-16 w-16 overflow-hidden rounded-lg border border-border/70 bg-muted/50", title: att.name, children: _jsx("img", { src: imageSrc, alt: att.name, className: "h-full w-full object-cover" }) }, att.id));
+                return (_jsx(ChatImageAttachmentPreview, { src: imageSrc, alt: att.name }, att.id));
             }
             return (_jsxs("div", { className: "flex items-center gap-1.5 rounded-lg border border-border/70 bg-muted/50 px-2 py-1.5 text-xs text-muted-foreground", title: att.name, children: [_jsx(IconFile, { className: "h-3.5 w-3.5 shrink-0" }), _jsx("span", { className: "truncate max-w-[120px]", children: att.name || "file" })] }, att.id));
         }) }));
 }
+export function ChatImageAttachmentPreview({ src, alt, }) {
+    const [open, setOpen] = useState(false);
+    return (_jsxs(_Fragment, { children: [_jsx("button", { type: "button", "aria-label": `Preview ${alt}`, title: alt, onClick: () => setOpen(true), className: "h-16 w-16 cursor-zoom-in overflow-hidden rounded-lg border border-border/70 bg-muted/50 p-0 transition-[border-color,box-shadow] hover:border-foreground/40 hover:shadow-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2", children: _jsx("img", { src: src, alt: alt, className: "h-full w-full object-cover" }) }), _jsx(Dialog, { open: open, onOpenChange: setOpen, children: _jsxs(DialogContent, { hideClose: true, "aria-describedby": undefined, className: "fixed inset-0 left-0 top-0 flex h-screen max-h-none w-screen max-w-none translate-x-0 translate-y-0 items-center justify-center gap-0 overflow-hidden rounded-none border-0 bg-foreground/90 p-0 text-background shadow-none backdrop-blur-sm dark:bg-background/95 dark:text-foreground", onOpenAutoFocus: (event) => event.preventDefault(), children: [_jsx(DialogTitle, { className: "sr-only", children: alt || "Image preview" }), _jsx("div", { className: "flex h-full w-full items-center justify-center overflow-auto p-6", onClick: (event) => {
+                                if (event.target === event.currentTarget)
+                                    setOpen(false);
+                            }, children: _jsx("img", { src: src, alt: alt, draggable: false, className: "max-h-[90vh] max-w-[92vw] rounded-lg object-contain shadow-2xl" }) }), _jsx(DialogClose, { asChild: true, children: _jsx("button", { type: "button", "aria-label": "Close image preview", className: "absolute end-4 top-4 inline-flex size-9 items-center justify-center rounded-full border border-background/25 bg-background/10 text-background transition-colors hover:bg-background/20 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring dark:border-foreground/25 dark:bg-foreground/10 dark:text-foreground dark:hover:bg-foreground/20", children: _jsx(IconX, { className: "size-4" }) }) })] }) })] }));
+}
 // ─── UserMessageEditComposer ──────────────────────────────────────────────────
 function UserMessageEditComposer() {
     return (_jsxs(ComposerPrimitive.Root, { className: "flex flex-col gap-2 rounded-lg border border-border bg-background px-3 py-2 shadow-sm", children: [_jsx(ComposerPrimitive.Input, { className: "w-full resize-none bg-transparent text-sm leading-relaxed text-foreground placeholder:text-muted-foreground focus:outline-none", rows: 1, submitMode: "enter" }), _jsxs("div", { className: "flex justify-end gap-2", children: [_jsx(ComposerPrimitive.Cancel, { asChild: true, children: _jsx("button", { type: "button", className: "cursor-pointer rounded-md px-2 py-1 text-xs font-medium text-muted-foreground hover:bg-accent hover:text-foreground", children: "Cancel" }) }), _jsx(ComposerPrimitive.Send, { asChild: true, children: _jsx("button", { type: "submit", className: "cursor-pointer rounded-md bg-foreground px-2 py-1 text-xs font-medium text-background hover:opacity-90 disabled:opacity-50", children: "Save" }) })] })] }));
@@ -545,6 +553,15 @@ export function assistantMessageHasUnresolvedTool(content) {
         return record.type === "tool-call" && record.result === undefined;
     });
 }
+export function assistantMessageHasActiveTool(content) {
+    if (!Array.isArray(content))
+        return false;
+    return content.some((part) => {
+        if (!part || typeof part !== "object")
+            return false;
+        return isToolCallActive(part);
+    });
+}
 export function assistantMessageHasCompletedCustomUi(content) {
     if (!Array.isArray(content))
         return false;
@@ -606,7 +623,7 @@ export function computeActiveTailToolCallId(content, { chatRunning, isLast }) {
         ? part.toolCallId
         : latestToolCallId, null) ?? null);
 }
-export function shouldShowAssistantMessageFooter({ isLast, chatRunning, activeRunId, messageRunId, activeTurnId, messageTurnId, hasRenderableContent, statusIsTerminal, hasUnresolvedTool, }) {
+export function shouldShowAssistantMessageFooter({ isLast, chatRunning, activeRunId, messageRunId, activeTurnId, messageTurnId, hasRenderableContent, statusIsTerminal, hasUnresolvedTool, hasActiveTool, }) {
     if (!hasRenderableContent)
         return false;
     const ownsActiveTurn = activeTurnId != null &&
@@ -622,6 +639,8 @@ export function shouldShowAssistantMessageFooter({ isLast, chatRunning, activeRu
     const ownsActiveRun = isLast || ownsActiveTurn || ownsLegacyRun;
     if (chatRunning && ownsActiveRun)
         return false;
+    if (hasActiveTool)
+        return false;
     if (!isLast)
         return true;
     if (hasUnresolvedTool)
@@ -636,7 +655,7 @@ export function shouldShowAssistantMessageFooter({ isLast, chatRunning, activeRu
  */
 export const ServerRunActiveContext = React.createContext(false);
 export const UserStoppedRunContext = React.createContext(() => false);
-export function shouldShowMissingFinalResponse({ isCurrentTurnRunning, serverRunActive, statusIsTerminal, hasAssistantText, hasUnresolvedTool, hasCompletedCustomUi, userStoppedRun, }) {
+export function shouldShowMissingFinalResponse({ isCurrentTurnRunning, serverRunActive, statusIsTerminal, hasAssistantText, hasUnresolvedTool, hasCompletedCustomUi, hasActiveTool, userStoppedRun, }) {
     if (userStoppedRun)
         return false;
     if (serverRunActive)
@@ -647,6 +666,7 @@ export function shouldShowMissingFinalResponse({ isCurrentTurnRunning, serverRun
         statusIsTerminal &&
         !hasAssistantText &&
         !hasUnresolvedTool &&
+        !hasActiveTool &&
         !hasCompletedCustomUi);
 }
 /**
@@ -668,9 +688,11 @@ export function useSettledFlag(active, delayMs) {
     }, [active, delayMs]);
     return active && (delayMs <= 0 || settled);
 }
-export function shouldShowAssistantWorkSummary({ isLast, isComplete, hasCollapsibleWork, hasUnresolvedTool, chatRunning, }) {
+export function shouldShowAssistantWorkSummary({ isLast, isComplete, hasCollapsibleWork, hasUnresolvedTool, hasActiveTool, chatRunning, }) {
     if (!hasCollapsibleWork)
         return false;
+    if (hasActiveTool)
+        return false;
     // An unresolved tool means "still working" only while the turn is actually
     // running. On a stalled or interrupted turn it used to hide the summary
     // forever, so the longest turns showed no "Worked for Xm Ys" at all.
@@ -798,6 +820,7 @@ export function AssistantMessage() {
     const isUserStoppedRun = assistantMessageWasUserStopped(msg) || userStoppedRun(messageRunId);
     const hasRenderableContent = assistantMessageHasRenderableContent(msg);
     const hasUnresolvedTool = assistantMessageHasUnresolvedTool(msg.content);
+    const hasActiveTool = assistantMessageHasActiveTool(msg.content);
     const missingWarningText = missingFinalResponseWarningText(msg.content);
     const responseConnectionText = finalResponseTextFromContent(msg.content);
     const statusIsTerminal = assistantMessageStatusIsTerminal(msg);
@@ -818,6 +841,7 @@ export function AssistantMessage() {
             statusIsTerminal,
             hasAssistantText: responseConnectionText.trim().length > 0,
             hasUnresolvedTool,
+            hasActiveTool,
             hasCompletedCustomUi,
             userStoppedRun: isUserStoppedRun,
         });
@@ -876,6 +900,7 @@ export function AssistantMessage() {
             hasRenderableContent,
             statusIsTerminal,
             hasUnresolvedTool,
+            hasActiveTool,
         });
     const cpCtx = React.useContext(CheckpointContext);
     useEffect(() => {
@@ -995,6 +1020,7 @@ export function AssistantMessage() {
                                             isComplete,
                                             hasCollapsibleWork,
                                             hasUnresolvedTool,
+                                            hasActiveTool,
                                             chatRunning,
                                         });
                                         if (!showSummary)

package/dist/client/chat/tool-call-display.d.ts

@@ -78,7 +78,7 @@ export declare function AnimatedCollapse({ open, children, }: {
     open: boolean;
     children: React.ReactNode;
 }): React.JSX.Element | null;
-export declare function ToolCallDisplay({ toolName, toolCallId, argsText, args, result, mcpApp, chatUI, isRunning, outcome, structuredMeta, approval, repeatCount, isLatestRunning, isActiveTail, }: {
+export declare function ToolCallDisplay({ toolName, toolCallId, argsText, args, result, mcpApp, chatUI, isRunning, outcome, structuredMeta, activity, approval, repeatCount, isLatestRunning, isActiveTail, }: {
     toolName: string;
     toolCallId?: string;
     argsText?: string;
@@ -90,6 +90,7 @@ export declare function ToolCallDisplay({ toolName, toolCallId, argsText, args,
     /** "unknown": the stream ended mid-flight, so the side effect may have landed. */
     outcome?: "unknown";
     structuredMeta?: Record<string, unknown>;
+    activity?: boolean;
     approval?: {
         approvalKey: string;
         dismissed?: boolean;

package/dist/client/chat/tool-call-display.js

@@ -11,7 +11,7 @@ import { McpAppRenderer } from "../mcp-apps/McpAppRenderer.js";
 import { findMcpIntegrationForToolName } from "../resources/mcp-integration-catalog.js";
 import { McpIntegrationLogo } from "../resources/McpIntegrationLogo.js";
 import { BashCell, EditCell, WriteCell, FilesChangedSummary, } from "../tool-cells/index.js";
-import { humanizeToolName, isCallAgentToolCallShadowed, } from "../tool-display.js";
+import { humanizeToolName, isCallAgentToolCallShadowed, isToolCallActive, } from "../tool-display.js";
 import { cn } from "../utils.js";
 import { ActionChatUiSurface } from "./action-chat-ui-surface.js";
 import { SmoothMarkdownText, HighlightedCodeBlock, } from "./markdown-renderer.js";
@@ -273,23 +273,34 @@ function ApprovalAffordance({ toolName, toolCallId, approval, }) {
                 }, className: cn("inline-flex items-center gap-1 rounded-md border border-border px-2.5 py-1 text-xs font-medium transition-colors", "text-foreground hover:bg-muted"), children: [_jsx(IconX, { className: "h-3.5 w-3.5" }), "Deny"] })] }));
 }
 // ─── ToolCallDisplay ──────────────────────────────────────────────────────────
-export function ToolCallDisplay({ toolName, toolCallId, argsText, args, result, mcpApp, chatUI, isRunning, outcome, structuredMeta, approval, repeatCount, isLatestRunning = isRunning, isActiveTail, }) {
+export function ToolCallDisplay({ toolName, toolCallId, argsText, args, result, mcpApp, chatUI, isRunning, outcome, structuredMeta, activity, approval, repeatCount, isLatestRunning = isRunning, isActiveTail, }) {
+    const isDelegatedAgentCall = toolName === "call-agent" || toolName.startsWith("agent:");
+    const effectiveIsRunning = isRunning ||
+        (isDelegatedAgentCall &&
+            isToolCallActive({
+                type: "tool-call",
+                toolName,
+                result,
+                outcome,
+                activity,
+                structuredMeta,
+            }));
     const showActiveTail = isActiveTail ?? isLatestRunning;
     // Delegate to bespoke cells when structured metadata is present.
     // These must be separate components so hook order in ToolCallDisplayGeneric
     // is always stable (no conditional hook calls).
     const toolKind = structuredMeta?.toolKind;
-    const wrapToolDisplay = (children) => (_jsx(ToolActivityPresentation, { toolName: toolName, isRunning: isRunning, toolCallId: toolCallId, suppressLongRunningHint: toolName === "call-agent" || toolName.startsWith("agent:"), children: children }));
+    const wrapToolDisplay = (children) => (_jsx(ToolActivityPresentation, { toolName: toolName, isRunning: effectiveIsRunning, toolCallId: toolCallId, suppressLongRunningHint: toolName === "call-agent" || toolName.startsWith("agent:"), children: children }));
     if (toolKind === "bash") {
-        return wrapToolDisplay(_jsx(BashCell, { meta: structuredMeta, output: result, isRunning: isRunning }));
+        return wrapToolDisplay(_jsx(BashCell, { meta: structuredMeta, output: result, isRunning: effectiveIsRunning }));
     }
     if (toolKind === "edit") {
-        return wrapToolDisplay(_jsx(EditCell, { meta: structuredMeta, isRunning: isRunning }));
+        return wrapToolDisplay(_jsx(EditCell, { meta: structuredMeta, isRunning: effectiveIsRunning }));
     }
     if (toolKind === "write") {
-        return wrapToolDisplay(_jsx(WriteCell, { meta: structuredMeta, isRunning: isRunning }));
+        return wrapToolDisplay(_jsx(WriteCell, { meta: structuredMeta, isRunning: effectiveIsRunning }));
     }
-    return wrapToolDisplay(_jsx(ToolCallDisplayGeneric, { toolName: toolName, toolCallId: toolCallId, argsText: argsText, args: args, result: result, mcpApp: mcpApp, chatUI: chatUI, isRunning: isRunning, outcome: outcome, isActiveTail: showActiveTail, structuredMeta: structuredMeta, approval: approval, repeatCount: repeatCount }));
+    return wrapToolDisplay(_jsx(ToolCallDisplayGeneric, { toolName: toolName, toolCallId: toolCallId, argsText: argsText, args: args, result: result, mcpApp: mcpApp, chatUI: chatUI, isRunning: effectiveIsRunning, outcome: outcome, isActiveTail: showActiveTail, structuredMeta: structuredMeta, approval: approval, repeatCount: repeatCount }));
 }
 function ToolCallDisplayGeneric({ toolName, toolCallId, argsText, args, result, mcpApp, chatUI, isRunning, outcome, isActiveTail, structuredMeta, approval, repeatCount, }) {
     const suppressInlineOpenApp = React.useContext(SuppressInlineOpenAppContext);
@@ -460,17 +471,24 @@ function AgentActivityToolCallRow({ tool, isActiveTail, }) {
 // ─── ToolCallFallback ──────────────────────────────────────────────────────────
 export function ToolCallFallback({ toolName, toolCallId, args, argsText, result, ...rest }) {
     const chatRunning = React.useContext(ChatRunningContext);
-    // A spinner is a claim that something is running right now, so it needs an
-    // actually-running chat. `chatRunning` already stays true across
-    // auto-continuation gaps and server-active runs (resolveAssistantChatRunningState),
-    // so an activity placeholder alone must never resurrect one on rehydrated
-    // history.
-    const isRunning = result === undefined && chatRunning;
+    // `chatRunning` covers ordinary live activity. An unresolved tool or a
+    // delegated-agent row is also explicit work evidence, while a generic
+    // activity placeholder alone must stay frozen when history is rehydrated.
+    const isRunning = rest.outcome !== "unknown" &&
+        ((result === undefined && chatRunning) ||
+            isToolCallActive({
+                type: "tool-call",
+                toolName,
+                result,
+                outcome: rest.outcome,
+                activity: rest.activity,
+                structuredMeta: rest.structuredMeta,
+            }));
     return (_jsx(ToolCallDisplay, { toolName: toolName, toolCallId: toolCallId, args: args, argsText: argsText, result: typeof result === "string"
             ? result
             : result !== undefined
                 ? JSON.stringify(result)
-                : undefined, mcpApp: rest.mcpApp, chatUI: rest.chatUI, structuredMeta: rest.structuredMeta, isRunning: isRunning, outcome: rest.outcome, isActiveTail: rest.isActiveTail, isLatestRunning: rest.isLatestRunning, approval: rest.approval, repeatCount: rest.repeatCount }));
+                : undefined, mcpApp: rest.mcpApp, chatUI: rest.chatUI, structuredMeta: rest.structuredMeta, activity: rest.activity, isRunning: isRunning, outcome: rest.outcome, isActiveTail: rest.isActiveTail, isLatestRunning: rest.isLatestRunning, approval: rest.approval, repeatCount: rest.repeatCount }));
 }
 // ─── ReconnectStreamMessage ────────────────────────────────────────────────────
 // Renders the agent's in-progress response during reconnection (outside
@@ -496,7 +514,7 @@ export function ReconnectStreamMessage({ content, allowActivitySpinner = true, }
         if (part.type === "reasoning") {
             return (_jsx(ReasoningCell, { text: part.text, isStreaming: chatRunning && i === streamingReasoningPartIndex, resetKey: `reconnect-reasoning-${i}`, defaultOpen: i === latestReasoningPartIndex, collapseWhenReplaced: i < latestReasoningPartIndex }, `reconnect-reasoning-${i}`));
         }
-        return (_jsx(ToolCallDisplay, { toolName: part.toolName, toolCallId: part.toolCallId, argsText: part.argsText, args: part.args, result: part.result, mcpApp: part.mcpApp, chatUI: part.chatUI, structuredMeta: part.structuredMeta, outcome: part.outcome, isRunning: part.result === undefined &&
+        return (_jsx(ToolCallDisplay, { toolName: part.toolName, toolCallId: part.toolCallId, argsText: part.argsText, args: part.args, result: part.result, mcpApp: part.mcpApp, chatUI: part.chatUI, structuredMeta: part.structuredMeta, activity: part.activity, outcome: part.outcome, isRunning: part.result === undefined &&
                 (chatRunning || (allowActivitySpinner && part.activity === true)), isActiveTail: i === latestActiveToolIndex, approval: part.approval, repeatCount: part.repeatCount }, `reconnect-tool-${i}`));
     };
     const renderedParts = [];

package/dist/client/db-admin/SqlEditor.js

@@ -343,7 +343,7 @@ export function SqlEditor({ dialect, tableNames, columnsByTable, requestConfig,
     const hasResults = result !== null;
     const canExport = hasResults && result.columns.length > 0;
     // ─── Render ──────────────────────────────────────────────────────────────
-    return (_jsxs("div", { className: "flex h-full flex-col", children: [_jsxs("div", { className: "flex flex-wrap items-center gap-2 border-b border-border bg-background px-3 py-2", children: [_jsxs("button", { type: "button", onClick: runActiveStatement, disabled: running || !value.trim(), title: `Run selection / statement (${MOD}+Enter)`, className: "inline-flex h-8 cursor-pointer items-center gap-1.5 rounded-md bg-primary px-3 text-xs font-semibold text-primary-foreground transition-colors hover:bg-primary/90 disabled:cursor-not-allowed disabled:opacity-50", children: [running ? (_jsx(IconLoader2, { size: 14, className: "animate-spin" })) : (_jsx(IconPlayerPlayFilled, { size: 14 })), "Run"] }), _jsxs("span", { className: "hidden text-[11px] text-muted-foreground sm:inline", children: [MOD, "+Enter runs selection / statement \u00B7 ", MOD, "+Shift+Enter runs all"] }), _jsxs("div", { className: "ml-auto flex items-center gap-2", children: [_jsxs(Popover, { children: [_jsx(PopoverTrigger, { asChild: true, children: _jsxs(ToolbarButton, { title: "Query history", children: [_jsx(IconHistory, { size: 14 }), "History"] }) }), _jsxs(PopoverContent, { align: "end", className: "w-96 p-0", children: [_jsxs("div", { className: "flex items-center justify-between border-b border-border px-3 py-2", children: [_jsx("span", { className: "text-xs font-semibold text-foreground", children: "Recent queries" }), history.length > 0 && (_jsx("button", { type: "button", onClick: () => {
+    return (_jsxs("div", { className: "flex h-full flex-col", children: [_jsxs("div", { className: "flex flex-wrap items-center gap-2 border-b border-border bg-background px-3 py-2", children: [_jsxs("button", { type: "button", onClick: runActiveStatement, disabled: running || !value.trim(), title: `Run selection / statement (${MOD} Enter)`, className: "inline-flex h-8 cursor-pointer items-center gap-1.5 rounded-md bg-primary px-3 text-xs font-semibold text-primary-foreground transition-colors hover:bg-primary/90 disabled:cursor-not-allowed disabled:opacity-50", children: [running ? (_jsx(IconLoader2, { size: 14, className: "animate-spin" })) : (_jsx(IconPlayerPlayFilled, { size: 14 })), "Run"] }), _jsxs("span", { className: "hidden text-[11px] text-muted-foreground sm:inline", children: [MOD, " Enter runs selection / statement \u00B7 ", MOD, " Shift Enter runs all"] }), _jsxs("div", { className: "ml-auto flex items-center gap-2", children: [_jsxs(Popover, { children: [_jsx(PopoverTrigger, { asChild: true, children: _jsxs(ToolbarButton, { title: "Query history", children: [_jsx(IconHistory, { size: 14 }), "History"] }) }), _jsxs(PopoverContent, { align: "end", className: "w-96 p-0", children: [_jsxs("div", { className: "flex items-center justify-between border-b border-border px-3 py-2", children: [_jsx("span", { className: "text-xs font-semibold text-foreground", children: "Recent queries" }), history.length > 0 && (_jsx("button", { type: "button", onClick: () => {
                                                             clearHistory();
                                                             setHistory([]);
                                                         }, className: "cursor-pointer text-[11px] text-muted-foreground hover:text-foreground", children: "Clear" }))] }), _jsx("div", { className: "max-h-80 overflow-auto py-1", children: history.length === 0 ? (_jsx("div", { className: "px-3 py-6 text-center text-xs text-muted-foreground", children: "No queries yet" })) : (history.map((h, i) => (_jsx("button", { type: "button", onClick: () => loadIntoEditor(h), className: "block w-full cursor-pointer truncate px-3 py-1.5 text-left font-mono text-[11px] text-foreground hover:bg-accent", title: h, children: h.replace(/\s+/g, " ").trim() }, i)))) })] })] }), _jsxs(Popover, { children: [_jsx(PopoverTrigger, { asChild: true, children: _jsxs(ToolbarButton, { title: "Saved snippets", children: [_jsx(IconBookmark, { size: 14 }), "Snippets"] }) }), _jsxs(PopoverContent, { align: "end", className: "w-96 p-0", children: [_jsxs("div", { className: "flex items-center justify-between border-b border-border px-3 py-2", children: [_jsx("span", { className: "text-xs font-semibold text-foreground", children: "Saved snippets" }), _jsxs("button", { type: "button", onClick: openSaveModal, disabled: !value.trim(), className: "inline-flex cursor-pointer items-center gap-1 text-[11px] text-muted-foreground hover:text-foreground disabled:cursor-not-allowed disabled:opacity-50", children: [_jsx(IconBookmarkPlus, { size: 13 }), "Save current"] })] }), _jsx("div", { className: "max-h-80 overflow-auto py-1", children: snippets.length === 0 ? (_jsx("div", { className: "px-3 py-6 text-center text-xs text-muted-foreground", children: "No saved snippets" })) : (snippets.map((s) => (_jsxs("div", { className: "group flex items-center gap-2 px-3 py-1.5 hover:bg-accent", children: [_jsxs("button", { type: "button", onClick: () => loadIntoEditor(s.sql), className: "min-w-0 flex-1 cursor-pointer text-left", title: s.sql, children: [_jsx("div", { className: "truncate text-xs font-medium text-foreground", children: s.name }), _jsx("div", { className: "truncate font-mono text-[10px] text-muted-foreground", children: s.sql.replace(/\s+/g, " ").trim() })] }), _jsx("button", { type: "button", onClick: () => removeSnippet(s.id), className: "cursor-pointer rounded p-1 text-muted-foreground opacity-0 transition-opacity hover:text-red-500 group-hover:opacity-100", title: "Delete snippet", children: _jsx(IconTrash, { size: 13 }) })] }, s.id)))) })] })] }), _jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs(ToolbarButton, { title: "Export results", disabled: !canExport, children: [_jsx(IconDownload, { size: 14 }), "Export", _jsx(IconChevronDown, { size: 12, className: "opacity-60" })] }) }), _jsxs(DropdownMenuContent, { align: "end", children: [_jsx(DropdownMenuItem, { onClick: () => exportAs("csv"), children: "Download CSV" }), _jsx(DropdownMenuItem, { onClick: () => exportAs("json"), children: "Download JSON" })] })] })] })] }), _jsx("div", { className: "shrink-0 overflow-hidden border-b border-border", style: { height: editorHeight }, children: _jsx(CodeMirror, { ref: editorRef, value: value, onChange: setValue, height: `${editorHeight}px`, theme: isDark ? oneDark : undefined, extensions: extensions, placeholder: "Write SQL here\u2026", basicSetup: {

package/dist/client/dev-overlay/DevOverlay.js

@@ -57,8 +57,8 @@ function DevOverlayPanel({ onClose }) {
     const panels = useSyncExternalStore(subscribeDevPanels, listDevPanels, listDevPanels);
     const shortcutHint = typeof navigator !== "undefined" &&
         /Mac|iPhone|iPad/.test(navigator.userAgent)
-        ? "Cmd+Ctrl+A"
-        : "Ctrl+Alt+A";
+        ? "Cmd Ctrl A"
+        : "Ctrl Alt A";
     return (_jsx(TooltipProvider, { delayDuration: 200, children: _jsxs("div", { style: styles.shell, role: "dialog", "aria-label": "Dev overlay", children: [_jsxs("div", { style: styles.header, children: [_jsxs("div", { children: [_jsx("div", { style: styles.headerTitle, children: "Dev Overlay" }), _jsxs("div", { style: styles.headerSub, children: [shortcutHint, " \u00B7 localStorage-backed"] })] }), _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("button", { type: "button", style: styles.iconBtn, onClick: onClose, "aria-label": "Close", children: _jsx(IconX, { size: 16 }) }) }), _jsx(TooltipContent, { children: "Close (Esc)" })] })] }), _jsx("div", { style: styles.body, children: panels.length === 0 ? (_jsxs("div", { style: styles.empty, children: ["No panels registered. Call ", _jsx("code", { children: "registerDevPanel(...)" }), " from your template to add options here."] })) : (panels.map((panel) => _jsx(DevPanelCard, { panel: panel }, panel.id))) }), _jsx("div", { style: styles.footer, children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsxs("button", { type: "button", style: { ...styles.footerBtn, ...styles.footerBtnDanger }, onClick: () => {
                                         clearAllDevOverlayStorage();
                                     }, children: [_jsx(IconTrash, { size: 13 }), "Clear all dev-overlay values"] }) }), _jsx(TooltipContent, { children: "Reset every dev-overlay value back to its default" })] }) })] }) }));

package/dist/client/extensions/portable-extension.js

@@ -281,6 +281,10 @@ export function buildAgentNativeExtensionHtml({ extensionId, content, title, slo
   </style>
   <style>
     *, *::before, *::after { box-sizing: border-box; border-color: hsl(var(--border, 214 32% 91%)); }
+    /* Alpine only honours x-cloak when a stylesheet hides it, and the exported
+       body snippet cannot supply one. Without this an x-cloak overlay paints
+       over the whole extension until Alpine boots — and forever if it never does. */
+    [x-cloak] { display: none !important; }
     html, body { margin: 0; min-height: 100%; background: transparent; color: hsl(var(--foreground, 222 47% 11%)); }
     body {
       --agent-native-extension-padding: clamp(12px, 2vw, 20px);

package/dist/client/guided-questions.d.ts

@@ -40,6 +40,14 @@ export interface GuidedQuestionPayload {
     submitLabel?: string;
     submitMessage?: string;
     skipMessage?: string;
+    /**
+     * Hidden context appended to whichever message this card sends. The card's
+     * answer opens a continuation turn that inherits nothing from the turn that
+     * posed it, so anything the follow-up work depends on — a linked design
+     * system, the user's original brief — has to travel with the payload or it
+     * is gone by the time the agent acts on the answer.
+     */
+    submitContext?: string;
     /**
      * @internal Set by {@link askUserQuestion} for client-initiated questions.
      * When present, `useGuidedQuestionFlow` resolves the matching in-memory

package/dist/client/guided-questions.js

@@ -508,8 +508,13 @@ export function useGuidedQuestionFlow({ enabled = true, stateKey = "show-questio
         }
         const formattedAnswers = formatGuidedAnswersForAgent(answers);
         const resolvedSubmitMessage = visiblePayload?.submitMessage ?? submitMessage;
-        const context = buildSubmitContext?.({ answers, formattedAnswers }) ??
-            defaultGuidedSubmitContext(formattedAnswers);
+        const context = [
+            buildSubmitContext?.({ answers, formattedAnswers }) ??
+                defaultGuidedSubmitContext(formattedAnswers),
+            visiblePayload?.submitContext,
+        ]
+            .filter(Boolean)
+            .join("\n\n");
         sendToAgentChat({
             message: resolvedSubmitMessage,
             context,
@@ -526,7 +531,11 @@ export function useGuidedQuestionFlow({ enabled = true, stateKey = "show-questio
         }
         sendToAgentChat({
             message: visiblePayload?.skipMessage ?? skipMessage,
-            context: buildSkipContext?.(),
+            // Skipping a variant set asks for another one — the replacement needs the
+            // same context the first set was built from.
+            context: [buildSkipContext?.(), visiblePayload?.submitContext]
+                .filter(Boolean)
+                .join("\n\n"),
             submit: true,
         });
         clear();

package/dist/client/sharing/ShareButton.js

@@ -1,7 +1,6 @@
 import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Collapsible, CollapsibleContent, CollapsibleTrigger, } from "@agent-native/toolkit/ui";
 import * as Select from "@radix-ui/react-select";
-import { IconLock, IconWorld, IconTrash, IconCheck, IconChevronDown, IconCopy, IconLoader2, IconSearch, IconSearchOff, IconShare3, IconUsersGroup, } from "@tabler/icons-react";
+import { IconLock, IconWorld, IconTrash, IconCheck, IconChevronDown, IconLoader2, IconLink, IconSearch, IconSearchOff, IconShare3, IconUsersGroup, } from "@tabler/icons-react";
 import { useEffect, useId, useRef, useState, } from "react";
 import { writeClipboardText } from "../clipboard.js";
 import { Popover, PopoverAnchor, PopoverContent, PopoverTrigger, } from "../components/ui/popover.js";
@@ -103,7 +102,7 @@ export function ShareButton(props) {
     return (_jsxs(Popover, { open: controller.open, onOpenChange: controller.handleOpenChange, children: [_jsx(PopoverTrigger, { asChild: true, children: _jsxs("button", { type: "button", className: cn(iconOnly ? BUTTON_GHOST_ICON : BUTTON_OUTLINE_SM, props.triggerClassName), "aria-label": triggerLabel, title: triggerLabel, children: [showTriggerIcon && _jsx(TriggerIcon, { size: 16, strokeWidth: 1.75 }), !iconOnly && _jsx("span", { children: "Share" })] }) }), _jsx(PopoverContent, { align: "end", sideOffset: 6, "data-agent-native-share-overlay": "", className: cn("z-[2000] w-[min(460px,92vw)] rounded-lg p-4 shadow-lg", SHARE_POPOVER_SURFACE, props.popoverClassName), onOpenAutoFocus: (e) => e.preventDefault(), onInteractOutside: handleSharePopoverInteractOutside, children: _jsx(SharePanel, { ...props, controller: controller }) })] }));
 }
 function SharePanel(props) {
-    const { resourceTitle, controller } = props;
+    const { controller } = props;
     const { inviteEmail, setInviteEmail: onInviteEmailChange, activeShareTab, handleShareTabChange, data, policy, visibility, canManage, role, setRole, notifyPeople, setNotifyPeople, shareMessage, setShareMessage, messageOpen, setMessageOpen, shareError, setShareError, suggestionsOpen, setSuggestionsOpen, inFlight, memberSearch, memberSuggestions, knownMembers, shares, handleVisibility, handleHideInSearch, handleAdd, handleChangeRole, handleRemove, } = controller;
     const hasInviteEmail = inviteEmail.trim().length > 0;
     const isLoading = data === undefined;
@@ -116,28 +115,21 @@ function SharePanel(props) {
             Boolean(props.shareUrlPlaceholder) ||
             Boolean(props.secondaryShareUrl));
     const shareUrlPlacement = props.shareUrlPlacement ?? "top";
-    const [advancedOpen, setAdvancedOpen] = useState(!showShareLinks);
-    useEffect(() => {
-        setAdvancedOpen(!showShareLinks);
-    }, [props.resourceId, showShareLinks]);
-    const extraTabs = props.shareTabs?.tabs ?? [];
+    const extraTabs = props.shareTabs?.tabs.filter((tab) => tab.value !== "context") ?? [];
     const hasTabs = extraTabs.length > 0;
     const shareTabLabel = props.shareTabs?.shareLabel ?? "Share link";
-    const titleText = resourceTitle
-        ? `Share "${resourceTitle}"`
-        : `Share ${props.resourceType}`;
-    const sharePanel = isLoading ? (_jsxs("div", { children: [!hasTabs ? (_jsx("div", { className: "mb-3 truncate text-base font-semibold", title: titleText, children: titleText })) : null, _jsx("div", { className: "mb-4 h-9 rounded-md bg-muted animate-pulse" }), _jsx("div", { className: "mb-2 text-sm font-semibold", children: peopleAccessLabel }), _jsx("div", { className: "mb-4 h-7 rounded-md bg-muted animate-pulse" }), _jsx("div", { className: "mb-2 text-sm font-semibold", children: generalAccessLabel }), _jsx("div", { className: "mb-4 h-9 rounded-md bg-muted animate-pulse" })] })) : (_jsxs("div", { children: [!hasTabs ? (_jsx("div", { className: "mb-3 truncate text-base font-semibold", title: titleText, children: titleText })) : null, showShareLinks && shareUrlPlacement === "top" ? shareLinks : null, _jsxs(Collapsible, { open: advancedOpen, onOpenChange: setAdvancedOpen, className: "mb-4 overflow-hidden rounded-md border border-border", children: [_jsx(CollapsibleTrigger, { asChild: true, children: _jsxs("button", { type: "button", className: "flex min-h-10 w-full items-center justify-between gap-3 px-3 py-2 text-left text-sm font-medium transition-colors hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-inset", children: [_jsxs("span", { className: "flex min-w-0 items-center gap-2 truncate", children: [_jsx(IconUsersGroup, { "aria-hidden": true, size: 15, strokeWidth: 1.8, className: "shrink-0 text-muted-foreground" }), canManage ? "Manage access" : peopleAccessLabel] }), _jsx(IconChevronDown, { "aria-hidden": true, size: 16, strokeWidth: 1.8, className: cn("shrink-0 text-muted-foreground transition-transform", advancedOpen && "rotate-180") })] }) }), _jsx(CollapsibleContent, { className: "border-t border-border px-3 py-3", children: _jsxs("div", { className: "space-y-4", children: [canManage ? (_jsxs("div", { className: "space-y-2", children: [_jsxs("div", { className: "flex items-stretch gap-2", children: [_jsx(MemberAutocomplete, { value: inviteEmail, open: suggestionsOpen, onOpenChange: setSuggestionsOpen, onValueChange: (next) => {
-                                                        onInviteEmailChange(next);
-                                                        if (shareError)
-                                                            setShareError(null);
-                                                    }, onSelectMember: (member) => {
-                                                        onInviteEmailChange(member.email);
-                                                        setSuggestionsOpen(false);
-                                                        if (shareError)
-                                                            setShareError(null);
-                                                    }, onSubmit: handleAdd, placeholder: policy.requireOrgMemberForUserShares
-                                                        ? "Add people from your organization"
-                                                        : "Add people by email", suggestions: memberSuggestions, search: memberSearch }), _jsx(RoleSelect, { value: role, onChange: setRole, roleCopy: props.roleCopy, allowedRoles: props.allowedRoles }), _jsx("button", { type: "button", onClick: handleAdd, disabled: !hasInviteEmail, className: BUTTON_PRIMARY_SM, children: "Add" })] }), shareError ? (_jsx("div", { role: "alert", className: "rounded-md border border-destructive/40 bg-destructive/10 px-3 py-2 text-xs text-destructive", children: shareError })) : null, hasInviteEmail ? (_jsxs("div", { className: "flex flex-wrap items-center gap-x-3 gap-y-2 text-xs text-muted-foreground", children: [_jsxs("label", { className: "inline-flex items-center gap-2", children: [_jsx("input", { type: "checkbox", checked: notifyPeople, onChange: (e) => setNotifyPeople(e.target.checked), className: "h-4 w-4 rounded border-input accent-primary" }), "Notify people"] }), notifyPeople ? (_jsx("button", { type: "button", "aria-expanded": messageOpen, onClick: () => setMessageOpen(!messageOpen), className: "rounded-sm px-1 py-0.5 font-medium text-foreground underline decoration-border underline-offset-2 transition-colors hover:bg-accent hover:text-accent-foreground", children: messageOpen ? "Hide message" : "Add a message" })) : null] })) : null, hasInviteEmail && notifyPeople && messageOpen ? (_jsx("div", { className: "rounded-md border border-border/70 bg-muted/20 p-2.5", children: _jsx("textarea", { "aria-label": "Message", placeholder: "Add a short note (optional)", value: shareMessage, onChange: (event) => setShareMessage(event.target.value), maxLength: 500, rows: 3, className: "w-full resize-y rounded-md border border-input bg-card px-3 py-2 text-sm text-foreground placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 focus:ring-offset-background" }) })) : null] })) : null, _jsxs("div", { children: [_jsx("div", { className: "mb-2 text-sm font-semibold", children: peopleAccessLabel }), _jsxs("ul", { className: "flex flex-col gap-1 list-none p-0 m-0", children: [data?.ownerEmail ? (_jsxs("li", { className: "flex items-center gap-3 px-1 py-1.5 text-sm", children: [_jsx(Avatar, { label: displayName(data.ownerEmail, knownMembers) }), _jsx("span", { className: "flex-1 min-w-0 truncate", children: displayName(data.ownerEmail, knownMembers) }), _jsx("span", { className: "text-xs text-muted-foreground", children: "Owner" })] })) : null, shares.map((s) => (_jsxs("li", { className: cn("flex items-center gap-3 px-1 py-1.5 text-sm", inFlight.has(keyOf(s)) && "opacity-60"), children: [_jsx(Avatar, { label: principalLabel(s, knownMembers), org: s.principalType === "org" }), _jsx("span", { className: "flex-1 min-w-0 truncate", children: principalLabel(s, knownMembers) }), canManage ? (_jsx(RoleSelect, { value: s.role, onChange: (r) => handleChangeRole(s, r), disabled: inFlight.has(keyOf(s)), plain: true, roleCopy: props.roleCopy, allowedRoles: props.allowedRoles })) : (_jsx("span", { className: "text-xs text-muted-foreground", children: roleMeta(s.role, props.roleCopy).label })), canManage ? (_jsx("button", { type: "button", "aria-label": "Remove", onClick: () => handleRemove(s), disabled: inFlight.has(keyOf(s)), className: BUTTON_GHOST_ICON, children: _jsx(IconTrash, { size: 14 }) })) : null] }, keyOf(s)))), !shares.length && !data?.ownerEmail ? (_jsx("li", { className: "px-1 py-1.5 text-sm text-muted-foreground", children: "No one has access yet." })) : null] })] })] }) })] }), _jsx("div", { className: "mb-2 text-sm font-semibold", children: generalAccessLabel }), _jsxs("div", { className: "mb-4 flex items-center gap-3", children: [_jsx("span", { "aria-hidden": true, className: "inline-flex h-9 w-9 shrink-0 items-center justify-center rounded-full bg-muted text-muted-foreground", children: _jsx(meta.Icon, { size: 16, strokeWidth: 1.75 }) }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx(VisibilitySelect, { value: visibility, onChange: handleVisibility, disabled: !canManage, visibilityCopy: props.visibilityCopy, allowPublic: policy.allowPublic }), _jsxs("div", { className: "mt-0.5 flex flex-wrap items-center gap-x-2 gap-y-1 text-xs text-muted-foreground", children: [_jsx("span", { className: "sr-only", children: meta.description }), visibility === "org" && props.hideInSearchControl ? (_jsx(AdvancedAccessPopover, { control: props.hideInSearchControl, canManage: canManage, onToggle: handleHideInSearch })) : null] })] })] }), shareError && !canManage ? (_jsx("div", { role: "alert", className: "mb-4 rounded-md border border-destructive/40 bg-destructive/10 px-3 py-2 text-xs text-destructive", children: shareError })) : null, props.accessNote ? (_jsx("div", { className: "mb-4 rounded-md border border-border bg-muted/35 p-3 text-xs text-muted-foreground", children: props.accessNote })) : null, showShareLinks && shareUrlPlacement === "bottom" ? shareLinks : null, props.shareFooterContent] }));
+    const sharePanel = isLoading ? (_jsxs("div", { children: [showShareLinks ? (_jsx("div", { className: "mb-4 h-9 rounded-md bg-muted animate-pulse" })) : null, _jsx("div", { className: "mb-2 text-sm font-semibold", children: generalAccessLabel }), _jsx("div", { className: "mb-4 h-9 rounded-md bg-muted animate-pulse" }), _jsx("div", { className: "mb-2 text-sm font-semibold", children: peopleAccessLabel }), _jsx("div", { className: "mb-4 h-7 rounded-md bg-muted animate-pulse" })] })) : (_jsxs("div", { children: [showShareLinks && shareUrlPlacement === "top" ? shareLinks : null, _jsxs("div", { className: "mb-4", children: [_jsx("div", { className: "mb-2 text-sm font-semibold", children: generalAccessLabel }), _jsxs("div", { className: "flex items-center gap-3", children: [_jsx("span", { "aria-hidden": true, className: "inline-flex h-9 w-9 shrink-0 items-center justify-center rounded-full bg-muted text-muted-foreground", children: _jsx(meta.Icon, { size: 16, strokeWidth: 1.75 }) }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx(VisibilitySelect, { value: visibility, onChange: handleVisibility, disabled: !canManage, visibilityCopy: props.visibilityCopy, allowPublic: policy.allowPublic }), _jsxs("div", { className: "mt-0.5 flex flex-wrap items-center gap-x-2 gap-y-1 text-xs text-muted-foreground", children: [_jsx("span", { className: "sr-only", children: meta.description }), visibility === "org" && props.hideInSearchControl ? (_jsx(AdvancedAccessPopover, { control: props.hideInSearchControl, canManage: canManage, onToggle: handleHideInSearch })) : null] })] })] })] }), _jsxs("div", { className: "mb-4 space-y-4", children: [_jsx("div", { className: "text-sm font-semibold", children: peopleAccessLabel }), canManage ? (_jsxs("div", { className: "space-y-2", children: [_jsxs("div", { className: "flex items-stretch gap-2", children: [_jsx(MemberAutocomplete, { value: inviteEmail, open: suggestionsOpen, onOpenChange: setSuggestionsOpen, onValueChange: (next) => {
+                                            onInviteEmailChange(next);
+                                            if (shareError)
+                                                setShareError(null);
+                                        }, onSelectMember: (member) => {
+                                            onInviteEmailChange(member.email);
+                                            setSuggestionsOpen(false);
+                                            if (shareError)
+                                                setShareError(null);
+                                        }, onSubmit: handleAdd, placeholder: policy.requireOrgMemberForUserShares
+                                            ? "Add people from your organization"
+                                            : "Add people by email", suggestions: memberSuggestions, search: memberSearch }), _jsx(RoleSelect, { value: role, onChange: setRole, roleCopy: props.roleCopy, allowedRoles: props.allowedRoles }), _jsx("button", { type: "button", onClick: handleAdd, disabled: !hasInviteEmail, className: BUTTON_PRIMARY_SM, children: "Add" })] }), shareError ? (_jsx("div", { role: "alert", className: "rounded-md border border-destructive/40 bg-destructive/10 px-3 py-2 text-xs text-destructive", children: shareError })) : null, hasInviteEmail ? (_jsxs("div", { className: "flex flex-wrap items-center gap-x-3 gap-y-2 text-xs text-muted-foreground", children: [_jsxs("label", { className: "inline-flex items-center gap-2", children: [_jsx("input", { type: "checkbox", checked: notifyPeople, onChange: (e) => setNotifyPeople(e.target.checked), className: "h-4 w-4 rounded border-input accent-primary" }), "Notify people"] }), notifyPeople ? (_jsx("button", { type: "button", "aria-expanded": messageOpen, onClick: () => setMessageOpen(!messageOpen), className: "rounded-sm px-1 py-0.5 font-medium text-foreground underline decoration-border underline-offset-2 transition-colors hover:bg-accent hover:text-accent-foreground", children: messageOpen ? "Hide message" : "Add a message" })) : null] })) : null, hasInviteEmail && notifyPeople && messageOpen ? (_jsx("div", { className: "rounded-md border border-border/70 bg-muted/20 p-2.5", children: _jsx("textarea", { "aria-label": "Message", placeholder: "Add a short note (optional)", value: shareMessage, onChange: (event) => setShareMessage(event.target.value), maxLength: 500, rows: 3, className: "w-full resize-y rounded-md border border-input bg-card px-3 py-2 text-sm text-foreground placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 focus:ring-offset-background" }) })) : null] })) : null, _jsxs("ul", { className: "flex list-none flex-col gap-1 p-0 m-0", children: [data?.ownerEmail ? (_jsxs("li", { className: "flex items-center gap-3 px-1 py-1.5 text-sm", children: [_jsx(Avatar, { label: displayName(data.ownerEmail, knownMembers) }), _jsx("span", { className: "flex-1 min-w-0 truncate", children: displayName(data.ownerEmail, knownMembers) }), _jsx("span", { className: "text-xs text-muted-foreground", children: "Owner" })] })) : null, shares.map((s) => (_jsxs("li", { className: cn("flex items-center gap-3 px-1 py-1.5 text-sm", inFlight.has(keyOf(s)) && "opacity-60"), children: [_jsx(Avatar, { label: principalLabel(s, knownMembers), org: s.principalType === "org" }), _jsx("span", { className: "flex-1 min-w-0 truncate", children: principalLabel(s, knownMembers) }), canManage ? (_jsx(RoleSelect, { value: s.role, onChange: (r) => handleChangeRole(s, r), disabled: inFlight.has(keyOf(s)), plain: true, roleCopy: props.roleCopy, allowedRoles: props.allowedRoles })) : (_jsx("span", { className: "text-xs text-muted-foreground", children: roleMeta(s.role, props.roleCopy).label })), canManage ? (_jsx("button", { type: "button", "aria-label": "Remove", onClick: () => handleRemove(s), disabled: inFlight.has(keyOf(s)), className: BUTTON_GHOST_ICON, children: _jsx(IconTrash, { size: 14 }) })) : null] }, keyOf(s)))), !shares.length && !data?.ownerEmail ? (_jsx("li", { className: "px-1 py-1.5 text-sm text-muted-foreground", children: "No one has access yet." })) : null] })] }), shareError && !canManage ? (_jsx("div", { role: "alert", className: "mb-4 rounded-md border border-destructive/40 bg-destructive/10 px-3 py-2 text-xs text-destructive", children: shareError })) : null, props.accessNote ? (_jsx("div", { className: "mb-4 rounded-md border border-border bg-muted/35 p-3 text-xs text-muted-foreground", children: props.accessNote })) : null, showShareLinks && shareUrlPlacement === "bottom" ? shareLinks : null, props.shareFooterContent] }));
     if (!hasTabs)
         return sharePanel;
     const tabs = [
@@ -280,7 +272,7 @@ function CopyLinkField({ value, label = "Share link", description, }) {
             setCopied(false);
         }
     };
-    return (_jsxs("div", { className: "mb-4", children: [_jsx("div", { className: "mb-2 text-sm font-semibold", children: label }), description ? (_jsx("div", { className: "mb-2 text-xs text-muted-foreground", children: description })) : null, _jsxs("div", { className: "flex min-w-0 items-center gap-2", children: [_jsx("input", { readOnly: true, value: value, className: "h-9 min-w-0 flex-1 rounded-md border border-input bg-card px-3 text-sm text-muted-foreground outline-none", onFocus: (event) => event.currentTarget.select() }), _jsxs("button", { type: "button", onClick: handleCopy, className: "inline-flex h-9 shrink-0 items-center gap-2 rounded-md border border-input bg-card px-3 text-sm font-medium text-foreground hover:bg-accent", children: [copied ? _jsx(IconCheck, { size: 15 }) : _jsx(IconCopy, { size: 15 }), copied ? "Copied" : "Copy"] })] })] }));
+    return (_jsxs("div", { className: "mb-4 flex items-center justify-between gap-4", children: [_jsxs("div", { className: "min-w-0", children: [_jsx("div", { className: "text-sm font-semibold", children: label }), description ? (_jsx("div", { className: "mt-1 text-xs text-muted-foreground", children: description })) : null] }), _jsxs("button", { type: "button", onClick: handleCopy, "aria-label": copied ? "Link copied" : "Copy", className: "inline-flex h-9 shrink-0 items-center gap-2 whitespace-nowrap rounded-md border border-input bg-card px-3 text-sm font-medium text-foreground hover:bg-accent", children: [copied ? _jsx(IconCheck, { size: 15 }) : _jsx(IconLink, { size: 15 }), copied ? "Copied" : "Copy"] })] }));
 }
 // ---------------------------------------------------------------------------
 // Radix Select wrappers styled like shadcn Select (no native <select> anywhere)