@nadicodeai/ui 0.1.0

package/dist/components/agent-composer.js

@@ -0,0 +1,60 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { AtSignIcon, SlashIcon } from "lucide-react";
+import { Attachment, AttachmentInfo, AttachmentPreview, AttachmentRemove, Attachments, } from "./ai-elements/attachments.js";
+import { PromptInput, PromptInputBody, PromptInputFooter, PromptInputHeader, PromptInputSubmit, PromptInputTextarea, PromptInputTools, } from "./ai-elements/prompt-input.js";
+import { Queue, QueueItem, QueueItemContent, QueueItemDescription, QueueItemIndicator, QueueList, QueueSection, QueueSectionContent, QueueSectionLabel, QueueSectionTrigger, } from "./ai-elements/queue.js";
+import { getAgentRedactionText, } from "./artifact-panel.js";
+import { Badge } from "./badge.js";
+import { Button } from "./button.js";
+import { agentAttachmentToData } from "../lib/agent-attachment.js";
+import { cn } from "../lib/utils.js";
+const queueStatusLabels = {
+    blocked: "Blocked",
+    complete: "Complete",
+    interrupted: "Interrupted",
+    queued: "Queued",
+    running: "Running",
+};
+function composerStateToChatStatus(state) {
+    if (state === "streaming") {
+        return "streaming";
+    }
+    if (state === "submitting") {
+        return "submitted";
+    }
+    if (state === "error") {
+        return "error";
+    }
+    return "ready";
+}
+function AgentComposerAttachments({ attachments, onRemoveAttachment, }) {
+    if (!attachments?.length) {
+        return null;
+    }
+    return (_jsx(Attachments, { "data-slot": "agent-composer-attachments", variant: "list", className: "w-full", children: attachments.map((attachment) => (_jsxs(Attachment, { data: agentAttachmentToData(attachment), onRemove: onRemoveAttachment
+                ? () => onRemoveAttachment(attachment)
+                : undefined, children: [_jsx(AttachmentPreview, {}), _jsx(AttachmentInfo, { showMediaType: true }), attachment.sizeLabel && (_jsx("span", { className: "text-xs text-muted-foreground", children: attachment.sizeLabel })), attachment.redaction && (_jsx("span", { className: "sr-only", children: getAgentRedactionText(attachment.redaction) })), _jsx(AttachmentRemove, {})] }, attachment.id))) }));
+}
+function AgentQueuePanel({ queue, actions, className, }) {
+    if (!queue.items.length) {
+        return null;
+    }
+    return (_jsx(Queue, { "data-slot": "agent-queue", className: className, children: _jsxs(QueueSection, { defaultOpen: true, children: [_jsx(QueueSectionTrigger, { children: _jsx(QueueSectionLabel, { count: queue.items.length, label: queue.title ?? "queued tasks" }) }), _jsxs(QueueSectionContent, { children: [queue.description && (_jsx("p", { className: "px-3 pt-2 text-sm text-muted-foreground", children: queue.description })), _jsx(QueueList, { children: queue.items.map((item) => {
+                                const status = item.status ?? "queued";
+                                const completed = status === "complete";
+                                return (_jsxs(QueueItem, { "data-queue-status": status, className: "gap-2", children: [_jsxs("div", { className: "flex items-start gap-2", children: [_jsx(QueueItemIndicator, { completed: completed }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx(QueueItemContent, { completed: completed, children: item.redaction
+                                                                ? getAgentRedactionText(item.redaction)
+                                                                : item.title }), item.description && (_jsx(QueueItemDescription, { completed: completed, children: item.description }))] }), _jsx(Badge, { variant: "outline", children: queueStatusLabels[status] }), actions?.[item.id]] }), _jsx(AgentComposerAttachments, { attachments: item.attachments })] }, item.id));
+                            }) })] })] }) }));
+}
+function AgentComposer({ value, defaultValue, placeholder = "Ask Nadia to work on this...", attachments = [], queue, state = "idle", disabled = false, slashMenu, mentionMenu, tools, submitLabel = "Submit", stopLabel = "Stop", onValueChange, onSubmit, onStop, onRemoveAttachment, queueActions, footer, className, ...props }) {
+    const isDisabled = disabled || state === "disabled" || state === "submitting";
+    const isStreaming = state === "streaming";
+    return (_jsxs("div", { "data-slot": "agent-composer-shell", "data-composer-state": state, "data-disabled": isDisabled ? true : undefined, className: "grid gap-3", children: [queue && _jsx(AgentQueuePanel, { queue: queue, actions: queueActions }), _jsxs(PromptInput, { "data-slot": "agent-composer", className: cn("rounded-lg border bg-[var(--nc-composer-surface)] text-[var(--nc-composer-foreground)]", className), onSubmit: (message, event) => onSubmit?.({
+                    attachments,
+                    queue,
+                    value: message.text,
+                }, event), ...props, children: [(attachments.length > 0 || slashMenu || mentionMenu) && (_jsxs(PromptInputHeader, { children: [_jsx(AgentComposerAttachments, { attachments: attachments, onRemoveAttachment: onRemoveAttachment }), slashMenu && (_jsx("div", { "data-slot": "agent-composer-slash-menu", children: slashMenu })), mentionMenu && (_jsx("div", { "data-slot": "agent-composer-mention-menu", children: mentionMenu }))] })), _jsx(PromptInputBody, { children: _jsx(PromptInputTextarea, { value: value, defaultValue: defaultValue, placeholder: placeholder, disabled: isDisabled || isStreaming, onChange: (event) => onValueChange?.(event.currentTarget.value) }) }), _jsxs(PromptInputFooter, { children: [_jsxs(PromptInputTools, { children: [tools, !slashMenu && (_jsxs(Button, { "aria-label": "Slash commands", title: "Slash commands", type: "button", variant: "ghost", size: "icon-sm", disabled: isDisabled, children: [_jsx(SlashIcon, { className: "size-4", "data-icon": true }), _jsx("span", { className: "sr-only", children: "Slash commands" })] })), !mentionMenu && (_jsxs(Button, { "aria-label": "Mention context", title: "Mention context", type: "button", variant: "ghost", size: "icon-sm", disabled: isDisabled, children: [_jsx(AtSignIcon, { className: "size-4", "data-icon": true }), _jsx("span", { className: "sr-only", children: "Mention context" })] }))] }), _jsx(PromptInputSubmit, { "aria-label": isStreaming ? stopLabel : submitLabel, status: composerStateToChatStatus(state), onStop: onStop, disabled: isStreaming ? !onStop : isDisabled })] })] }), footer && _jsx("div", { "data-slot": "agent-composer-footer", children: footer })] }));
+}
+export { AgentComposer, AgentComposerAttachments, AgentQueuePanel, };

package/dist/components/agent-message.d.ts

@@ -0,0 +1,116 @@
+import * as React from "react";
+import { type AgentArtifactModel, type AgentRedactionRule } from "./artifact-panel";
+import { type AgentApprovalChoice, type AgentToolApprovalRequest } from "./agent-tool-approval";
+export type AgentMessageRole = "user" | "assistant" | "system";
+export type AgentWorkState = "idle" | "empty" | "queued" | "streaming" | "interrupted" | "retryable" | "permission-denied" | "fatal";
+export type AgentMessageSourceKind = "human" | "agent" | "system" | "tool" | "runtime";
+export type AgentMessageSourceMetadata = {
+    kind: AgentMessageSourceKind;
+    label?: string;
+    model?: string;
+    sessionId?: string;
+    timestamp?: string;
+};
+export type AgentSourceReference = {
+    id: string;
+    title: string;
+    url?: string;
+    excerpt?: string;
+    kind?: "document" | "web" | "file" | "system";
+    redaction?: AgentRedactionRule;
+};
+export type AgentReasoningSummary = {
+    id: string;
+    title?: string;
+    summary?: string;
+    status?: "available" | "streaming" | "redacted";
+    durationSeconds?: number;
+    redaction?: AgentRedactionRule;
+};
+export type AgentToolCallStatus = "pending" | "running" | "success" | "error" | "denied" | "approval-requested" | "approval-responded";
+export type AgentToolCallModel = {
+    id: string;
+    name: string;
+    title?: string;
+    status: AgentToolCallStatus;
+    input?: unknown;
+    output?: unknown;
+    error?: string;
+    trace?: string;
+    approval?: AgentToolApprovalRequest;
+    redaction?: AgentRedactionRule;
+};
+export type AgentToolApprovalDecisionHandler = (choice: AgentApprovalChoice, request: AgentToolApprovalRequest, toolCall: AgentToolCallModel) => void;
+export type AgentAttachmentModel = {
+    id: string;
+    type: "file" | "image" | "audio" | "video" | "source";
+    name: string;
+    mediaType?: string;
+    url?: string;
+    sizeLabel?: string;
+    redaction?: AgentRedactionRule;
+};
+export type AgentMessageTextPart = {
+    type: "text";
+    text: string;
+    redaction?: AgentRedactionRule;
+};
+export type AgentMessageReasoningPart = {
+    type: "reasoning";
+    reasoning: AgentReasoningSummary;
+};
+export type AgentMessageToolPart = {
+    type: "tool";
+    toolCall: AgentToolCallModel;
+};
+export type AgentMessageSourcePart = {
+    type: "source";
+    source: AgentSourceReference;
+};
+export type AgentMessageArtifactPart = {
+    type: "artifact";
+    artifact: AgentArtifactModel;
+};
+export type AgentMessageStatePart = {
+    type: "state";
+    state: Exclude<AgentWorkState, "empty" | "idle">;
+    title?: string;
+    description?: string;
+};
+export type AgentMessagePart = AgentMessageTextPart | AgentMessageReasoningPart | AgentMessageToolPart | AgentMessageSourcePart | AgentMessageArtifactPart | AgentMessageStatePart;
+export type AgentMessageModel = {
+    id: string;
+    role: AgentMessageRole;
+    content?: string;
+    metadata?: AgentMessageSourceMetadata;
+    state?: Exclude<AgentWorkState, "empty">;
+    parts?: AgentMessagePart[];
+    attachments?: AgentAttachmentModel[];
+    sources?: AgentSourceReference[];
+    redaction?: AgentRedactionRule;
+};
+declare function AgentMessageStateNotice({ state, title, description, actions, }: {
+    state: Exclude<AgentWorkState, "empty" | "idle">;
+    title?: React.ReactNode;
+    description?: React.ReactNode;
+    actions?: React.ReactNode;
+}): React.JSX.Element;
+declare function AgentAttachmentsList({ attachments, }: {
+    attachments?: AgentAttachmentModel[];
+}): React.JSX.Element | null;
+declare function AgentSourcesList({ sources }: {
+    sources?: AgentSourceReference[];
+}): React.JSX.Element | null;
+declare function AgentToolCall({ toolCall, actions, onApprovalChoice, }: {
+    toolCall: AgentToolCallModel;
+    actions?: React.ReactNode;
+    onApprovalChoice?: AgentToolApprovalDecisionHandler;
+}): React.JSX.Element;
+declare function AgentMessage({ message, toolActions, retryAction, onToolApprovalChoice, className, ...props }: Omit<React.ComponentProps<"article">, "children"> & {
+    message: AgentMessageModel;
+    toolActions?: Record<string, React.ReactNode>;
+    retryAction?: React.ReactNode;
+    onToolApprovalChoice?: AgentToolApprovalDecisionHandler;
+}): React.JSX.Element;
+export { AgentAttachmentsList, AgentMessage, AgentMessageStateNotice, AgentSourcesList, AgentToolCall, };
+//# sourceMappingURL=agent-message.d.ts.map

package/dist/components/agent-message.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"agent-message.d.ts","sourceRoot":"","sources":["../../src/components/agent-message.tsx"],"names":[],"mappings":"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"}

package/dist/components/agent-message.js

@@ -0,0 +1,110 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { AlertTriangleIcon, BotIcon, ClockIcon, FileWarningIcon, InfoIcon, LoaderCircleIcon, RefreshCwIcon, ShieldXIcon, UserIcon, } from "lucide-react";
+import { Attachment, AttachmentInfo, AttachmentPreview, Attachments, } from "./ai-elements/attachments.js";
+import { Message, MessageContent, MessageResponse, } from "./ai-elements/message.js";
+import { Reasoning, ReasoningContent, ReasoningTrigger, } from "./ai-elements/reasoning.js";
+import { Source, Sources, SourcesContent, SourcesTrigger, } from "./ai-elements/sources.js";
+import { Tool, ToolContent, ToolHeader, ToolInput, ToolOutput, } from "./ai-elements/tool.js";
+import { ArtifactPanel, RedactedNotice, StackTraceDisclosure, getAgentRedactionText, } from "./artifact-panel.js";
+import { AgentToolApproval, } from "./agent-tool-approval.js";
+import { Badge } from "./badge.js";
+import { agentAttachmentToData } from "../lib/agent-attachment.js";
+import { cn } from "../lib/utils.js";
+const roleIcons = {
+    assistant: BotIcon,
+    system: InfoIcon,
+    user: UserIcon,
+};
+const stateLabels = {
+    empty: "Empty",
+    fatal: "Fatal",
+    idle: "Idle",
+    interrupted: "Interrupted",
+    "permission-denied": "Permission denied",
+    queued: "Queued",
+    retryable: "Retryable",
+    streaming: "Streaming",
+};
+const stateIcons = {
+    fatal: FileWarningIcon,
+    interrupted: AlertTriangleIcon,
+    "permission-denied": ShieldXIcon,
+    queued: ClockIcon,
+    retryable: RefreshCwIcon,
+    streaming: LoaderCircleIcon,
+};
+const toolStatusToAiState = {
+    "approval-requested": "approval-requested",
+    "approval-responded": "approval-responded",
+    denied: "output-denied",
+    error: "output-error",
+    pending: "input-streaming",
+    running: "input-available",
+    success: "output-available",
+};
+function AgentMessageStateNotice({ state, title, description, actions, }) {
+    const Icon = stateIcons[state];
+    return (_jsxs("div", { "data-slot": "agent-message-state", "data-agent-state": state, role: state === "fatal" || state === "permission-denied" ? "alert" : "status", className: "flex flex-wrap items-center gap-3 rounded-md border bg-muted/30 px-3 py-2 text-sm", children: [_jsx(Icon, { className: cn("size-4 text-muted-foreground", state === "streaming" && "animate-spin") }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("div", { className: "font-medium", children: title ?? stateLabels[state] }), description && (_jsx("div", { className: "text-muted-foreground", children: description }))] }), actions] }));
+}
+function AgentAttachmentsList({ attachments, }) {
+    if (!attachments?.length) {
+        return null;
+    }
+    return (_jsx(Attachments, { "data-slot": "agent-message-attachments", variant: "inline", className: "max-w-full", children: attachments.map((attachment) => (_jsxs(Attachment, { data: agentAttachmentToData(attachment), children: [_jsx(AttachmentPreview, {}), _jsx(AttachmentInfo, { showMediaType: true }), attachment.redaction && (_jsx("span", { className: "sr-only", children: getAgentRedactionText(attachment.redaction) }))] }, attachment.id))) }));
+}
+function AgentSourcesList({ sources }) {
+    if (!sources?.length) {
+        return null;
+    }
+    return (_jsxs(Sources, { "data-slot": "agent-message-sources", children: [_jsx(SourcesTrigger, { count: sources.length }), _jsx(SourcesContent, { forceMount: true, children: sources.map((source) => (_jsx(Source, { href: source.url ?? "#", title: source.redaction
+                        ? getAgentRedactionText(source.redaction)
+                        : source.title }, source.id))) })] }));
+}
+function AgentReasoningBlock({ reasoning, }) {
+    return (_jsxs(Reasoning, { "data-slot": "agent-reasoning-summary", "data-reasoning-status": reasoning.status, isStreaming: reasoning.status === "streaming", defaultOpen: reasoning.status === "streaming", duration: reasoning.durationSeconds, children: [_jsx(ReasoningTrigger, { getThinkingMessage: (isStreaming) => reasoning.title ??
+                    (isStreaming ? "Preparing reasoning summary" : "Reasoning summary") }), reasoning.redaction ? (_jsx("div", { className: "mt-3", children: _jsx(RedactedNotice, { redaction: reasoning.redaction }) })) : (_jsx(ReasoningContent, { children: reasoning.summary ?? "No reasoning summary supplied." }))] }));
+}
+function AgentToolCall({ toolCall, actions, onApprovalChoice, }) {
+    const state = toolStatusToAiState[toolCall.status];
+    return (_jsxs(Tool, { "data-slot": "agent-tool-call", "data-tool-status": toolCall.status, defaultOpen: true, children: [_jsx(ToolHeader, { type: `tool-${toolCall.name}`, state: state, title: toolCall.title ?? toolCall.name }), _jsxs(ToolContent, { children: [toolCall.approval && (_jsx(AgentToolApproval, { request: toolCall.approval, disabled: !onApprovalChoice, onChoice: onApprovalChoice
+                            ? (choice, request) => onApprovalChoice(choice, request, toolCall)
+                            : undefined })), toolCall.redaction ? (_jsx(RedactedNotice, { redaction: toolCall.redaction })) : (_jsxs(_Fragment, { children: [toolCall.input !== undefined && (_jsx(ToolInput, { input: toolCall.input })), (toolCall.output !== undefined || toolCall.error) && (_jsx(ToolOutput, { output: toolCall.output, errorText: toolCall.error }))] })), !toolCall.redaction && toolCall.trace && (_jsx(StackTraceDisclosure, { trace: toolCall.trace })), actions] })] }));
+}
+function AgentMessagePartView({ part, toolActions, onToolApprovalChoice, }) {
+    if (part.type === "text") {
+        if (part.redaction) {
+            return _jsx(RedactedNotice, { redaction: part.redaction });
+        }
+        return _jsx(MessageResponse, { children: part.text });
+    }
+    if (part.type === "reasoning") {
+        return _jsx(AgentReasoningBlock, { reasoning: part.reasoning });
+    }
+    if (part.type === "tool") {
+        return (_jsx(AgentToolCall, { toolCall: part.toolCall, actions: toolActions?.[part.toolCall.id], onApprovalChoice: onToolApprovalChoice }));
+    }
+    if (part.type === "source") {
+        return _jsx(AgentSourcesList, { sources: [part.source] });
+    }
+    if (part.type === "artifact") {
+        return _jsx(ArtifactPanel, { artifact: part.artifact });
+    }
+    return (_jsx(AgentMessageStateNotice, { state: part.state, title: part.title, description: part.description }));
+}
+function AgentMessageMeta({ role, metadata, state, }) {
+    const Icon = roleIcons[role];
+    const label = metadata?.label ?? role;
+    return (_jsxs("div", { "data-slot": "agent-message-meta", className: "flex flex-wrap items-center gap-2 text-xs text-muted-foreground", children: [_jsx(Icon, { className: "size-3.5" }), _jsx("span", { className: "font-medium capitalize", children: label }), metadata?.model && _jsx(Badge, { variant: "outline", children: metadata.model }), metadata?.timestamp && _jsx("span", { children: metadata.timestamp }), state && state !== "idle" && (_jsx(Badge, { variant: "secondary", children: stateLabels[state] }))] }));
+}
+function AgentMessage({ message, toolActions, retryAction, onToolApprovalChoice, className, ...props }) {
+    const parts = message.parts ??
+        (message.content
+            ? [{ text: message.content, type: "text" }]
+            : []);
+    const aiRole = message.role === "user" ? "user" : "assistant";
+    return (_jsx("article", { "data-slot": "agent-message", "data-message-role": message.role, "data-agent-state": message.state, className: className, ...props, children: _jsxs(Message, { from: aiRole, className: cn("max-w-full", message.role === "system" && "mx-auto border-y bg-muted/20 px-4 py-3"), children: [_jsx(AgentMessageMeta, { role: message.role, metadata: message.metadata, state: message.state }), _jsxs(MessageContent, { className: cn("w-full", message.role === "system" && "text-muted-foreground"), children: [_jsx(AgentAttachmentsList, { attachments: message.attachments }), message.redaction ? (_jsx(RedactedNotice, { redaction: message.redaction })) : (parts.map((part, index) => (_jsx(AgentMessagePartView, { part: part, toolActions: toolActions, onToolApprovalChoice: onToolApprovalChoice }, `${message.id}-${part.type}-${index}`)))), _jsx(AgentSourcesList, { sources: message.sources }), message.state &&
+                            message.state !== "idle" &&
+                            message.state !== "streaming" && (_jsx(AgentMessageStateNotice, { state: message.state, actions: message.state === "retryable" ? retryAction : undefined }))] })] }) }));
+}
+export { AgentAttachmentsList, AgentMessage, AgentMessageStateNotice, AgentSourcesList, AgentToolCall, };

package/dist/components/agent-thread.d.ts

@@ -0,0 +1,26 @@
+import * as React from "react";
+import { Conversation } from "./ai-elements/conversation";
+import { type AgentMessageModel, type AgentToolApprovalDecisionHandler, type AgentWorkState } from "./agent-message";
+export type AgentThreadStateCopy = {
+    title?: React.ReactNode;
+    description?: React.ReactNode;
+    actions?: React.ReactNode;
+};
+declare function AgentThreadStateBanner({ state, title, description, actions, }: AgentThreadStateCopy & {
+    state: Exclude<AgentWorkState, "idle" | "empty">;
+}): React.JSX.Element;
+declare function AgentThreadEmptyState({ title, description, actions, }: AgentThreadStateCopy): React.JSX.Element;
+declare function AgentThread({ messages, state, stateCopy, emptyState, toolActions, retryAction, onToolApprovalChoice, maxMessages, className, contentClassName, children, ...props }: Omit<React.ComponentProps<typeof Conversation>, "children"> & {
+    messages: AgentMessageModel[];
+    state?: AgentWorkState;
+    stateCopy?: Partial<Record<Exclude<AgentWorkState, "idle">, AgentThreadStateCopy>>;
+    emptyState?: AgentThreadStateCopy;
+    toolActions?: Record<string, React.ReactNode>;
+    retryAction?: React.ReactNode;
+    onToolApprovalChoice?: AgentToolApprovalDecisionHandler;
+    maxMessages?: number;
+    contentClassName?: string;
+    children?: React.ReactNode;
+}): React.JSX.Element;
+export { AgentThread, AgentThreadEmptyState, AgentThreadStateBanner };
+//# sourceMappingURL=agent-thread.d.ts.map

package/dist/components/agent-thread.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"agent-thread.d.ts","sourceRoot":"","sources":["../../src/components/agent-thread.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAU9B,OAAO,EACL,YAAY,EAEb,MAAM,uCAAuC,CAAA;AAC9C,OAAO,EAEL,KAAK,iBAAiB,EACtB,KAAK,gCAAgC,EACrC,KAAK,cAAc,EACpB,MAAM,4BAA4B,CAAA;AAInC,MAAM,MAAM,oBAAoB,GAAG;IACjC,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACvB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC7B,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC1B,CAAA;AA8CD,iBAAS,sBAAsB,CAAC,EAC9B,KAAK,EACL,KAAK,EACL,WAAW,EACX,OAAO,GACR,EAAE,oBAAoB,GAAG;IACxB,KAAK,EAAE,OAAO,CAAC,cAAc,EAAE,MAAM,GAAG,OAAO,CAAC,CAAA;CACjD,qBA0BA;AAED,iBAAS,qBAAqB,CAAC,EAC7B,KAAK,EACL,WAAW,EACX,OAAO,GACR,EAAE,oBAAoB,qBAYtB;AAiBD,iBAAS,WAAW,CAAC,EACnB,QAAQ,EACR,KAAc,EACd,SAAS,EACT,UAAU,EACV,WAAW,EACX,WAAW,EACX,oBAAoB,EACpB,WAA2C,EAC3C,SAAS,EACT,gBAAgB,EAChB,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,YAAY,CAAC,EAAE,UAAU,CAAC,GAAG;IAC/D,QAAQ,EAAE,iBAAiB,EAAE,CAAA;IAC7B,KAAK,CAAC,EAAE,cAAc,CAAA;IACtB,SAAS,CAAC,EAAE,OAAO,CAAC,MAAM,CAAC,OAAO,CAAC,cAAc,EAAE,MAAM,CAAC,EAAE,oBAAoB,CAAC,CAAC,CAAA;IAClF,UAAU,CAAC,EAAE,oBAAoB,CAAA;IACjC,WAAW,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC,CAAA;IAC7C,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC7B,oBAAoB,CAAC,EAAE,gCAAgC,CAAA;IACvD,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC3B,qBAqDA;AAED,OAAO,EAAE,WAAW,EAAE,qBAAqB,EAAE,sBAAsB,EAAE,CAAA"}

package/dist/components/agent-thread.js

@@ -0,0 +1,72 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { AlertTriangleIcon, ClockIcon, FileWarningIcon, LoaderCircleIcon, RefreshCwIcon, ShieldXIcon, } from "lucide-react";
+import { Conversation, ConversationContent, } from "./ai-elements/conversation.js";
+import { AgentMessage, } from "./agent-message.js";
+import { FeedbackState } from "./feedback-state.js";
+import { cn } from "../lib/utils.js";
+const threadStateDefaults = {
+    empty: {
+        description: "Start with a prompt or queue an agent task.",
+        icon: ClockIcon,
+        title: "No agent messages",
+    },
+    fatal: {
+        description: "The consuming app should show its recovery action here.",
+        icon: FileWarningIcon,
+        title: "Unable to continue",
+    },
+    interrupted: {
+        description: "The current run stopped before the agent finished.",
+        icon: AlertTriangleIcon,
+        title: "Run interrupted",
+    },
+    "permission-denied": {
+        description: "This session cannot access the requested action or content.",
+        icon: ShieldXIcon,
+        title: "Permission denied",
+    },
+    queued: {
+        description: "The next agent step is waiting for capacity or approval.",
+        icon: ClockIcon,
+        title: "Queued",
+    },
+    retryable: {
+        description: "The run can be attempted again by the consuming app.",
+        icon: RefreshCwIcon,
+        title: "Retry available",
+    },
+    streaming: {
+        description: "The assistant is preparing a response.",
+        icon: LoaderCircleIcon,
+        title: "Streaming",
+    },
+};
+const defaultMaxAgentThreadMessages = 50;
+function AgentThreadStateBanner({ state, title, description, actions, }) {
+    const fallback = threadStateDefaults[state];
+    const Icon = fallback.icon;
+    return (_jsxs("div", { "data-slot": "agent-thread-state", "data-agent-state": state, role: state === "fatal" || state === "permission-denied" ? "alert" : "status", className: "flex flex-wrap items-center gap-3 rounded-lg border bg-muted/30 px-4 py-3 text-sm", children: [_jsx(Icon, { className: cn("size-4 text-muted-foreground", state === "streaming" && "animate-spin") }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("div", { className: "font-medium", children: title ?? fallback.title }), _jsx("div", { className: "text-muted-foreground", children: description ?? fallback.description })] }), actions] }));
+}
+function AgentThreadEmptyState({ title, description, actions, }) {
+    return (_jsx(FeedbackState, { "data-slot": "agent-thread-empty-state", status: "empty", title: title ?? threadStateDefaults.empty.title, description: description ?? threadStateDefaults.empty.description, actions: actions, compact: true, className: "min-h-56 rounded-lg bg-muted/20" }));
+}
+function AgentThreadOverflowSummary({ omittedMessages, }) {
+    return (_jsxs("div", { "data-slot": "agent-thread-overflow-summary", className: "rounded-md border bg-muted/30 px-3 py-2 text-muted-foreground text-xs", children: [omittedMessages, " earlier messages not shown."] }));
+}
+function AgentThread({ messages, state = "idle", stateCopy, emptyState, toolActions, retryAction, onToolApprovalChoice, maxMessages = defaultMaxAgentThreadMessages, className, contentClassName, children, ...props }) {
+    const maxVisibleMessages = Number.isFinite(maxMessages)
+        ? Math.max(0, Math.floor(maxMessages))
+        : defaultMaxAgentThreadMessages;
+    const visibleMessages = maxVisibleMessages > 0 ? messages.slice(-maxVisibleMessages) : [];
+    const omittedMessages = messages.length - visibleMessages.length;
+    const hasMessages = messages.length > 0;
+    const nonIdleState = state === "idle" ? undefined : state;
+    const stateForRender = nonIdleState && nonIdleState !== "empty" ? nonIdleState : undefined;
+    const stateProps = nonIdleState ? stateCopy?.[nonIdleState] : undefined;
+    const stateActions = stateForRender === "retryable"
+        ? retryAction ?? stateProps?.actions
+        : stateProps?.actions;
+    return (_jsx(Conversation, { "data-slot": "agent-thread", "data-agent-state": state, className: cn("min-h-0 rounded-lg border bg-[var(--nc-chat-surface)]", className), ...props, children: _jsxs(ConversationContent, { className: cn("gap-4", contentClassName), children: [stateForRender && (_jsx(AgentThreadStateBanner, { state: stateForRender, actions: stateActions, title: stateProps?.title, description: stateProps?.description })), omittedMessages > 0 && (_jsx(AgentThreadOverflowSummary, { omittedMessages: omittedMessages })), !hasMessages ? (_jsx(AgentThreadEmptyState, { ...(stateProps ?? emptyState ?? {}) })) : (visibleMessages.map((message) => (_jsx(AgentMessage, { message: message, toolActions: toolActions, retryAction: retryAction, onToolApprovalChoice: onToolApprovalChoice }, message.id)))), children] }) }));
+}
+export { AgentThread, AgentThreadEmptyState, AgentThreadStateBanner };

package/dist/components/agent-tool-approval.d.ts

@@ -0,0 +1,32 @@
+import * as React from "react";
+import { Card } from "./card";
+export type AgentApprovalChoice = "run" | "deny" | "session" | "always";
+export type AgentApprovalAlias = "approve-once" | "reject" | "approve-session" | "approve-always";
+export type AgentApprovalRisk = "low" | "review" | "elevated" | "blocked";
+export type AgentToolApprovalRequest = {
+    id: string;
+    toolName: string;
+    title?: string;
+    description?: string;
+    scope?: string;
+    risk?: AgentApprovalRisk;
+    choices?: AgentApprovalChoice[];
+};
+export declare const agentApprovalAliases: {
+    readonly always: "approve-always";
+    readonly deny: "reject";
+    readonly run: "approve-once";
+    readonly session: "approve-session";
+};
+declare function AgentToolApproval({ request, title, description, choices, choiceLabels, onChoice, disabled, footer, className, ...props }: Omit<React.ComponentProps<typeof Card>, "children" | "title"> & {
+    request: AgentToolApprovalRequest;
+    title?: React.ReactNode;
+    description?: React.ReactNode;
+    choices?: AgentApprovalChoice[];
+    choiceLabels?: Partial<Record<AgentApprovalChoice, React.ReactNode>>;
+    onChoice?: (choice: AgentApprovalChoice, request: AgentToolApprovalRequest) => void;
+    disabled?: boolean;
+    footer?: React.ReactNode;
+}): React.JSX.Element;
+export { AgentToolApproval };
+//# sourceMappingURL=agent-tool-approval.d.ts.map

package/dist/components/agent-tool-approval.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"agent-tool-approval.d.ts","sourceRoot":"","sources":["../../src/components/agent-tool-approval.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAU9B,OAAO,EACL,IAAI,EAML,MAAM,mBAAmB,CAAA;AAG1B,MAAM,MAAM,mBAAmB,GAAG,KAAK,GAAG,MAAM,GAAG,SAAS,GAAG,QAAQ,CAAA;AAEvE,MAAM,MAAM,kBAAkB,GAC1B,cAAc,GACd,QAAQ,GACR,iBAAiB,GACjB,gBAAgB,CAAA;AAEpB,MAAM,MAAM,iBAAiB,GAAG,KAAK,GAAG,QAAQ,GAAG,UAAU,GAAG,SAAS,CAAA;AAEzE,MAAM,MAAM,wBAAwB,GAAG;IACrC,EAAE,EAAE,MAAM,CAAA;IACV,QAAQ,EAAE,MAAM,CAAA;IAChB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,iBAAiB,CAAA;IACxB,OAAO,CAAC,EAAE,mBAAmB,EAAE,CAAA;CAChC,CAAA;AAED,eAAO,MAAM,oBAAoB;;;;;CAKmC,CAAA;AAgDpE,iBAAS,iBAAiB,CAAC,EACzB,OAAO,EACP,KAAK,EACL,WAAW,EACX,OAAiE,EACjE,YAAY,EACZ,QAAQ,EACR,QAAgB,EAChB,MAAM,EACN,SAAS,EACT,GAAG,KAAK,EACT,EAAE,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,IAAI,CAAC,EAAE,UAAU,GAAG,OAAO,CAAC,GAAG;IACjE,OAAO,EAAE,wBAAwB,CAAA;IACjC,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IACvB,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC7B,OAAO,CAAC,EAAE,mBAAmB,EAAE,CAAA;IAC/B,YAAY,CAAC,EAAE,OAAO,CAAC,MAAM,CAAC,mBAAmB,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC,CAAA;IACpE,QAAQ,CAAC,EAAE,CACT,MAAM,EAAE,mBAAmB,EAC3B,OAAO,EAAE,wBAAwB,KAC9B,IAAI,CAAA;IACT,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CACzB,qBA4DA;AAED,OAAO,EAAE,iBAAiB,EAAE,CAAA"}

package/dist/components/agent-tool-approval.js

@@ -0,0 +1,61 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { BanIcon, CheckIcon, ClockIcon, ShieldCheckIcon, } from "lucide-react";
+import { Badge } from "./badge.js";
+import { Button } from "./button.js";
+import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, } from "./card.js";
+import { cn } from "../lib/utils.js";
+export const agentApprovalAliases = {
+    always: "approve-always",
+    deny: "reject",
+    run: "approve-once",
+    session: "approve-session",
+};
+const approvalChoiceDefaults = {
+    always: {
+        icon: ShieldCheckIcon,
+        label: "Always allow",
+        variant: "secondary",
+    },
+    deny: {
+        icon: BanIcon,
+        label: "Deny",
+        variant: "destructive",
+    },
+    run: {
+        icon: CheckIcon,
+        label: "Run once",
+        variant: "default",
+    },
+    session: {
+        icon: ClockIcon,
+        label: "Allow this session",
+        variant: "outline",
+    },
+};
+const approvalRiskLabels = {
+    blocked: "Blocked",
+    elevated: "Elevated",
+    low: "Low risk",
+    review: "Review",
+};
+function getApprovalChoiceClass(choice) {
+    if (choice === "run") {
+        return "data-[variant=outline]:text-[var(--nc-tool-approval-run)]";
+    }
+    if (choice === "deny") {
+        return "data-[variant=outline]:text-[var(--nc-tool-approval-deny)]";
+    }
+    if (choice === "session") {
+        return "data-[variant=outline]:text-[var(--nc-tool-approval-session)]";
+    }
+    return "data-[variant=outline]:text-[var(--nc-tool-approval-always)]";
+}
+function AgentToolApproval({ request, title, description, choices = request.choices ?? ["run", "deny", "session", "always"], choiceLabels, onChoice, disabled = false, footer, className, ...props }) {
+    return (_jsxs(Card, { "data-slot": "agent-tool-approval", "data-tool-name": request.toolName, "data-risk": request.risk, className: cn("gap-4 border-dashed bg-muted/20 shadow-none", className), ...props, children: [_jsxs(CardHeader, { className: "gap-2", children: [_jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [request.risk && (_jsx(Badge, { variant: "outline", children: approvalRiskLabels[request.risk] })), _jsx(Badge, { variant: "secondary", children: request.toolName })] }), _jsx(CardTitle, { children: title ?? request.title ?? "Approval required" }), (description ?? request.description) && (_jsx(CardDescription, { children: description ?? request.description })), request.scope && (_jsx(CardDescription, { "data-slot": "agent-tool-approval-scope", children: request.scope }))] }), _jsx(CardContent, { children: _jsx("div", { "data-slot": "agent-tool-approval-choices", className: "flex flex-wrap gap-2", children: choices.map((choice) => {
+                        const defaults = approvalChoiceDefaults[choice];
+                        const Icon = defaults.icon;
+                        return (_jsxs(Button, { type: "button", variant: defaults.variant, disabled: disabled, "data-approval-choice": choice, "data-approval-alias": agentApprovalAliases[choice], className: cn(getApprovalChoiceClass(choice)), onClick: () => onChoice?.(choice, request), children: [_jsx(Icon, { className: "size-4", "data-icon": true }), choiceLabels?.[choice] ?? defaults.label] }, choice));
+                    }) }) }), footer && _jsx(CardFooter, { children: footer })] }));
+}
+export { AgentToolApproval };

package/dist/components/ai-elements/agent.d.ts

@@ -0,0 +1,27 @@
+import { Accordion, AccordionItem } from "../accordion";
+import type { Tool } from "ai";
+import type { ComponentProps } from "react";
+export type AgentProps = ComponentProps<"div">;
+export declare const Agent: import("react").MemoExoticComponent<({ className, ...props }: AgentProps) => import("react").JSX.Element>;
+export type AgentHeaderProps = ComponentProps<"div"> & {
+    name: string;
+    model?: string;
+};
+export declare const AgentHeader: import("react").MemoExoticComponent<({ className, name, model, ...props }: AgentHeaderProps) => import("react").JSX.Element>;
+export type AgentContentProps = ComponentProps<"div">;
+export declare const AgentContent: import("react").MemoExoticComponent<({ className, ...props }: AgentContentProps) => import("react").JSX.Element>;
+export type AgentInstructionsProps = ComponentProps<"div"> & {
+    children: string;
+};
+export declare const AgentInstructions: import("react").MemoExoticComponent<({ className, children, ...props }: AgentInstructionsProps) => import("react").JSX.Element>;
+export type AgentToolsProps = ComponentProps<typeof Accordion>;
+export declare const AgentTools: import("react").MemoExoticComponent<({ className, ...props }: AgentToolsProps) => import("react").JSX.Element>;
+export type AgentToolProps = ComponentProps<typeof AccordionItem> & {
+    tool: Tool;
+};
+export declare const AgentTool: import("react").MemoExoticComponent<({ className, tool, value, ...props }: AgentToolProps) => import("react").JSX.Element>;
+export type AgentOutputProps = ComponentProps<"div"> & {
+    schema: string;
+};
+export declare const AgentOutput: import("react").MemoExoticComponent<({ className, schema, ...props }: AgentOutputProps) => import("react").JSX.Element>;
+//# sourceMappingURL=agent.d.ts.map

package/dist/components/ai-elements/agent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"agent.d.ts","sourceRoot":"","sources":["../../../src/components/ai-elements/agent.tsx"],"names":[],"mappings":"AAEA,OAAO,EACL,SAAS,EAET,aAAa,EAEd,MAAM,wBAAwB,CAAC;AAGhC,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,IAAI,CAAC;AAE/B,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAK5C,MAAM,MAAM,UAAU,GAAG,cAAc,CAAC,KAAK,CAAC,CAAC;AAE/C,eAAO,MAAM,KAAK,gEAAkC,UAAU,iCAK5D,CAAC;AAEH,MAAM,MAAM,gBAAgB,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG;IACrD,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,eAAO,MAAM,WAAW,6EACiB,gBAAgB,iCAmBxD,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG,cAAc,CAAC,KAAK,CAAC,CAAC;AAEtD,eAAO,MAAM,YAAY,gEACG,iBAAiB,iCAG5C,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG;IAC3D,QAAQ,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,eAAO,MAAM,iBAAiB,0EACQ,sBAAsB,iCAU3D,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG,cAAc,CAAC,OAAO,SAAS,CAAC,CAAC;AAE/D,eAAO,MAAM,UAAU,gEAAkC,eAAe,iCAKtE,CAAC;AAEH,MAAM,MAAM,cAAc,GAAG,cAAc,CAAC,OAAO,aAAa,CAAC,GAAG;IAClE,IAAI,EAAE,IAAI,CAAC;CACZ,CAAC;AAEF,eAAO,MAAM,SAAS,6EACmB,cAAc,iCAuBtD,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG,cAAc,CAAC,KAAK,CAAC,GAAG;IACrD,MAAM,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,eAAO,MAAM,WAAW,wEACY,gBAAgB,iCAUnD,CAAC"}

package/dist/components/ai-elements/agent.js

@@ -0,0 +1,27 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Accordion, AccordionContent, AccordionItem, AccordionTrigger, } from "../accordion.js";
+import { Badge } from "../badge.js";
+import { cn } from "../../lib/utils.js";
+import { BotIcon } from "lucide-react";
+import { memo } from "react";
+import { CodeBlock } from "./code-block.js";
+export const Agent = memo(({ className, ...props }) => (_jsx("div", { className: cn("not-prose w-full rounded-md border", className), ...props })));
+export const AgentHeader = memo(({ className, name, model, ...props }) => (_jsx("div", { className: cn("flex w-full items-center justify-between gap-4 p-3", className), ...props, children: _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(BotIcon, { className: "size-4 text-muted-foreground" }), _jsx("span", { className: "font-medium text-sm", children: name }), model && (_jsx(Badge, { className: "font-mono text-xs", variant: "secondary", children: model }))] }) })));
+export const AgentContent = memo(({ className, ...props }) => (_jsx("div", { className: cn("flex flex-col gap-4 p-4 pt-0", className), ...props })));
+export const AgentInstructions = memo(({ className, children, ...props }) => (_jsxs("div", { className: cn("flex flex-col gap-2", className), ...props, children: [_jsx("span", { className: "font-medium text-muted-foreground text-sm", children: "Instructions" }), _jsx("div", { className: "rounded-md bg-muted/50 p-3 text-muted-foreground text-sm", children: _jsx("p", { children: children }) })] })));
+export const AgentTools = memo(({ className, ...props }) => (_jsxs("div", { className: cn("flex flex-col gap-2", className), children: [_jsx("span", { className: "font-medium text-muted-foreground text-sm", children: "Tools" }), _jsx(Accordion, { className: "rounded-md border", ...props })] })));
+export const AgentTool = memo(({ className, tool, value, ...props }) => {
+    const schema = "jsonSchema" in tool && tool.jsonSchema
+        ? tool.jsonSchema
+        : tool.inputSchema;
+    return (_jsxs(AccordionItem, { className: cn("border-b last:border-b-0", className), value: value, ...props, children: [_jsx(AccordionTrigger, { className: "px-3 py-2 text-sm hover:no-underline", children: tool.description ?? "No description" }), _jsx(AccordionContent, { className: "px-3 pb-3", children: _jsx("div", { className: "rounded-md bg-muted/50", children: _jsx(CodeBlock, { code: JSON.stringify(schema, null, 2), language: "json" }) }) })] }));
+});
+export const AgentOutput = memo(({ className, schema, ...props }) => (_jsxs("div", { className: cn("flex flex-col gap-2", className), ...props, children: [_jsx("span", { className: "font-medium text-muted-foreground text-sm", children: "Output Schema" }), _jsx("div", { className: "rounded-md bg-muted/50", children: _jsx(CodeBlock, { code: schema, language: "typescript" }) })] })));
+Agent.displayName = "Agent";
+AgentHeader.displayName = "AgentHeader";
+AgentContent.displayName = "AgentContent";
+AgentInstructions.displayName = "AgentInstructions";
+AgentTools.displayName = "AgentTools";
+AgentTool.displayName = "AgentTool";
+AgentOutput.displayName = "AgentOutput";

package/dist/components/ai-elements/artifact.d.ts

@@ -0,0 +1,24 @@
+import { Button } from "../button";
+import type { LucideIcon } from "lucide-react";
+import type { ComponentProps, HTMLAttributes } from "react";
+export type ArtifactProps = HTMLAttributes<HTMLDivElement>;
+export declare const Artifact: ({ className, ...props }: ArtifactProps) => import("react").JSX.Element;
+export type ArtifactHeaderProps = HTMLAttributes<HTMLDivElement>;
+export declare const ArtifactHeader: ({ className, ...props }: ArtifactHeaderProps) => import("react").JSX.Element;
+export type ArtifactCloseProps = ComponentProps<typeof Button>;
+export declare const ArtifactClose: ({ className, children, size, variant, ...props }: ArtifactCloseProps) => import("react").JSX.Element;
+export type ArtifactTitleProps = HTMLAttributes<HTMLParagraphElement>;
+export declare const ArtifactTitle: ({ className, ...props }: ArtifactTitleProps) => import("react").JSX.Element;
+export type ArtifactDescriptionProps = HTMLAttributes<HTMLParagraphElement>;
+export declare const ArtifactDescription: ({ className, ...props }: ArtifactDescriptionProps) => import("react").JSX.Element;
+export type ArtifactActionsProps = HTMLAttributes<HTMLDivElement>;
+export declare const ArtifactActions: ({ className, ...props }: ArtifactActionsProps) => import("react").JSX.Element;
+export type ArtifactActionProps = ComponentProps<typeof Button> & {
+    tooltip?: string;
+    label?: string;
+    icon?: LucideIcon;
+};
+export declare const ArtifactAction: ({ tooltip, label, icon: Icon, children, className, size, variant, ...props }: ArtifactActionProps) => import("react").JSX.Element;
+export type ArtifactContentProps = HTMLAttributes<HTMLDivElement>;
+export declare const ArtifactContent: ({ className, ...props }: ArtifactContentProps) => import("react").JSX.Element;
+//# sourceMappingURL=artifact.d.ts.map

package/dist/components/ai-elements/artifact.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"artifact.d.ts","sourceRoot":"","sources":["../../../src/components/ai-elements/artifact.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,MAAM,EAAE,MAAM,qBAAqB,CAAC;AAQ7C,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE/C,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAE5D,MAAM,MAAM,aAAa,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAE3D,eAAO,MAAM,QAAQ,GAAI,yBAAyB,aAAa,gCAQ9D,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAEjE,eAAO,MAAM,cAAc,GAAI,yBAG5B,mBAAmB,gCAQrB,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG,cAAc,CAAC,OAAO,MAAM,CAAC,CAAC;AAE/D,eAAO,MAAM,aAAa,GAAI,kDAM3B,kBAAkB,gCAcpB,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG,cAAc,CAAC,oBAAoB,CAAC,CAAC;AAEtE,eAAO,MAAM,aAAa,GAAI,yBAAyB,kBAAkB,gCAKxE,CAAC;AAEF,MAAM,MAAM,wBAAwB,GAAG,cAAc,CAAC,oBAAoB,CAAC,CAAC;AAE5E,eAAO,MAAM,mBAAmB,GAAI,yBAGjC,wBAAwB,gCAE1B,CAAC;AAEF,MAAM,MAAM,oBAAoB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAElE,eAAO,MAAM,eAAe,GAAI,yBAG7B,oBAAoB,gCAEtB,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG,cAAc,CAAC,OAAO,MAAM,CAAC,GAAG;IAChE,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,UAAU,CAAC;CACnB,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,8EAS5B,mBAAmB,gCA+BrB,CAAC;AAEF,MAAM,MAAM,oBAAoB,GAAG,cAAc,CAAC,cAAc,CAAC,CAAC;AAElE,eAAO,MAAM,eAAe,GAAI,yBAG7B,oBAAoB,gCAEtB,CAAC"}