@mcp-b/react-components 0.51.2 → 0.52.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-g8sADidM.js → CodeBlock-Bl-q7wMc.js} +1 -0
- package/dist/{CodeBlock--r6GS8YV.d.ts → CodeBlock-DJ99TQWy.d.ts} +1 -1
- package/dist/EmployeeChrome-C8eTGJWn.d.ts +231 -0
- package/dist/{IconButton-ByiyjkYE.d.ts → IconButton-CAlFVb2L.d.ts} +3 -0
- package/dist/{ManagerOffice-D-7SOJ4x.js → ManagerOffice-CMJ7laGe.js} +14 -9
- package/dist/McpPluginCatalog-DNeHDrts.d.ts +94 -0
- package/dist/{Message-DyaTBiV7.d.ts → Message-COsMPZSC.d.ts} +2 -2
- package/dist/{ResponsiveSidebarShell-CAmmtQTR.d.ts → ResponsiveSidebarShell-BUBQa_IV.d.ts} +3 -1
- package/dist/{SetupChecklist-Btmy3-_C.js → SetupChecklist-BiWQkKEq.js} +5 -4
- package/dist/{ThinkThreadPicker-yetGX_s5.d.ts → ThinkThreadPicker-DX0lL-P7.d.ts} +3 -0
- package/dist/{Workspace-HzGrWDX3.d.ts → Workspace-mzMZSdts.d.ts} +1 -1
- package/dist/WorkspaceConceptPanel-97ZyVpZI.js +20 -0
- package/dist/{WorkspaceFile-Bouauobc.d.ts → WorkspaceFile-19WP0EU1.d.ts} +1 -1
- package/dist/{WorkspaceFileView-DYPtRVpM.js → WorkspaceFileView-DXgTljKV.js} +2 -1
- package/dist/{WorkspaceMessageResponse-8lOSAbw_.d.ts → WorkspaceMessageResponse-BApg8KZv.d.ts} +1 -1
- package/dist/WorkspaceMountManager-CkLI1B-G.d.ts +33 -0
- package/dist/assets/sigvelo-logo.svg +54 -0
- package/dist/components/agents-sdk/AgentChat.d.ts +6 -2
- package/dist/components/agents-sdk/AgentChat.js +4 -8
- package/dist/components/agents-sdk/EmployeeApp.d.ts +43 -30
- package/dist/components/agents-sdk/EmployeeApp.js +47 -34
- package/dist/components/agents-sdk/EmployeeChat.d.ts +28 -8
- package/dist/components/agents-sdk/EmployeeChat.js +32 -4
- package/dist/components/agents-sdk/EmployeeChrome.d.ts +1 -219
- package/dist/components/agents-sdk/EmployeeChrome.js +101 -102
- package/dist/components/agents-sdk/EmployeeSchedules.d.ts +1 -1
- package/dist/components/agents-sdk/EmployeeSchedules.js +1 -2
- package/dist/components/agents-sdk/EmployeeStartScreen.d.ts +12 -11
- package/dist/components/agents-sdk/EmployeeStartScreen.js +21 -14
- package/dist/components/agents-sdk/ManagerAccountActions.js +0 -1
- package/dist/components/agents-sdk/ManagerOffice.js +1 -2
- package/dist/components/agents-sdk/ManagerOfficeScreens.d.ts +2 -2
- package/dist/components/agents-sdk/ManagerOfficeScreens.js +30 -13
- package/dist/components/agents-sdk/McpPluginCatalog.d.ts +1 -93
- package/dist/components/agents-sdk/McpPluginCatalog.js +3 -3
- package/dist/components/agents-sdk/McpServerPicker.js +3 -3
- package/dist/components/agents-sdk/SubagentRunPanel.d.ts +3 -0
- package/dist/components/agents-sdk/SubagentRunPanel.js +66 -46
- package/dist/components/agents-sdk/ThinkChat.d.ts +1 -1
- package/dist/components/agents-sdk/ThinkChatToolPanels.js +1 -1
- package/dist/components/agents-sdk/ThinkExecutionWorkbench.js +4 -11
- package/dist/components/agents-sdk/ThinkFullApp.d.ts +2 -0
- package/dist/components/agents-sdk/ThinkFullApp.js +2 -0
- package/dist/components/agents-sdk/ThinkRoutineForm.js +1 -1
- package/dist/components/agents-sdk/ThinkThreadPicker.d.ts +1 -1
- package/dist/components/agents-sdk/ThinkThreadPicker.js +32 -19
- package/dist/components/agents-sdk/WorkbenchBack.d.ts +18 -0
- package/dist/components/agents-sdk/WorkbenchBack.js +27 -0
- package/dist/components/agents-sdk/Workspace.d.ts +1 -1
- package/dist/components/agents-sdk/WorkspaceBrowser.d.ts +1 -1
- package/dist/components/agents-sdk/WorkspaceBrowser.js +2 -0
- package/dist/components/agents-sdk/WorkspaceConcept.d.ts +1 -1
- package/dist/components/agents-sdk/WorkspaceExecution.js +7 -4
- package/dist/components/agents-sdk/WorkspaceExplorer.d.ts +4 -1
- package/dist/components/agents-sdk/WorkspaceExplorer.js +13 -4
- package/dist/components/agents-sdk/WorkspaceFile.d.ts +1 -1
- package/dist/components/agents-sdk/WorkspaceFileView.d.ts +1 -1
- package/dist/components/agents-sdk/WorkspaceFileView.js +1 -1
- package/dist/components/agents-sdk/WorkspaceLive.d.ts +2 -2
- package/dist/components/agents-sdk/WorkspaceMessageResponse.d.ts +1 -1
- package/dist/components/agents-sdk/WorkspaceMountManager.d.ts +1 -32
- package/dist/components/agents-sdk/WorkspaceMountManager.js +1 -1
- package/dist/components/agents-sdk/WorkspaceProject.js +3 -1
- package/dist/components/agents-sdk/WorkspaceUserScript.js +3 -1
- package/dist/components/ai-sdk/Artifact.d.ts +1 -1
- package/dist/components/ai-sdk/CodeBlock.d.ts +1 -1
- package/dist/components/ai-sdk/CodeBlock.js +1 -1
- package/dist/components/ai-sdk/Conversation.d.ts +1 -1
- package/dist/components/ai-sdk/Message.d.ts +1 -1
- package/dist/components/ai-sdk/PromptInput.js +1 -1
- package/dist/components/extension/ChatGptSignInScreen.d.ts +1 -1
- package/dist/components/extension/ChatGptSignInScreen.js +60 -185
- package/dist/components/extension/CodexModelSelector.js +2 -6
- package/dist/components/foundations/IconButton.d.ts +1 -1
- package/dist/components/foundations/IconButton.js +7 -4
- package/dist/components/general-purpose/AccountSignInDialog.d.ts +5 -9
- package/dist/components/general-purpose/AccountSignInDialog.js +12 -4
- package/dist/components/general-purpose/BrandLoading.d.ts +14 -0
- package/dist/components/general-purpose/BrandLoading.js +25 -0
- package/dist/components/general-purpose/Commit.d.ts +1 -1
- package/dist/components/general-purpose/EnvironmentVariables.d.ts +1 -1
- package/dist/components/general-purpose/ResponsiveSidebarShell.d.ts +1 -1
- package/dist/components/general-purpose/ResponsiveSidebarShell.js +58 -26
- package/dist/components/general-purpose/SetupChecklist.js +1 -1
- package/dist/components/general-purpose/StatusScreen.d.ts +13 -2
- package/dist/components/general-purpose/StatusScreen.js +27 -3
- package/dist/components/general-purpose/Terminal.d.ts +2 -2
- package/dist/components/general-purpose/WebPreview.d.ts +1 -1
- package/dist/components/nanites/AgentConnection.js +1 -1
- package/dist/{copy-button-OUwOdgEm.d.ts → copy-button-CJYYgCIU.d.ts} +1 -1
- package/dist/styles/activity.css +2 -2
- package/dist/styles/agent-chat.css +6 -105
- package/dist/styles/app-root.css +9 -0
- package/dist/styles/app-top-bar.css +10 -4
- package/dist/styles/avatar.css +2 -2
- package/dist/styles/base.css +6 -2
- package/dist/styles/brand-loading.css +58 -0
- package/dist/styles/brand.test.ts +158 -0
- package/dist/styles/browser-control-overlay.css +22 -0
- package/dist/styles/button.css +22 -1
- package/dist/styles/chatgpt-sign-in-screen.css +111 -225
- package/dist/styles/code-block.css +5 -0
- package/dist/styles/codex-model-selector.css +2 -12
- package/dist/styles/description-list.css +9 -2
- package/dist/styles/employee-app.css +19 -1
- package/dist/styles/employee-chrome.css +35 -5
- package/dist/styles/file-tree.css +15 -2
- package/dist/styles/index.css +1 -0
- package/dist/styles/manager-office.css +80 -55
- package/dist/styles/manager-work.css +5 -11
- package/dist/styles/mcp-plugin-catalog.css +29 -34
- package/dist/styles/mcp-server-picker.css +13 -5
- package/dist/styles/prompt-input.css +3 -13
- package/dist/styles/queue.css +1 -1
- package/dist/styles/recipes.css +9 -2
- package/dist/styles/responsive-sidebar-shell-motion.test.ts +67 -0
- package/dist/styles/responsive-sidebar-shell.css +70 -25
- package/dist/styles/search-field.css +8 -6
- package/dist/styles/subagent-run.css +81 -0
- package/dist/styles/think-execution-workbench.css +0 -17
- package/dist/styles/think-full-app.css +11 -4
- package/dist/styles/think-thread-picker.css +16 -38
- package/dist/styles/workspace-concepts.css +29 -2
- package/dist/styles/workspace-explorer.css +6 -48
- package/dist/utils/structured-code.d.ts +1 -1
- package/package.json +2 -2
- package/dist/styles/extension-status.css +0 -46
|
@@ -1,7 +1,5 @@
|
|
|
1
|
-
/*
|
|
2
|
-
|
|
3
|
-
elevated card (a host's, e.g. the workbench) floats above it. Nothing else
|
|
4
|
-
paints. */
|
|
1
|
+
/* The sidebar shares the Sigvelo canvas. Elevation separates navigation
|
|
2
|
+
from the conversation; selected controls carry the brand accent. */
|
|
5
3
|
.responsive-sidebar-shell {
|
|
6
4
|
container: responsive-sidebar-shell / inline-size;
|
|
7
5
|
display: grid;
|
|
@@ -53,7 +51,8 @@
|
|
|
53
51
|
}
|
|
54
52
|
|
|
55
53
|
.responsive-sidebar-shell__sidebar-leading {
|
|
56
|
-
min-block-size: var(--sigvelo-
|
|
54
|
+
min-block-size: var(--sigvelo-layout-chrome);
|
|
55
|
+
box-sizing: border-box;
|
|
57
56
|
display: flex;
|
|
58
57
|
align-items: center;
|
|
59
58
|
padding-block: var(--sigvelo-spacing-1);
|
|
@@ -63,9 +62,10 @@
|
|
|
63
62
|
.responsive-sidebar-shell__sidebar {
|
|
64
63
|
grid-column: 1;
|
|
65
64
|
grid-row: 1;
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
background: var(--responsive-sidebar-shell-sidebar-surface, var(--sigvelo-color-
|
|
65
|
+
position: relative;
|
|
66
|
+
z-index: var(--sigvelo-z-chrome);
|
|
67
|
+
background: var(--responsive-sidebar-shell-sidebar-surface, var(--sigvelo-color-canvas));
|
|
68
|
+
box-shadow: var(--sigvelo-elevation-floating);
|
|
69
69
|
}
|
|
70
70
|
|
|
71
71
|
.responsive-sidebar-shell__main {
|
|
@@ -142,10 +142,6 @@
|
|
|
142
142
|
z-index: var(--sigvelo-z-panel);
|
|
143
143
|
}
|
|
144
144
|
|
|
145
|
-
.responsive-sidebar-shell[data-sidebar-open="false"] > .responsive-sidebar-shell__frame {
|
|
146
|
-
grid-template-columns: var(--sigvelo-layout-track-fill);
|
|
147
|
-
}
|
|
148
|
-
|
|
149
145
|
.responsive-sidebar-shell[data-sidebar-open="false"]
|
|
150
146
|
> .responsive-sidebar-shell__frame
|
|
151
147
|
> .responsive-sidebar-shell__sidebar {
|
|
@@ -157,10 +153,30 @@
|
|
|
157
153
|
pointer-events: none;
|
|
158
154
|
}
|
|
159
155
|
|
|
160
|
-
.
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
156
|
+
/* Keep both tracks throughout a desktop collapse so grid interpolation works.
|
|
157
|
+
The roster slides at its full width instead of rewrapping into a shrinking rail. */
|
|
158
|
+
@container responsive-sidebar-shell (inline-size > 56rem) {
|
|
159
|
+
.responsive-sidebar-shell__sidebar {
|
|
160
|
+
position: absolute;
|
|
161
|
+
inset-block: 0;
|
|
162
|
+
inset-inline-start: 0;
|
|
163
|
+
inline-size: var(--responsive-sidebar-shell-sidebar-size, var(--sigvelo-layout-sidebar));
|
|
164
|
+
translate: 0 0;
|
|
165
|
+
visibility: visible;
|
|
166
|
+
transition:
|
|
167
|
+
translate var(--sigvelo-motion-duration-layout) var(--sigvelo-motion-ease-change),
|
|
168
|
+
visibility var(--sigvelo-motion-duration-layout);
|
|
169
|
+
}
|
|
170
|
+
|
|
171
|
+
.responsive-sidebar-shell[data-sidebar-open="false"] > .responsive-sidebar-shell__frame {
|
|
172
|
+
grid-template-columns: 0px var(--sigvelo-layout-track-fill);
|
|
173
|
+
}
|
|
174
|
+
|
|
175
|
+
/* The shell already animates available width. A second size transition on
|
|
176
|
+
its conversation would trail behind that motion on every animation frame. */
|
|
177
|
+
.responsive-sidebar-shell__main .think-full-app__chat-surface {
|
|
178
|
+
transition: none;
|
|
179
|
+
}
|
|
164
180
|
}
|
|
165
181
|
|
|
166
182
|
/* 56rem matches --sigvelo-layout-break-compact. Container queries cannot read var(). */
|
|
@@ -171,6 +187,7 @@
|
|
|
171
187
|
);
|
|
172
188
|
|
|
173
189
|
grid-template-columns: var(--sigvelo-layout-track-fill);
|
|
190
|
+
transition: none;
|
|
174
191
|
}
|
|
175
192
|
|
|
176
193
|
.responsive-sidebar-shell__sidebar,
|
|
@@ -179,10 +196,14 @@
|
|
|
179
196
|
grid-row: 1;
|
|
180
197
|
}
|
|
181
198
|
|
|
182
|
-
.responsive-sidebar-
|
|
183
|
-
|
|
199
|
+
.responsive-sidebar-shell[data-sidebar-open]
|
|
200
|
+
> .responsive-sidebar-shell__frame
|
|
201
|
+
> .responsive-sidebar-shell__sidebar {
|
|
202
|
+
position: absolute;
|
|
184
203
|
z-index: calc(var(--sigvelo-z-chrome) + 3);
|
|
185
|
-
inset-inline
|
|
204
|
+
inset-inline: 0;
|
|
205
|
+
inset-block-start: calc(var(--responsive-sidebar-compact-bar-size) + var(--sigvelo-spacing-1));
|
|
206
|
+
inset-block-end: auto;
|
|
186
207
|
inline-size: min(calc(100cqi - var(--sigvelo-layout-gutter)), 34rem);
|
|
187
208
|
max-inline-size: none;
|
|
188
209
|
block-size: auto;
|
|
@@ -192,14 +213,15 @@
|
|
|
192
213
|
);
|
|
193
214
|
align-self: start;
|
|
194
215
|
/* Sit under the title trigger. Covering it ate the click that closes it. */
|
|
195
|
-
margin-block
|
|
216
|
+
margin-block: 0;
|
|
217
|
+
margin-inline: auto;
|
|
196
218
|
overflow: hidden;
|
|
197
219
|
border-radius: var(--sigvelo-radius-lg);
|
|
198
|
-
background-color: var(--sigvelo-color-
|
|
220
|
+
background-color: var(--responsive-sidebar-shell-sidebar-surface, var(--sigvelo-color-canvas));
|
|
199
221
|
box-shadow: var(--sigvelo-elevation-overlay);
|
|
200
222
|
visibility: visible;
|
|
201
223
|
opacity: 1;
|
|
202
|
-
translate:
|
|
224
|
+
translate: 0 0;
|
|
203
225
|
scale: 1;
|
|
204
226
|
transform-origin: top center;
|
|
205
227
|
transition:
|
|
@@ -222,15 +244,25 @@
|
|
|
222
244
|
display: none;
|
|
223
245
|
}
|
|
224
246
|
|
|
247
|
+
.responsive-sidebar-shell[data-sidebar-toggle-placement="sidebar"]
|
|
248
|
+
.responsive-sidebar-shell__toggle--sidebar-fallback {
|
|
249
|
+
display: inline-flex;
|
|
250
|
+
}
|
|
251
|
+
|
|
225
252
|
/* The closed-sidebar fallback has a deliberately specific wide-layout
|
|
226
253
|
selector above. When the compact title owns drawer disclosure, beat that
|
|
227
254
|
selector explicitly so the bar never presents two controls for one action. */
|
|
228
|
-
.responsive-sidebar-shell[data-sidebar-toggle-placement="sidebar"][data-sidebar-open
|
|
255
|
+
.responsive-sidebar-shell[data-sidebar-toggle-placement="sidebar"][data-sidebar-open]
|
|
229
256
|
[data-compact-leading]
|
|
230
257
|
.responsive-sidebar-shell__toggle--sidebar-fallback {
|
|
231
258
|
display: none;
|
|
232
259
|
}
|
|
233
260
|
|
|
261
|
+
.responsive-sidebar-shell[data-sidebar-toggle-placement="sidebar"]
|
|
262
|
+
.responsive-sidebar-shell__sidebar {
|
|
263
|
+
grid-template-rows: minmax(0, 1fr);
|
|
264
|
+
}
|
|
265
|
+
|
|
234
266
|
.responsive-sidebar-shell[data-sidebar-toggle-placement="sidebar"]
|
|
235
267
|
.responsive-sidebar-shell__sidebar-leading {
|
|
236
268
|
display: none;
|
|
@@ -242,7 +274,7 @@
|
|
|
242
274
|
|
|
243
275
|
.responsive-sidebar-shell__title-trigger {
|
|
244
276
|
inline-size: auto;
|
|
245
|
-
max-inline-size:
|
|
277
|
+
max-inline-size: 100%;
|
|
246
278
|
min-inline-size: 0;
|
|
247
279
|
min-block-size: var(--sigvelo-density-compact-control-height);
|
|
248
280
|
display: inline-flex;
|
|
@@ -282,7 +314,7 @@
|
|
|
282
314
|
> .responsive-sidebar-shell__sidebar {
|
|
283
315
|
visibility: hidden;
|
|
284
316
|
opacity: 0;
|
|
285
|
-
translate:
|
|
317
|
+
translate: 0 calc(var(--sigvelo-motion-distance-sm) * -1);
|
|
286
318
|
scale: 0.97;
|
|
287
319
|
transition-timing-function: var(--sigvelo-motion-ease-exit);
|
|
288
320
|
}
|
|
@@ -310,3 +342,16 @@
|
|
|
310
342
|
outline-offset: -0.25rem;
|
|
311
343
|
}
|
|
312
344
|
}
|
|
345
|
+
|
|
346
|
+
/* Panel controls follow available main-column width, independently of the
|
|
347
|
+
drawer breakpoint. Keep a way back when an open desktop rail uses space. */
|
|
348
|
+
.responsive-sidebar-shell__main[data-content-compact="true"]
|
|
349
|
+
.responsive-sidebar-shell__compact-leading {
|
|
350
|
+
display: contents;
|
|
351
|
+
}
|
|
352
|
+
|
|
353
|
+
.responsive-sidebar-shell__main[data-content-compact="true"]
|
|
354
|
+
[data-compact-leading="custom"]
|
|
355
|
+
.responsive-sidebar-shell__toggle {
|
|
356
|
+
display: none;
|
|
357
|
+
}
|
|
@@ -1,10 +1,12 @@
|
|
|
1
1
|
.search-field {
|
|
2
|
-
--sigvelo-recipe-control-height: var(--sigvelo-control-height
|
|
3
|
-
--sigvelo-recipe-control-padding-inline: var(--sigvelo-control-padding-inline
|
|
4
|
-
--sigvelo-recipe-control-font-size: var(--sigvelo-control-
|
|
5
|
-
--sigvelo-recipe-control-line-height: var(--sigvelo-control-line-height
|
|
6
|
-
--sigvelo-recipe-control-icon-size: var(--sigvelo-control-icon-size
|
|
7
|
-
--sigvelo-recipe-control-radius: var(--sigvelo-radius-
|
|
2
|
+
--sigvelo-recipe-control-height: var(--sigvelo-density-compact-control-height);
|
|
3
|
+
--sigvelo-recipe-control-padding-inline: var(--sigvelo-density-compact-control-padding-inline);
|
|
4
|
+
--sigvelo-recipe-control-font-size: var(--sigvelo-density-compact-control-font-size);
|
|
5
|
+
--sigvelo-recipe-control-line-height: var(--sigvelo-density-compact-control-line-height);
|
|
6
|
+
--sigvelo-recipe-control-icon-size: var(--sigvelo-density-compact-control-icon-size);
|
|
7
|
+
--sigvelo-recipe-control-radius: var(--sigvelo-radius-sm);
|
|
8
|
+
--sigvelo-recipe-focus-shadow: var(--sigvelo-recipe-focus-shadow-inset);
|
|
9
|
+
--sigvelo-focus-offset: -2px;
|
|
8
10
|
}
|
|
9
11
|
|
|
10
12
|
.search-field__control {
|
|
@@ -61,6 +61,81 @@
|
|
|
61
61
|
box-shadow: none;
|
|
62
62
|
}
|
|
63
63
|
|
|
64
|
+
/* Delegated work sits in a quiet, bordered card above the composer,
|
|
65
|
+
matching its width while keeping a small separation between the surfaces. */
|
|
66
|
+
.agent-chat__prompt-tray[data-subagent-run-panel] {
|
|
67
|
+
--prompt-input-tray-overlap: 0px;
|
|
68
|
+
|
|
69
|
+
inline-size: min(
|
|
70
|
+
100%,
|
|
71
|
+
var(--agent-chat-content-max-inline-size, var(--sigvelo-measure-wide-block))
|
|
72
|
+
);
|
|
73
|
+
margin-block-end: var(--sigvelo-spacing-2);
|
|
74
|
+
padding: var(--sigvelo-spacing-2) var(--sigvelo-spacing-1);
|
|
75
|
+
border-radius: var(--sigvelo-radius-xl);
|
|
76
|
+
background: var(--sigvelo-color-surface-raised);
|
|
77
|
+
border: var(--sigvelo-border-width) var(--sigvelo-border-style)
|
|
78
|
+
var(--sigvelo-color-neutral-border-subtle);
|
|
79
|
+
box-shadow: none;
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
.subagent-run__panel-header {
|
|
83
|
+
display: flex;
|
|
84
|
+
flex-wrap: wrap;
|
|
85
|
+
align-items: center;
|
|
86
|
+
gap: var(--sigvelo-spacing-1);
|
|
87
|
+
min-inline-size: 0;
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
.subagent-run__panel-header > .queue__section-trigger {
|
|
91
|
+
flex: 1 1 9rem;
|
|
92
|
+
min-inline-size: 0;
|
|
93
|
+
}
|
|
94
|
+
|
|
95
|
+
.subagent-run__completed-toggle {
|
|
96
|
+
flex: 0 0 auto;
|
|
97
|
+
max-inline-size: 100%;
|
|
98
|
+
margin-inline-start: auto;
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
@media (any-pointer: coarse) {
|
|
102
|
+
.subagent-run__panel-header > .queue__section-trigger,
|
|
103
|
+
.subagent-run__completed-toggle {
|
|
104
|
+
min-block-size: var(--sigvelo-spacing-11);
|
|
105
|
+
}
|
|
106
|
+
}
|
|
107
|
+
|
|
108
|
+
[data-subagent-run-panel] .queue__item + .queue__item {
|
|
109
|
+
box-shadow: inset 0 var(--sigvelo-border-width) 0 var(--sigvelo-color-neutral-border-subtle);
|
|
110
|
+
}
|
|
111
|
+
|
|
112
|
+
[data-subagent-run-panel] .subagent-run__selector[data-surface="plain"] {
|
|
113
|
+
font-size: min(var(--sigvelo-text-compact), var(--sigvelo-text-prose));
|
|
114
|
+
}
|
|
115
|
+
|
|
116
|
+
[data-subagent-run-panel] .subagent-run__title {
|
|
117
|
+
font-weight: var(--sigvelo-font-weight-normal);
|
|
118
|
+
}
|
|
119
|
+
|
|
120
|
+
[data-subagent-run-panel] .subagent-run__status {
|
|
121
|
+
font-size: min(var(--sigvelo-text-xs), var(--sigvelo-text-prose));
|
|
122
|
+
}
|
|
123
|
+
|
|
124
|
+
[data-subagent-run-panel] .queue__section-trigger {
|
|
125
|
+
min-block-size: var(--sigvelo-control-height-xs);
|
|
126
|
+
font-weight: var(--sigvelo-font-weight-normal);
|
|
127
|
+
text-transform: none;
|
|
128
|
+
letter-spacing: normal;
|
|
129
|
+
}
|
|
130
|
+
|
|
131
|
+
[data-subagent-run-panel] .queue__section-trigger:focus-visible {
|
|
132
|
+
box-shadow: var(--sigvelo-recipe-focus-shadow-inset);
|
|
133
|
+
}
|
|
134
|
+
|
|
135
|
+
[data-subagent-run-panel] .queue__section-content {
|
|
136
|
+
gap: var(--sigvelo-spacing-1);
|
|
137
|
+
}
|
|
138
|
+
|
|
64
139
|
/* A delegated row is two text lines (name over status). The shared compact
|
|
65
140
|
queue caps its viewport at whole rows of --queue-row-block-size, so the
|
|
66
141
|
row measure has to say what the row actually is. */
|
|
@@ -262,6 +337,12 @@
|
|
|
262
337
|
}
|
|
263
338
|
|
|
264
339
|
@media (forced-colors: active) {
|
|
340
|
+
.agent-chat__prompt-tray[data-subagent-run-panel] {
|
|
341
|
+
border: var(--sigvelo-border-width) var(--sigvelo-border-style) CanvasText;
|
|
342
|
+
background: Canvas;
|
|
343
|
+
box-shadow: none;
|
|
344
|
+
}
|
|
345
|
+
|
|
265
346
|
.subagent-run__selector {
|
|
266
347
|
border: var(--sigvelo-border-style) var(--sigvelo-border-width) CanvasText;
|
|
267
348
|
}
|
|
@@ -59,29 +59,12 @@
|
|
|
59
59
|
|
|
60
60
|
/* Roster column cap (the Ploy number) so full-page routes don't stretch rows
|
|
61
61
|
across the whole viewport; narrow hosts are unaffected. */
|
|
62
|
-
.think-execution-workbench__list-header,
|
|
63
62
|
.think-execution-workbench__list,
|
|
64
63
|
.think-execution-workbench__empty {
|
|
65
64
|
inline-size: min(100%, var(--sigvelo-layout-content));
|
|
66
65
|
margin-inline: auto;
|
|
67
66
|
}
|
|
68
67
|
|
|
69
|
-
.think-execution-workbench__list-header {
|
|
70
|
-
display: flex;
|
|
71
|
-
align-items: center;
|
|
72
|
-
justify-content: space-between;
|
|
73
|
-
gap: var(--sigvelo-layout-cluster);
|
|
74
|
-
min-block-size: var(--sigvelo-control-height-lg);
|
|
75
|
-
padding-inline: var(--sigvelo-layout-gutter);
|
|
76
|
-
}
|
|
77
|
-
|
|
78
|
-
.think-execution-workbench__list-header h3 {
|
|
79
|
-
margin: 0;
|
|
80
|
-
font-size: var(--sigvelo-text-compact);
|
|
81
|
-
font-weight: var(--sigvelo-font-weight-semibold);
|
|
82
|
-
line-height: var(--sigvelo-leading-tight);
|
|
83
|
-
}
|
|
84
|
-
|
|
85
68
|
/* Same hairline-bounded band the routine library gives its empty run section. */
|
|
86
69
|
.think-execution-workbench__empty {
|
|
87
70
|
--sigvelo-recipe-empty-state-padding-block: var(--sigvelo-layout-stack);
|
|
@@ -62,7 +62,7 @@ body.is-resizing-side-panel .think-full-app__chat-surface {
|
|
|
62
62
|
margin-inline-start: var(--sigvelo-layout-gap);
|
|
63
63
|
overflow: hidden;
|
|
64
64
|
border-radius: var(--sigvelo-radius-xl);
|
|
65
|
-
background: var(--sigvelo-color-surface
|
|
65
|
+
background: var(--sigvelo-color-surface);
|
|
66
66
|
box-shadow: var(--sigvelo-elevation-floating);
|
|
67
67
|
}
|
|
68
68
|
|
|
@@ -91,8 +91,10 @@ body.is-resizing-side-panel .think-full-app__chat-surface {
|
|
|
91
91
|
translate: -50% -50%;
|
|
92
92
|
}
|
|
93
93
|
|
|
94
|
+
/* Collapse based on available content width, including when a desktop
|
|
95
|
+
sidebar leaves too little space for both conversation and workbench. */
|
|
94
96
|
@container think-full-app (inline-size <= 56rem) {
|
|
95
|
-
.think-full-app__view-scope {
|
|
97
|
+
.think-full-app .think-full-app__view-scope {
|
|
96
98
|
grid-template-columns: var(--sigvelo-layout-track-fill);
|
|
97
99
|
margin: 0;
|
|
98
100
|
overflow: hidden;
|
|
@@ -111,7 +113,7 @@ body.is-resizing-side-panel .think-full-app__chat-surface {
|
|
|
111
113
|
display: none;
|
|
112
114
|
}
|
|
113
115
|
|
|
114
|
-
.think-full-app__aside {
|
|
116
|
+
.think-full-app .think-full-app__aside {
|
|
115
117
|
grid-column: 1;
|
|
116
118
|
margin: 0;
|
|
117
119
|
border: 0;
|
|
@@ -120,7 +122,7 @@ body.is-resizing-side-panel .think-full-app__chat-surface {
|
|
|
120
122
|
box-shadow: none;
|
|
121
123
|
}
|
|
122
124
|
|
|
123
|
-
.think-full-app__resizer {
|
|
125
|
+
.think-full-app .think-full-app__resizer {
|
|
124
126
|
display: none;
|
|
125
127
|
}
|
|
126
128
|
}
|
|
@@ -135,3 +137,8 @@ body.is-resizing-side-panel .think-full-app__chat-surface {
|
|
|
135
137
|
box-shadow: none;
|
|
136
138
|
}
|
|
137
139
|
}
|
|
140
|
+
|
|
141
|
+
/* Hidden feature views retain the conversation runtime and queued work. */
|
|
142
|
+
.think-full-app[hidden] {
|
|
143
|
+
display: none;
|
|
144
|
+
}
|
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
block-size: 100%;
|
|
5
5
|
min-block-size: 0;
|
|
6
6
|
display: grid;
|
|
7
|
-
grid-template-rows: auto auto var(--sigvelo-layout-track-fill)
|
|
7
|
+
grid-template-rows: auto auto var(--sigvelo-layout-track-fill);
|
|
8
8
|
overflow: hidden;
|
|
9
9
|
border-inline-end: 0;
|
|
10
10
|
padding: var(--sigvelo-spacing-1) var(--sigvelo-spacing-2) var(--sigvelo-spacing-2);
|
|
@@ -30,16 +30,15 @@
|
|
|
30
30
|
min-inline-size: 0;
|
|
31
31
|
margin: 0;
|
|
32
32
|
flex: 1 1 auto;
|
|
33
|
-
color: var(--sigvelo-color-text);
|
|
33
|
+
color: var(--sigvelo-color-text-muted);
|
|
34
34
|
font-size: var(--sigvelo-text-compact);
|
|
35
|
-
font-weight: var(--sigvelo-font-weight-
|
|
35
|
+
font-weight: var(--sigvelo-font-weight-normal);
|
|
36
|
+
text-transform: uppercase;
|
|
37
|
+
letter-spacing: var(--sigvelo-tracking-wide);
|
|
36
38
|
line-height: var(--sigvelo-text-compact-leading);
|
|
37
39
|
}
|
|
38
40
|
|
|
39
41
|
.think-thread-picker__search {
|
|
40
|
-
--sigvelo-recipe-control-height: var(--sigvelo-density-compact-control-height);
|
|
41
|
-
--sigvelo-recipe-control-radius: var(--sigvelo-radius-sm);
|
|
42
|
-
|
|
43
42
|
padding: 0 0 var(--sigvelo-spacing-2);
|
|
44
43
|
}
|
|
45
44
|
|
|
@@ -138,15 +137,15 @@
|
|
|
138
137
|
}
|
|
139
138
|
|
|
140
139
|
.think-thread-picker__thread[aria-current="page"] {
|
|
141
|
-
background:
|
|
142
|
-
color: var(--sigvelo-color-text);
|
|
140
|
+
background: var(--sigvelo-color-primary-bg-subtle);
|
|
141
|
+
color: var(--sigvelo-color-primary-text-on-subtle);
|
|
143
142
|
font-weight: var(--sigvelo-font-weight-semibold);
|
|
144
143
|
}
|
|
145
144
|
|
|
146
145
|
.think-thread-picker__thread[aria-current="page"]:hover:not([data-disabled]),
|
|
147
146
|
.think-thread-picker__item:hover
|
|
148
147
|
.think-thread-picker__thread[aria-current="page"]:not([data-disabled]) {
|
|
149
|
-
background:
|
|
148
|
+
background: var(--sigvelo-color-primary-bg-subtle);
|
|
150
149
|
}
|
|
151
150
|
|
|
152
151
|
.think-thread-picker__item:hover
|
|
@@ -282,24 +281,18 @@
|
|
|
282
281
|
margin: var(--sigvelo-spacing-2);
|
|
283
282
|
}
|
|
284
283
|
|
|
285
|
-
.think-thread-picker__footer {
|
|
286
|
-
display: flex;
|
|
287
|
-
padding: var(--sigvelo-spacing-0-5) var(--sigvelo-spacing-1)
|
|
288
|
-
calc(var(--sigvelo-spacing-0-5) + env(safe-area-inset-bottom, 0px));
|
|
289
|
-
border-block-start: var(--sigvelo-border-style) var(--sigvelo-border-width)
|
|
290
|
-
var(--sigvelo-color-neutral-border-subtle);
|
|
291
|
-
}
|
|
292
|
-
|
|
293
284
|
.think-thread-picker__create {
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
285
|
+
flex: 0 0 auto;
|
|
286
|
+
inline-size: var(--sigvelo-density-compact-control-height);
|
|
287
|
+
block-size: var(--sigvelo-density-compact-control-height);
|
|
288
|
+
padding: var(--sigvelo-spacing-1);
|
|
289
|
+
color: var(--sigvelo-color-text-muted);
|
|
299
290
|
}
|
|
300
291
|
|
|
301
292
|
.think-thread-picker__create svg {
|
|
302
293
|
flex: 0 0 auto;
|
|
294
|
+
inline-size: var(--sigvelo-density-compact-control-icon-size);
|
|
295
|
+
block-size: var(--sigvelo-density-compact-control-icon-size);
|
|
303
296
|
}
|
|
304
297
|
|
|
305
298
|
/* 56rem matches --sigvelo-layout-break-compact. Container queries cannot read var(). */
|
|
@@ -308,25 +301,10 @@
|
|
|
308
301
|
block-size: auto;
|
|
309
302
|
max-block-size: inherit;
|
|
310
303
|
grid-template-rows: auto auto auto;
|
|
304
|
+
align-content: start;
|
|
311
305
|
padding: var(--sigvelo-spacing-1) var(--sigvelo-spacing-2) var(--sigvelo-spacing-2);
|
|
312
306
|
}
|
|
313
307
|
|
|
314
|
-
.think-thread-picker__header {
|
|
315
|
-
display: none;
|
|
316
|
-
}
|
|
317
|
-
|
|
318
|
-
.think-thread-picker__search {
|
|
319
|
-
--sigvelo-recipe-control-height: var(--sigvelo-density-compact-control-height);
|
|
320
|
-
--sigvelo-recipe-control-font-size: var(--sigvelo-density-compact-control-font-size);
|
|
321
|
-
--sigvelo-recipe-control-icon-size: var(--sigvelo-density-compact-control-icon-size);
|
|
322
|
-
|
|
323
|
-
padding: 0 0 var(--sigvelo-spacing-2);
|
|
324
|
-
}
|
|
325
|
-
|
|
326
|
-
.think-thread-picker__search .field__control:focus-visible {
|
|
327
|
-
box-shadow: var(--sigvelo-recipe-focus-shadow-inset);
|
|
328
|
-
}
|
|
329
|
-
|
|
330
308
|
.think-thread-picker__nav,
|
|
331
309
|
.think-thread-picker__scroll,
|
|
332
310
|
.think-thread-picker__viewport {
|
|
@@ -4,8 +4,9 @@
|
|
|
4
4
|
min-inline-size: 0;
|
|
5
5
|
min-block-size: 0;
|
|
6
6
|
block-size: 100%;
|
|
7
|
-
|
|
8
|
-
|
|
7
|
+
display: flex;
|
|
8
|
+
flex-direction: column;
|
|
9
|
+
overflow: hidden;
|
|
9
10
|
color: var(--sigvelo-color-text);
|
|
10
11
|
background: var(--sigvelo-color-canvas);
|
|
11
12
|
}
|
|
@@ -26,3 +27,29 @@
|
|
|
26
27
|
color: CanvasText;
|
|
27
28
|
}
|
|
28
29
|
}
|
|
30
|
+
|
|
31
|
+
.workspace-concept-panel__header {
|
|
32
|
+
display: flex;
|
|
33
|
+
align-items: center;
|
|
34
|
+
flex: none;
|
|
35
|
+
min-block-size: var(--sigvelo-layout-chrome);
|
|
36
|
+
padding-inline: var(--sigvelo-layout-gutter);
|
|
37
|
+
border-block-end: var(--sigvelo-border-width) var(--sigvelo-border-style)
|
|
38
|
+
var(--sigvelo-color-neutral-border-subtle);
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
.workspace-concept-panel__title {
|
|
42
|
+
margin: 0;
|
|
43
|
+
color: var(--sigvelo-color-primary-text);
|
|
44
|
+
font-size: var(--sigvelo-density-compact-control-font-size);
|
|
45
|
+
font-weight: var(--sigvelo-font-weight-semibold);
|
|
46
|
+
line-height: var(--sigvelo-leading-tight);
|
|
47
|
+
letter-spacing: var(--sigvelo-tracking-tight);
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
.workspace-concept-panel__body {
|
|
51
|
+
flex: 1;
|
|
52
|
+
min-block-size: 0;
|
|
53
|
+
overflow: auto;
|
|
54
|
+
padding: var(--sigvelo-layout-gutter);
|
|
55
|
+
}
|
|
@@ -126,48 +126,14 @@
|
|
|
126
126
|
|
|
127
127
|
.workspace-explorer__tree {
|
|
128
128
|
flex: 1;
|
|
129
|
-
min-block-size: 0;
|
|
130
|
-
border: 0;
|
|
131
|
-
border-radius: 0;
|
|
132
|
-
background: transparent;
|
|
133
|
-
padding-block: var(--sigvelo-spacing-1);
|
|
134
|
-
padding-inline: var(--sigvelo-spacing-1-5);
|
|
135
|
-
}
|
|
136
|
-
|
|
137
|
-
.workspace-explorer__tree .file-tree__node {
|
|
138
|
-
min-block-size: var(--sigvelo-density-compact-control-height);
|
|
139
|
-
gap: var(--sigvelo-density-compact-control-gap);
|
|
140
|
-
padding-block: var(--sigvelo-spacing-0-5);
|
|
141
|
-
padding-inline-end: var(--sigvelo-spacing-1-5);
|
|
142
|
-
border-radius: var(--sigvelo-radius-sm);
|
|
143
|
-
color: var(--sigvelo-color-text-muted);
|
|
144
|
-
font-size: var(--sigvelo-density-compact-control-font-size);
|
|
145
|
-
line-height: var(--sigvelo-leading-snug);
|
|
146
129
|
}
|
|
147
130
|
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
inline-size: var(--sigvelo-density-compact-control-icon-size);
|
|
155
|
-
}
|
|
156
|
-
|
|
157
|
-
.workspace-explorer__tree .file-tree__node--folder .file-tree__icon {
|
|
158
|
-
color: currentColor;
|
|
159
|
-
}
|
|
160
|
-
|
|
161
|
-
.workspace-explorer__tree .file-tree__node[data-selected] {
|
|
162
|
-
background-color: var(--sigvelo-color-neutral-bg-subtle);
|
|
163
|
-
color: var(--sigvelo-color-text);
|
|
164
|
-
font-weight: var(--sigvelo-font-weight-normal);
|
|
165
|
-
}
|
|
166
|
-
|
|
167
|
-
.workspace-explorer__tree .file-tree__node:is([data-focused], :focus-visible) {
|
|
168
|
-
outline: none;
|
|
169
|
-
background-color: var(--sigvelo-color-neutral-bg-subtle);
|
|
170
|
-
box-shadow: inset 0 0 0 var(--sigvelo-border-width) var(--sigvelo-color-neutral-border-muted);
|
|
131
|
+
/* The outer workbench control owns back navigation when the panel is compact. */
|
|
132
|
+
.responsive-sidebar-shell:has([data-workbench-back])
|
|
133
|
+
> .responsive-sidebar-shell__frame
|
|
134
|
+
> .responsive-sidebar-shell__main[data-content-compact="true"]
|
|
135
|
+
[data-workspace-back] {
|
|
136
|
+
display: none;
|
|
171
137
|
}
|
|
172
138
|
|
|
173
139
|
.workspace-explorer__empty {
|
|
@@ -502,14 +468,6 @@
|
|
|
502
468
|
}
|
|
503
469
|
|
|
504
470
|
@media (forced-colors: active) {
|
|
505
|
-
.workspace-explorer__tree .file-tree__node:is([data-focused], :focus-visible) {
|
|
506
|
-
outline: var(--sigvelo-focus-ring-forced);
|
|
507
|
-
outline-offset: -2px;
|
|
508
|
-
background-color: Canvas;
|
|
509
|
-
color: CanvasText;
|
|
510
|
-
box-shadow: none;
|
|
511
|
-
}
|
|
512
|
-
|
|
513
471
|
.workspace-explorer__image-trigger,
|
|
514
472
|
.workspace-explorer__pdf,
|
|
515
473
|
.workspace-media-lightbox .yarl__button {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@mcp-b/react-components",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.52.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.52.0"
|
|
58
58
|
},
|
|
59
59
|
"devDependencies": {
|
|
60
60
|
"@ai-sdk/react": "^3.0.249",
|
|
@@ -1,46 +0,0 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* Standalone extension interstitial. It intentionally does not load the token
|
|
3
|
-
* cascade; system colors follow the user's light, dark, and forced-color theme.
|
|
4
|
-
*/
|
|
5
|
-
|
|
6
|
-
.extension-status-page {
|
|
7
|
-
background: Canvas;
|
|
8
|
-
color: CanvasText;
|
|
9
|
-
color-scheme: light dark;
|
|
10
|
-
display: grid;
|
|
11
|
-
font:
|
|
12
|
-
0.875rem/1.5 system-ui,
|
|
13
|
-
-apple-system,
|
|
14
|
-
BlinkMacSystemFont,
|
|
15
|
-
"Segoe UI",
|
|
16
|
-
Roboto,
|
|
17
|
-
sans-serif;
|
|
18
|
-
margin: 0;
|
|
19
|
-
min-block-size: 100dvb;
|
|
20
|
-
place-items: center;
|
|
21
|
-
}
|
|
22
|
-
|
|
23
|
-
.extension-status {
|
|
24
|
-
/* Mirrors --sigvelo-layout-gutter without loading the document token sheet. */
|
|
25
|
-
display: grid;
|
|
26
|
-
gap: 0.75rem;
|
|
27
|
-
justify-items: center;
|
|
28
|
-
max-inline-size: 30rem;
|
|
29
|
-
padding: 0.75rem;
|
|
30
|
-
text-align: center;
|
|
31
|
-
}
|
|
32
|
-
|
|
33
|
-
.extension-status h1 {
|
|
34
|
-
font-size: inherit;
|
|
35
|
-
font-weight: 600;
|
|
36
|
-
margin: 0;
|
|
37
|
-
}
|
|
38
|
-
|
|
39
|
-
.extension-status p {
|
|
40
|
-
color: GrayText;
|
|
41
|
-
margin: 0;
|
|
42
|
-
}
|
|
43
|
-
|
|
44
|
-
.extension-status button {
|
|
45
|
-
font: inherit;
|
|
46
|
-
}
|