@mcp-b/react-components 0.46.6 → 0.47.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{CodeBlock-BpooTofO.js → CodeBlock-DMHZiw86.js} +1 -1
- package/dist/{FileTree-CAXWXH63.js → FileTree-BHebfvkK.js} +1 -1
- package/dist/{SetupChecklist-DyPZWzK2.js → SetupChecklist-CwRjIDH4.js} +1 -1
- package/dist/ThinkChat-CwMdEum8.d.ts +185 -0
- package/dist/{ThinkChat-qztQ6Clo.js → ThinkChat-DLDta57t.js} +16 -16
- package/dist/ThinkThreadPicker-yFz4vvIf.d.ts +91 -0
- package/dist/{Workspace-DZusrEeP.d.ts → Workspace-C_zHq9KZ.d.ts} +1 -1
- package/dist/{WorkspaceFileView-BvDbKM2c.js → WorkspaceFileView-ChIJz-fl.js} +4 -4
- package/dist/{WorkspaceLink-DtH66bAY.js → WorkspaceLink-B1d2GIGl.js} +7 -2
- package/dist/WorkspaceLive-DLGhtIly.d.ts +49 -0
- package/dist/{WorkspaceMessageResponse-CJCmGvTx.js → WorkspaceMessageResponse-Dg_aNpoj.js} +76 -40
- package/dist/WorkspaceMessageResponse-kJYU8Onj.d.ts +48 -0
- package/dist/components/agents-sdk/AgentActivity.js +1 -1
- package/dist/components/agents-sdk/AgentChat.js +22 -18
- package/dist/components/agents-sdk/AgentEvent.js +1 -1
- package/dist/components/agents-sdk/BrowserLiveScreen.js +1 -1
- package/dist/components/agents-sdk/BrowserLiveView.js +1 -1
- package/dist/components/agents-sdk/BrowserReplay.js +1 -1
- package/dist/components/agents-sdk/BrowserRunPanel.js +1 -1
- package/dist/components/agents-sdk/ManagerOffice.js +4 -4
- package/dist/components/agents-sdk/McpConnectionRequest.js +2 -2
- package/dist/components/agents-sdk/McpConnectorForm.js +1 -1
- package/dist/components/agents-sdk/McpPluginCatalog.js +2 -2
- package/dist/components/agents-sdk/McpServerPicker.js +2 -2
- package/dist/components/agents-sdk/ModelSelector.js +3 -3
- package/dist/components/agents-sdk/PromptInputApproval.js +1 -1
- package/dist/components/agents-sdk/PromptInputCommands.js +1 -1
- package/dist/components/agents-sdk/SubagentRunIndicator.js +1 -1
- package/dist/components/agents-sdk/SubagentRunSelector.js +1 -1
- package/dist/components/agents-sdk/ThinkChat.d.ts +1 -180
- package/dist/components/agents-sdk/ThinkChat.js +1 -1
- package/dist/components/agents-sdk/ThinkChatActivity.js +1 -1
- package/dist/components/agents-sdk/ThinkChatToolPanels.js +2 -2
- package/dist/components/agents-sdk/ThinkExecutionDetail.js +2 -2
- package/dist/components/agents-sdk/ThinkExecutionStatus.js +1 -1
- package/dist/components/agents-sdk/ThinkExecutionWorkbench.js +3 -3
- package/dist/components/agents-sdk/ThinkFullApp.d.ts +13 -4
- package/dist/components/agents-sdk/ThinkFullApp.js +11 -4
- package/dist/components/agents-sdk/ThinkFullAppViewSwitch.js +1 -1
- package/dist/components/agents-sdk/ThinkRecoveryNotice.js +1 -1
- package/dist/components/agents-sdk/ThinkRoutineBrowser.js +2 -2
- package/dist/components/agents-sdk/ThinkRoutineDetail.js +1 -1
- package/dist/components/agents-sdk/ThinkRoutineForm.js +4 -4
- package/dist/components/agents-sdk/ThinkRoutineLibrary.js +3 -3
- package/dist/components/agents-sdk/ThinkRoutineRuns.js +1 -1
- package/dist/components/agents-sdk/ThinkSidepanel.d.ts +20 -5
- package/dist/components/agents-sdk/ThinkSidepanel.js +56 -44
- package/dist/components/agents-sdk/ThinkThreadPicker.d.ts +1 -90
- package/dist/components/agents-sdk/ThinkThreadPicker.js +4 -4
- package/dist/components/agents-sdk/Workspace.d.ts +2 -2
- package/dist/components/agents-sdk/WorkspaceBrowser.d.ts +1 -1
- package/dist/components/agents-sdk/WorkspaceBrowser.js +1 -1
- package/dist/components/agents-sdk/WorkspaceConcept.d.ts +44 -0
- package/dist/components/agents-sdk/WorkspaceConcept.js +42 -0
- package/dist/components/agents-sdk/WorkspaceCorrespondence.d.ts +100 -0
- package/dist/components/agents-sdk/WorkspaceCorrespondence.js +429 -0
- package/dist/components/agents-sdk/WorkspaceExecution.d.ts +106 -0
- package/dist/components/agents-sdk/WorkspaceExecution.js +393 -0
- package/dist/components/agents-sdk/WorkspaceExplorer.d.ts +1 -1
- package/dist/components/agents-sdk/WorkspaceExplorer.js +2 -2
- package/dist/components/agents-sdk/WorkspaceFileView.js +1 -1
- package/dist/components/agents-sdk/WorkspaceHeader.js +1 -1
- package/dist/components/agents-sdk/WorkspaceLink.js +1 -1
- package/dist/components/agents-sdk/WorkspaceLive.d.ts +2 -0
- package/dist/components/agents-sdk/WorkspaceLive.js +85 -0
- package/dist/components/agents-sdk/WorkspaceMessageResponse.d.ts +2 -2
- package/dist/components/agents-sdk/WorkspaceMessageResponse.js +2 -2
- package/dist/components/agents-sdk/WorkspaceMountManager.js +2 -2
- package/dist/components/agents-sdk/WorkspaceProject.d.ts +93 -0
- package/dist/components/agents-sdk/WorkspaceProject.js +201 -0
- package/dist/components/agents-sdk/WorkspaceUserScript.d.ts +47 -0
- package/dist/components/agents-sdk/WorkspaceUserScript.js +146 -0
- package/dist/components/ai-sdk/Activity.js +1 -1
- package/dist/components/ai-sdk/AgentChatStartScreen.js +1 -1
- package/dist/components/ai-sdk/Approval.js +2 -2
- package/dist/components/ai-sdk/Artifact.js +1 -1
- package/dist/components/ai-sdk/ChainOfThought.d.ts +1 -1
- package/dist/components/ai-sdk/ChainOfThought.js +1 -1
- package/dist/components/ai-sdk/Checkpoint.js +1 -1
- package/dist/components/ai-sdk/CodeBlock.js +1 -1
- package/dist/components/ai-sdk/ComposerLink.d.ts +4 -1
- package/dist/components/ai-sdk/ComposerLink.js +4 -3
- package/dist/components/ai-sdk/ConnectedAppCards.d.ts +22 -2
- package/dist/components/ai-sdk/ConnectedAppCards.js +50 -43
- package/dist/components/ai-sdk/Conversation.js +1 -1
- package/dist/components/ai-sdk/Goal.js +1 -1
- package/dist/components/ai-sdk/InlineCitation.js +1 -1
- package/dist/components/ai-sdk/MediaPreviewCard.js +1 -1
- package/dist/components/ai-sdk/Message.js +1 -1
- package/dist/components/ai-sdk/MessageScroller.js +1 -1
- package/dist/components/ai-sdk/MessageScrollerVirtual.js +1 -1
- package/dist/components/ai-sdk/Plan.js +1 -1
- package/dist/components/ai-sdk/PromptInput.js +5 -5
- package/dist/components/ai-sdk/Queue.js +1 -1
- package/dist/components/ai-sdk/Reasoning.js +1 -1
- package/dist/components/ai-sdk/Sources.js +1 -1
- package/dist/components/ai-sdk/Task.js +1 -1
- package/dist/components/extension/ChatGptSignInScreen.js +1 -1
- package/dist/components/extension/CodexModelSelector.js +2 -2
- package/dist/components/extension/ConversationTabPicker.js +2 -2
- package/dist/components/foundations/Checkbox.js +1 -1
- package/dist/components/foundations/Collapsible.js +1 -1
- package/dist/components/foundations/ContextMenu.js +1 -1
- package/dist/components/foundations/Menubar.js +1 -1
- package/dist/components/foundations/SearchField.js +1 -1
- package/dist/components/foundations/Select.js +1 -1
- package/dist/components/foundations/Stepper.js +1 -1
- package/dist/components/foundations/Toast.js +1 -1
- package/dist/components/foundations/ToggleGroup.d.ts +1 -1
- package/dist/components/foundations/ToggleGroup.js +1 -1
- package/dist/components/foundations/icons.d.ts +2 -2
- package/dist/components/foundations/icons.js +2 -2
- package/dist/components/general-purpose/Commit.js +2 -2
- package/dist/components/general-purpose/EnvironmentVariables.js +2 -2
- package/dist/components/general-purpose/FileTree.js +1 -1
- package/dist/components/general-purpose/PricingBillingToggle.js +1 -1
- package/dist/components/general-purpose/PricingPlanCard.js +2 -2
- package/dist/components/general-purpose/PricingUsageCalculator.js +2 -2
- package/dist/components/general-purpose/ResponsiveSidebarShell.js +1 -1
- package/dist/components/general-purpose/SettingsFormDialog.js +2 -2
- package/dist/components/general-purpose/SetupChecklist.js +1 -1
- package/dist/components/general-purpose/Terminal.js +2 -2
- package/dist/components/general-purpose/TestResults.js +1 -1
- package/dist/components/general-purpose/ThemeModeControl.js +2 -2
- package/dist/components/general-purpose/WebPreview.js +2 -2
- package/dist/components/nanites/AgentConnection.js +2 -2
- package/dist/components/nanites/AgentToolDetail.d.ts +1 -1
- package/dist/components/nanites/AgentToolDetail.js +5 -5
- package/dist/{copy-button-D7ySsRRo.js → copy-button-CSDuDfdP.js} +1 -1
- package/dist/{icons-D0Pd2P9v.d.ts → icons-CCZGYUwU.d.ts} +6 -6
- package/dist/{icons-BNEY4gO5.js → icons-cuEtsgj9.js} +4 -4
- package/dist/styles/agent-chat.css +33 -13
- package/dist/styles/connected-app-card.css +8 -0
- package/dist/styles/description-list.css +3 -1
- package/dist/styles/index.css +1 -0
- package/dist/styles/workspace-concepts.css +28 -0
- package/dist/workspace-assets-CxpEHsac.js +154 -0
- package/package.json +2 -2
- package/dist/WorkspaceMessageResponse-D66ty4FO.d.ts +0 -24
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { t as cx } from "../../class-names-BiMDVpUo.js";
|
|
2
|
+
import { H as RefreshIcon, f as ChevronDownIcon, i as ArrowRightIcon, r as ArrowLeftIcon } from "../../icons-cuEtsgj9.js";
|
|
2
3
|
import { Collapsible } from "../foundations/Collapsible.js";
|
|
3
|
-
import { U as RefreshIcon, f as ChevronDownIcon, i as ArrowRightIcon, r as ArrowLeftIcon } from "../../icons-BNEY4gO5.js";
|
|
4
4
|
import { IconButton } from "../foundations/IconButton.js";
|
|
5
|
-
import { Input } from "../foundations/Input.js";
|
|
6
5
|
import { ScrollArea } from "../foundations/ScrollArea.js";
|
|
6
|
+
import { Input } from "../foundations/Input.js";
|
|
7
7
|
import * as React from "react";
|
|
8
8
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
9
9
|
//#region src/components/general-purpose/WebPreview.tsx
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { t as cx } from "../../class-names-BiMDVpUo.js";
|
|
2
|
-
import { D as LinkIcon } from "../../icons-
|
|
2
|
+
import { D as LinkIcon } from "../../icons-cuEtsgj9.js";
|
|
3
3
|
import { Button } from "../foundations/Button.js";
|
|
4
|
-
import { a as CodeBlockCopyButton, i as CodeBlockContent, n as CodeBlockActions, p as CodeBlockTitle, r as CodeBlockContainer, s as CodeBlockHeader, t as CodeBlock } from "../../CodeBlock-BpooTofO.js";
|
|
5
4
|
import { Popover } from "../foundations/Popover.js";
|
|
5
|
+
import { a as CodeBlockCopyButton, i as CodeBlockContent, n as CodeBlockActions, p as CodeBlockTitle, r as CodeBlockContainer, s as CodeBlockHeader, t as CodeBlock } from "../../CodeBlock-DMHZiw86.js";
|
|
6
6
|
import { ToggleGroup } from "../foundations/ToggleGroup.js";
|
|
7
7
|
import * as React from "react";
|
|
8
8
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { i as ThinkChatValue } from "../../ThinkChatContext-COIgzkYp.js";
|
|
2
|
-
import { ThinkChatMessagesProps } from "
|
|
2
|
+
import { i as ThinkChatMessagesProps } from "../../ThinkChat-CwMdEum8.js";
|
|
3
3
|
import { t as ThinkAgent } from "../../think-agent-Cip5KAPj.js";
|
|
4
4
|
import * as React from "react";
|
|
5
5
|
import { UIMessage } from "ai";
|
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
import { t as cx } from "../../class-names-BiMDVpUo.js";
|
|
2
|
-
import { r as ArrowLeftIcon } from "../../icons-
|
|
3
|
-
import { TransitionSurface } from "../foundations/TransitionSurface.js";
|
|
4
|
-
import { AppTopBar } from "../general-purpose/AppTopBar.js";
|
|
2
|
+
import { r as ArrowLeftIcon } from "../../icons-cuEtsgj9.js";
|
|
5
3
|
import { NaniteMark } from "./NaniteScene.js";
|
|
6
4
|
import { SubagentRunIndicator, getSubagentRunName } from "../agents-sdk/SubagentRunIndicator.js";
|
|
5
|
+
import { TransitionSurface } from "../foundations/TransitionSurface.js";
|
|
6
|
+
import { AppTopBar } from "../general-purpose/AppTopBar.js";
|
|
7
7
|
import { SubagentRunMilestone, SubagentRunMilestones, SubagentRunProgress } from "../agents-sdk/SubagentRunDetails.js";
|
|
8
|
-
import { t as ThinkChat } from "../../ThinkChat-
|
|
8
|
+
import { t as ThinkChat } from "../../ThinkChat-DLDta57t.js";
|
|
9
9
|
import * as React from "react";
|
|
10
10
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
11
|
-
import { useAgentChat } from "@cloudflare/think/react";
|
|
12
11
|
import { useAgent } from "agents/react";
|
|
12
|
+
import { useAgentChat } from "@cloudflare/think/react";
|
|
13
13
|
//#region src/components/nanites/AgentToolDetail.tsx
|
|
14
14
|
/**
|
|
15
15
|
* Live retained-child detail composed from upstream connection and chat values.
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { d as CheckIcon, h as CopyIcon } from "./icons-
|
|
1
|
+
import { d as CheckIcon, h as CopyIcon } from "./icons-cuEtsgj9.js";
|
|
2
2
|
import { IconButton } from "./components/foundations/IconButton.js";
|
|
3
3
|
import * as React from "react";
|
|
4
4
|
import { jsx } from "react/jsx-runtime";
|
|
@@ -47,11 +47,6 @@ declare const CopyIcon: ({
|
|
|
47
47
|
strokeWidth,
|
|
48
48
|
...props
|
|
49
49
|
}: IconProps) => import("react").JSX.Element;
|
|
50
|
-
declare const MoveToFrontIcon: ({
|
|
51
|
-
size,
|
|
52
|
-
strokeWidth,
|
|
53
|
-
...props
|
|
54
|
-
}: IconProps) => import("react").JSX.Element;
|
|
55
50
|
declare const EyeIcon: ({
|
|
56
51
|
size,
|
|
57
52
|
strokeWidth,
|
|
@@ -258,6 +253,11 @@ declare const MailIcon: ({
|
|
|
258
253
|
strokeWidth,
|
|
259
254
|
...props
|
|
260
255
|
}: IconProps) => import("react").JSX.Element;
|
|
256
|
+
declare const UserIcon: ({
|
|
257
|
+
size,
|
|
258
|
+
strokeWidth,
|
|
259
|
+
...props
|
|
260
|
+
}: IconProps) => import("react").JSX.Element;
|
|
261
261
|
declare const McpIcon: ({
|
|
262
262
|
size,
|
|
263
263
|
...props
|
|
@@ -296,4 +296,4 @@ declare const MaximizeIcon: ({
|
|
|
296
296
|
...props
|
|
297
297
|
}: IconProps) => import("react").JSX.Element;
|
|
298
298
|
//#endregion
|
|
299
|
-
export {
|
|
299
|
+
export { TerminalIcon as $, MailIcon as A, PencilIcon as B, FileIcon as C, InfoIcon as D, IconProps as E, MinusIcon as F, SearchIcon as G, PlusIcon as H, MonitorIcon as I, SpinnerIcon as J, SidebarIcon as K, MoonIcon as L, McpIcon as M, MessageSquareIcon as N, KeyboardIcon as O, MicrophoneIcon as P, TargetIcon as Q, PaperclipIcon as R, EyeOffIcon as S, FolderOpenIcon as T, QueueIcon as U, PlayIcon as V, RefreshIcon as W, StopIcon as X, SquareIcon as Y, SunIcon as Z, DiscordIcon as _, ArrowUpIcon as a, EllipsisIcon as b, BoxIcon as c, CalendarIcon as d, TrashIcon as et, CheckIcon as f, CopyIcon as g, CodeIcon as h, ArrowRightIcon as i, XIcon as it, MaximizeIcon as j, LinkIcon as k, BrainIcon as l, ChevronRightIcon as m, ArrowDownIcon as n, WarningIcon as nt, ArrowUpRightIcon as o, ChevronDownIcon as p, SlackIcon as q, ArrowLeftIcon as r, WrenchIcon as rt, BookmarkIcon as s, ArchiveIcon as t, UserIcon as tt, BrandIconProps as u, DotIcon as v, FolderIcon as w, EyeIcon as x, DownloadIcon as y, PauseIcon as z };
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { t as cx } from "./class-names-BiMDVpUo.js";
|
|
2
|
-
import {
|
|
3
|
-
import { Archive, ArrowDown, ArrowLeft, ArrowRight, ArrowUp, ArrowUpRight, Bookmark, Box, Brain, CalendarDays, Check, ChevronDown, ChevronRight, CircleStop, CodeXml, Copy, CornerDownRight, Dot, Download, Ellipsis, Eye, EyeOff, File, Folder, FolderOpen, Info, Keyboard, Link2, ListRestart, LoaderCircle, Mail, Maximize2, MessageSquare, Mic, Minus, Monitor, Moon, PanelLeft, Paperclip, Pause, Pencil, Play, Plus, RefreshCw, Search, Square, Sun, Target, Terminal, Trash2, TriangleAlert, Wrench, X } from "lucide-react";
|
|
2
|
+
import { Archive, ArrowDown, ArrowLeft, ArrowRight, ArrowUp, ArrowUpRight, Bookmark, Box, Brain, CalendarDays, Check, ChevronDown, ChevronRight, CircleStop, CodeXml, Copy, Dot, Download, Ellipsis, Eye, EyeOff, File, Folder, FolderOpen, Info, Keyboard, Link2, ListRestart, LoaderCircle, Mail, Maximize2, MessageSquare, Mic, Minus, Monitor, Moon, PanelLeft, Paperclip, Pause, Pencil, Play, Plus, RefreshCw, Search, Square, Sun, Target, Terminal, Trash2, TriangleAlert, User, Wrench, X } from "lucide-react";
|
|
4
3
|
import { SiDiscord, SiModelcontextprotocol } from "react-icons/si";
|
|
4
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
5
5
|
//#region src/components/_internal/icons.tsx
|
|
6
6
|
function icon(Component) {
|
|
7
7
|
return function DesignSystemIcon({ size = 16, strokeWidth = 1.75, ...props }) {
|
|
@@ -31,7 +31,6 @@ const CodeIcon = icon(CodeXml);
|
|
|
31
31
|
const XIcon = icon(X);
|
|
32
32
|
const PencilIcon = icon(Pencil);
|
|
33
33
|
const CopyIcon = icon(Copy);
|
|
34
|
-
const MoveToFrontIcon = icon(CornerDownRight);
|
|
35
34
|
const EyeIcon = icon(Eye);
|
|
36
35
|
const EyeOffIcon = icon(EyeOff);
|
|
37
36
|
const FolderIcon = icon(Folder);
|
|
@@ -82,6 +81,7 @@ const InfoIcon = icon(Info);
|
|
|
82
81
|
const MonitorIcon = icon(Monitor);
|
|
83
82
|
const MessageSquareIcon = icon(MessageSquare);
|
|
84
83
|
const MailIcon = icon(Mail);
|
|
84
|
+
const UserIcon = icon(User);
|
|
85
85
|
const McpIcon = brandIcon(SiModelcontextprotocol);
|
|
86
86
|
/** Discord Blurple. Callers override with `color` or a `className` that sets color. */
|
|
87
87
|
function DiscordIcon({ size = 16, color = "#5865F2", className, ...props }) {
|
|
@@ -131,4 +131,4 @@ const SunIcon = icon(Sun);
|
|
|
131
131
|
const TargetIcon = icon(Target);
|
|
132
132
|
const MaximizeIcon = icon(Maximize2);
|
|
133
133
|
//#endregion
|
|
134
|
-
export {
|
|
134
|
+
export { UserIcon as $, McpIcon as A, PlusIcon as B, FolderIcon as C, LinkIcon as D, KeyboardIcon as E, MoonIcon as F, SlackIcon as G, RefreshIcon as H, PaperclipIcon as I, StopIcon as J, SpinnerIcon as K, PauseIcon as L, MicrophoneIcon as M, MinusIcon as N, MailIcon as O, MonitorIcon as P, TrashIcon as Q, PencilIcon as R, FileIcon as S, InfoIcon as T, SearchIcon as U, QueueIcon as V, SidebarIcon as W, TargetIcon as X, SunIcon as Y, TerminalIcon as Z, DotIcon as _, ArrowUpIcon as a, EyeIcon as b, BoxIcon as c, CheckIcon as d, WarningIcon as et, ChevronDownIcon as f, DiscordIcon as g, CopyIcon as h, ArrowRightIcon as i, MessageSquareIcon as j, MaximizeIcon as k, BrainIcon as l, CodeIcon as m, ArrowDownIcon as n, XIcon as nt, ArrowUpRightIcon as o, ChevronRightIcon as p, SquareIcon as q, ArrowLeftIcon as r, BookmarkIcon as s, ArchiveIcon as t, WrenchIcon as tt, CalendarIcon as u, DownloadIcon as v, FolderOpenIcon as w, EyeOffIcon as x, EllipsisIcon as y, PlayIcon as z };
|
|
@@ -429,15 +429,23 @@
|
|
|
429
429
|
margin-block-end: 0;
|
|
430
430
|
}
|
|
431
431
|
|
|
432
|
-
.agent-chat__queued {
|
|
432
|
+
.agent-chat__queued.prompt-input__tray {
|
|
433
|
+
--agent-chat-queued-row-block-size: var(--sigvelo-spacing-5);
|
|
434
|
+
--agent-chat-queued-list-max-block-size: calc(
|
|
435
|
+
3 * var(--agent-chat-queued-row-block-size) + 2 * var(--sigvelo-border-width)
|
|
436
|
+
);
|
|
437
|
+
--prompt-input-tray-overlap: var(--sigvelo-spacing-2);
|
|
438
|
+
|
|
433
439
|
position: relative;
|
|
434
440
|
z-index: 0;
|
|
435
441
|
flex-direction: column;
|
|
436
442
|
align-items: stretch;
|
|
443
|
+
min-block-size: 0;
|
|
437
444
|
inline-size: calc(
|
|
438
445
|
min(100%, var(--agent-chat-content-max-inline-size, var(--sigvelo-measure-wide-block))) -
|
|
439
446
|
var(--sigvelo-spacing-10)
|
|
440
447
|
);
|
|
448
|
+
gap: 0;
|
|
441
449
|
margin-inline: auto;
|
|
442
450
|
}
|
|
443
451
|
|
|
@@ -445,46 +453,55 @@
|
|
|
445
453
|
flex: 1;
|
|
446
454
|
display: grid;
|
|
447
455
|
gap: var(--sigvelo-border-width);
|
|
456
|
+
max-block-size: var(--agent-chat-queued-list-max-block-size);
|
|
448
457
|
min-inline-size: 0;
|
|
449
458
|
margin: 0;
|
|
450
459
|
padding: 0;
|
|
451
460
|
list-style: none;
|
|
461
|
+
overflow-y: auto;
|
|
462
|
+
overscroll-behavior: contain;
|
|
463
|
+
scrollbar-gutter: stable;
|
|
452
464
|
}
|
|
453
465
|
|
|
454
|
-
.agent-chat__queued-message {
|
|
466
|
+
.agent-chat__queued .agent-chat__queued-message {
|
|
455
467
|
display: flex;
|
|
456
468
|
align-items: center;
|
|
457
469
|
min-inline-size: 0;
|
|
458
|
-
min-block-size: var(--
|
|
470
|
+
min-block-size: var(--agent-chat-queued-row-block-size);
|
|
459
471
|
gap: var(--sigvelo-spacing-1-5);
|
|
460
472
|
padding-block: 0;
|
|
461
|
-
padding-inline: var(--sigvelo-spacing-2
|
|
473
|
+
padding-inline: var(--sigvelo-spacing-2);
|
|
462
474
|
color: var(--sigvelo-color-text);
|
|
463
|
-
font-size: var(--sigvelo-text-
|
|
464
|
-
line-height: var(--sigvelo-text-
|
|
475
|
+
font-size: var(--sigvelo-text-compact);
|
|
476
|
+
line-height: var(--sigvelo-text-compact-leading);
|
|
465
477
|
}
|
|
466
478
|
|
|
467
|
-
.agent-chat__queued-indicator {
|
|
479
|
+
.agent-chat__queued .agent-chat__queued-indicator {
|
|
468
480
|
display: inline-flex;
|
|
469
481
|
flex: none;
|
|
470
482
|
color: var(--sigvelo-color-text-muted);
|
|
471
483
|
}
|
|
472
484
|
|
|
473
|
-
.agent-chat__queued-indicator svg {
|
|
485
|
+
.agent-chat__queued .agent-chat__queued-indicator svg {
|
|
474
486
|
inline-size: var(--sigvelo-text-sm);
|
|
475
487
|
block-size: var(--sigvelo-text-sm);
|
|
476
488
|
}
|
|
477
489
|
|
|
478
|
-
.agent-chat__queued-content {
|
|
490
|
+
.agent-chat__queued .agent-chat__queued-content {
|
|
479
491
|
font-size: inherit;
|
|
480
492
|
line-height: inherit;
|
|
481
493
|
}
|
|
482
494
|
|
|
483
|
-
.agent-chat__queued-actions {
|
|
495
|
+
.agent-chat__queued-message .agent-chat__queued-actions {
|
|
484
496
|
opacity: 1;
|
|
485
497
|
}
|
|
486
498
|
|
|
487
|
-
.agent-chat__queued-action {
|
|
499
|
+
.agent-chat__queued .agent-chat__queued-action {
|
|
500
|
+
--sigvelo-recipe-button-height: var(--agent-chat-queued-row-block-size);
|
|
501
|
+
--sigvelo-recipe-button-padding-inline: var(--sigvelo-spacing-1-5);
|
|
502
|
+
--sigvelo-recipe-button-font-size: var(--sigvelo-text-xs);
|
|
503
|
+
--sigvelo-recipe-button-icon-size: var(--sigvelo-text-xs);
|
|
504
|
+
|
|
488
505
|
flex: none;
|
|
489
506
|
font-weight: var(--sigvelo-font-weight-normal);
|
|
490
507
|
}
|
|
@@ -500,8 +517,11 @@
|
|
|
500
517
|
opacity: 1;
|
|
501
518
|
}
|
|
502
519
|
|
|
503
|
-
.agent-chat__queued-
|
|
504
|
-
|
|
520
|
+
.agent-chat__queued.prompt-input__tray {
|
|
521
|
+
--agent-chat-queued-row-block-size: var(--sigvelo-control-height-xl);
|
|
522
|
+
--agent-chat-queued-list-max-block-size: calc(
|
|
523
|
+
2 * var(--agent-chat-queued-row-block-size) + var(--sigvelo-border-width)
|
|
524
|
+
);
|
|
505
525
|
}
|
|
506
526
|
}
|
|
507
527
|
|
|
@@ -46,6 +46,14 @@
|
|
|
46
46
|
color: var(--sigvelo-color-danger-text);
|
|
47
47
|
}
|
|
48
48
|
|
|
49
|
+
.connected-app-card__save-error {
|
|
50
|
+
display: flex;
|
|
51
|
+
flex-wrap: wrap;
|
|
52
|
+
align-items: center;
|
|
53
|
+
justify-content: space-between;
|
|
54
|
+
gap: var(--sigvelo-spacing-2);
|
|
55
|
+
}
|
|
56
|
+
|
|
49
57
|
.connected-app-card__body {
|
|
50
58
|
margin: 0;
|
|
51
59
|
overflow-wrap: anywhere;
|
|
@@ -49,7 +49,9 @@
|
|
|
49
49
|
|
|
50
50
|
.description-list[data-variant="divided"] {
|
|
51
51
|
gap: 0;
|
|
52
|
-
|
|
52
|
+
/* Rows divide from each other and from the heading above. The last row has
|
|
53
|
+
no trailing rule — it doubled the card's elevation ring. */
|
|
54
|
+
border-block-start: var(--sigvelo-border-style) var(--sigvelo-border-width)
|
|
53
55
|
var(--sigvelo-color-neutral-border-subtle);
|
|
54
56
|
}
|
|
55
57
|
|
package/dist/styles/index.css
CHANGED
|
@@ -130,6 +130,7 @@
|
|
|
130
130
|
@import "./web-preview.css" layer(components);
|
|
131
131
|
@import "./workspace-explorer.css" layer(components);
|
|
132
132
|
@import "./workspace-mount-manager.css" layer(components);
|
|
133
|
+
@import "./workspace-concepts.css" layer(components);
|
|
133
134
|
@import "./composition-motion.css" layer(components);
|
|
134
135
|
|
|
135
136
|
/* Page Components */
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
/* Panel shell only. Cards reuse connected-app-card; lists reuse sigvelo-stack. */
|
|
2
|
+
.workspace-concept-panel {
|
|
3
|
+
box-sizing: border-box;
|
|
4
|
+
min-inline-size: 0;
|
|
5
|
+
min-block-size: 0;
|
|
6
|
+
block-size: 100%;
|
|
7
|
+
overflow: auto;
|
|
8
|
+
padding: var(--sigvelo-layout-gutter);
|
|
9
|
+
color: var(--sigvelo-color-text);
|
|
10
|
+
background: var(--sigvelo-color-canvas);
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
/* Session run outcome on the execution card's Last run row. */
|
|
14
|
+
.workspace-execution-outcome {
|
|
15
|
+
display: inline-flex;
|
|
16
|
+
align-items: center;
|
|
17
|
+
gap: var(--sigvelo-spacing-1);
|
|
18
|
+
font-size: var(--sigvelo-text-xs);
|
|
19
|
+
line-height: var(--sigvelo-text-xs-leading);
|
|
20
|
+
white-space: nowrap;
|
|
21
|
+
color: var(--sigvelo-color-success-text);
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
@media (forced-colors: active) {
|
|
25
|
+
.workspace-execution-outcome {
|
|
26
|
+
color: CanvasText;
|
|
27
|
+
}
|
|
28
|
+
}
|
|
@@ -0,0 +1,154 @@
|
|
|
1
|
+
import { composerLinkHref } from "./utils/composer-link.js";
|
|
2
|
+
import { canRequestFavicon, inferFaviconUrl } from "./utils/favicon.js";
|
|
3
|
+
import { Q as TrashIcon, S as FileIcon } from "./icons-cuEtsgj9.js";
|
|
4
|
+
import { Button } from "./components/foundations/Button.js";
|
|
5
|
+
import { Tooltip } from "./components/foundations/Tooltip.js";
|
|
6
|
+
import { IconButton } from "./components/foundations/IconButton.js";
|
|
7
|
+
import { AppIcon } from "./components/foundations/AppIcon.js";
|
|
8
|
+
import { ComposerLink } from "./components/ai-sdk/ComposerLink.js";
|
|
9
|
+
import { AlertDialog } from "./components/foundations/AlertDialog.js";
|
|
10
|
+
import * as React from "react";
|
|
11
|
+
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
12
|
+
//#region src/components/_internal/workspace-delete.tsx
|
|
13
|
+
/**
|
|
14
|
+
* Header trash control for a workspace file. The card owns the confirm dialog;
|
|
15
|
+
* the host deletes the file.
|
|
16
|
+
*/
|
|
17
|
+
function WorkspaceDeleteControl({ name, onDelete }) {
|
|
18
|
+
const triggerRef = React.useRef(null);
|
|
19
|
+
const [open, setOpen] = React.useState(false);
|
|
20
|
+
const [busy, setBusy] = React.useState(false);
|
|
21
|
+
const [errorMessage, setErrorMessage] = React.useState("");
|
|
22
|
+
return /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(IconButton, {
|
|
23
|
+
ref: triggerRef,
|
|
24
|
+
type: "button",
|
|
25
|
+
label: `Delete ${name}`,
|
|
26
|
+
tooltip: "Delete",
|
|
27
|
+
variant: "ghost",
|
|
28
|
+
color: "neutral",
|
|
29
|
+
disabled: busy,
|
|
30
|
+
"aria-haspopup": "dialog",
|
|
31
|
+
onClick: () => {
|
|
32
|
+
setErrorMessage("");
|
|
33
|
+
setOpen(true);
|
|
34
|
+
},
|
|
35
|
+
children: /* @__PURE__ */ jsx(TrashIcon, {})
|
|
36
|
+
}), /* @__PURE__ */ jsx(AlertDialog.Root, {
|
|
37
|
+
open,
|
|
38
|
+
onOpenChange: (nextOpen, eventDetails) => {
|
|
39
|
+
if (busy) {
|
|
40
|
+
eventDetails.cancel();
|
|
41
|
+
return;
|
|
42
|
+
}
|
|
43
|
+
setOpen(nextOpen);
|
|
44
|
+
if (!nextOpen) setErrorMessage("");
|
|
45
|
+
},
|
|
46
|
+
children: /* @__PURE__ */ jsxs(AlertDialog.Portal, { children: [/* @__PURE__ */ jsx(AlertDialog.Backdrop, {}), /* @__PURE__ */ jsx(AlertDialog.Viewport, { children: /* @__PURE__ */ jsxs(AlertDialog.Popup, {
|
|
47
|
+
finalFocus: triggerRef,
|
|
48
|
+
children: [
|
|
49
|
+
/* @__PURE__ */ jsxs(AlertDialog.Title, { children: [
|
|
50
|
+
"Delete ",
|
|
51
|
+
name,
|
|
52
|
+
"?"
|
|
53
|
+
] }),
|
|
54
|
+
/* @__PURE__ */ jsx(AlertDialog.Description, { children: "This deletes the file. This cannot be undone." }),
|
|
55
|
+
errorMessage ? /* @__PURE__ */ jsx("p", {
|
|
56
|
+
role: "alert",
|
|
57
|
+
children: errorMessage
|
|
58
|
+
}) : null,
|
|
59
|
+
/* @__PURE__ */ jsxs(AlertDialog.Footer, { children: [/* @__PURE__ */ jsx(AlertDialog.Close, {
|
|
60
|
+
disabled: busy,
|
|
61
|
+
children: "Cancel"
|
|
62
|
+
}), /* @__PURE__ */ jsx(Button, {
|
|
63
|
+
type: "button",
|
|
64
|
+
color: "destructive",
|
|
65
|
+
disabled: busy,
|
|
66
|
+
onClick: () => {
|
|
67
|
+
if (busy) return;
|
|
68
|
+
setBusy(true);
|
|
69
|
+
setErrorMessage("");
|
|
70
|
+
Promise.resolve(onDelete()).then(() => {
|
|
71
|
+
setOpen(false);
|
|
72
|
+
}).catch((error) => {
|
|
73
|
+
setErrorMessage(error instanceof Error && error.message.trim() ? error.message : "The file could not be deleted. Try again.");
|
|
74
|
+
}).finally(() => {
|
|
75
|
+
setBusy(false);
|
|
76
|
+
});
|
|
77
|
+
},
|
|
78
|
+
children: busy ? "Deleting…" : "Delete"
|
|
79
|
+
})] })
|
|
80
|
+
]
|
|
81
|
+
}) })] })
|
|
82
|
+
})] });
|
|
83
|
+
}
|
|
84
|
+
//#endregion
|
|
85
|
+
//#region src/components/_internal/workspace-assets.tsx
|
|
86
|
+
/** HTTP(S) URL from a field value, or nothing. */
|
|
87
|
+
function httpUrl(value) {
|
|
88
|
+
try {
|
|
89
|
+
const url = new URL(value.trim());
|
|
90
|
+
if (url.protocol === "http:" || url.protocol === "https:") return url.href;
|
|
91
|
+
} catch {
|
|
92
|
+
return;
|
|
93
|
+
}
|
|
94
|
+
}
|
|
95
|
+
/** Site mark for a URL. Decorative — sit it next to visible text. */
|
|
96
|
+
function FaviconMark({ fallback, href }) {
|
|
97
|
+
const src = href ? inferFaviconUrl(href) : void 0;
|
|
98
|
+
const allowed = Boolean(src && canRequestFavicon(src));
|
|
99
|
+
const [failedSrc, setFailedSrc] = React.useState(null);
|
|
100
|
+
if (!src || !allowed || Boolean(src) && failedSrc === src) {
|
|
101
|
+
if (fallback == null) return null;
|
|
102
|
+
return /* @__PURE__ */ jsx(AppIcon.Root, {
|
|
103
|
+
size: "xs",
|
|
104
|
+
"aria-hidden": "true",
|
|
105
|
+
children: /* @__PURE__ */ jsx(AppIcon.Fallback, { children: fallback })
|
|
106
|
+
});
|
|
107
|
+
}
|
|
108
|
+
return /* @__PURE__ */ jsxs(AppIcon.Root, {
|
|
109
|
+
size: "xs",
|
|
110
|
+
"aria-hidden": "true",
|
|
111
|
+
children: [/* @__PURE__ */ jsx(AppIcon.Image, {
|
|
112
|
+
alt: "",
|
|
113
|
+
fit: "contain",
|
|
114
|
+
src,
|
|
115
|
+
onError: () => {
|
|
116
|
+
setFailedSrc(src);
|
|
117
|
+
}
|
|
118
|
+
}), /* @__PURE__ */ jsx(AppIcon.Fallback, { children: fallback ?? null })]
|
|
119
|
+
});
|
|
120
|
+
}
|
|
121
|
+
/**
|
|
122
|
+
* Supplementary tooltip on an already-interactive control. Paths, globs, and
|
|
123
|
+
* enable labels belong here — not as persistent body copy.
|
|
124
|
+
*/
|
|
125
|
+
function Hint({ children, content }) {
|
|
126
|
+
if (content == null || content === false || content === "") return children;
|
|
127
|
+
return /* @__PURE__ */ jsxs(Tooltip.Root, { children: [/* @__PURE__ */ jsx(Tooltip.Trigger, {
|
|
128
|
+
render: children,
|
|
129
|
+
delay: 0
|
|
130
|
+
}), /* @__PURE__ */ jsx(Tooltip.Portal, { children: /* @__PURE__ */ jsx(Tooltip.Positioner, {
|
|
131
|
+
side: "top",
|
|
132
|
+
sideOffset: 6,
|
|
133
|
+
children: /* @__PURE__ */ jsx(Tooltip.Popup, { children: content })
|
|
134
|
+
}) })] });
|
|
135
|
+
}
|
|
136
|
+
/** File/thread/site identity, same icon+label mark as the composer. */
|
|
137
|
+
function WorkspaceComposerLink({ hint, icon, kind = "file", label, onOpen, value }) {
|
|
138
|
+
const link = /* @__PURE__ */ jsx(ComposerLink, {
|
|
139
|
+
href: composerLinkHref({
|
|
140
|
+
kind,
|
|
141
|
+
value,
|
|
142
|
+
label
|
|
143
|
+
}),
|
|
144
|
+
icon: icon ?? (kind === "file" ? /* @__PURE__ */ jsx(FileIcon, {}) : void 0),
|
|
145
|
+
onClick: onOpen,
|
|
146
|
+
children: label
|
|
147
|
+
});
|
|
148
|
+
return hint == null || hint === false || hint === "" ? link : /* @__PURE__ */ jsx(Hint, {
|
|
149
|
+
content: hint,
|
|
150
|
+
children: link
|
|
151
|
+
});
|
|
152
|
+
}
|
|
153
|
+
//#endregion
|
|
154
|
+
export { WorkspaceDeleteControl as i, WorkspaceComposerLink as n, httpUrl as r, FaviconMark as t };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mcp-b/react-components",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.47.0",
|
|
4
4
|
"description": "MCP-B React components built on Base UI and shared design tokens, including Cloudflare Think chat primitives.",
|
|
5
5
|
"homepage": "https://design-system.sigvelo.com",
|
|
6
6
|
"bugs": {
|
|
@@ -54,7 +54,7 @@
|
|
|
54
54
|
"streamdown": "^2.5.0",
|
|
55
55
|
"unist-util-visit": "^5.1.0",
|
|
56
56
|
"yet-another-react-lightbox": "^3.32.2",
|
|
57
|
-
"@mcp-b/design-tokens": "0.
|
|
57
|
+
"@mcp-b/design-tokens": "0.47.0"
|
|
58
58
|
},
|
|
59
59
|
"devDependencies": {
|
|
60
60
|
"@ai-sdk/react": "^3.0.249",
|
|
@@ -1,24 +0,0 @@
|
|
|
1
|
-
import { E as MessageResponseProps } from "./Message-D_vCVEGB.js";
|
|
2
|
-
import * as React from "react";
|
|
3
|
-
|
|
4
|
-
//#region src/components/agents-sdk/WorkspaceMessageResponse.d.ts
|
|
5
|
-
interface WorkspaceHtmlArtifactRenderInput {
|
|
6
|
-
label: string;
|
|
7
|
-
path: string;
|
|
8
|
-
/** Shared workspace link element; hosts pass it through to the preview unchanged. */
|
|
9
|
-
sourceLink: React.ReactElement;
|
|
10
|
-
}
|
|
11
|
-
type WorkspaceHtmlArtifactRenderer = (artifact: WorkspaceHtmlArtifactRenderInput) => React.ReactNode;
|
|
12
|
-
interface WorkspaceMessageResponseProps extends MessageResponseProps {
|
|
13
|
-
/** Promotes one standalone workspace HTML link into host-hydrated shared UI. */
|
|
14
|
-
renderWorkspaceHtmlArtifact?: WorkspaceHtmlArtifactRenderer;
|
|
15
|
-
}
|
|
16
|
-
/** Adds workspace-aware Markdown links when rendered inside a workspace provider. */
|
|
17
|
-
declare const WorkspaceMessageResponse: React.MemoExoticComponent<({
|
|
18
|
-
components,
|
|
19
|
-
rehypePlugins,
|
|
20
|
-
renderWorkspaceHtmlArtifact,
|
|
21
|
-
...props
|
|
22
|
-
}: WorkspaceMessageResponseProps) => React.JSX.Element>;
|
|
23
|
-
//#endregion
|
|
24
|
-
export { WorkspaceMessageResponseProps as i, WorkspaceHtmlArtifactRenderer as n, WorkspaceMessageResponse as r, WorkspaceHtmlArtifactRenderInput as t };
|